這篇文章主要介紹小程序怎么使用分包加載，文中介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們一定要看完！

專(zhuān)注于為中小企業(yè)提供網(wǎng)站建設(shè)、成都網(wǎng)站制作服務(wù),電腦端+手機(jī)端+微信端的三站合一,更高效的管理,為中小企業(yè)法庫(kù)免費(fèi)做網(wǎng)站提供優(yōu)質(zhì)的服務(wù)。我們立足成都，凝聚了一批互聯(lián)網(wǎng)行業(yè)人才，有力地推動(dòng)了成百上千家企業(yè)的穩(wěn)健成長(zhǎng)，幫助中小企業(yè)通過(guò)網(wǎng)站建設(shè)實(shí)現(xiàn)規(guī)模擴(kuò)充和轉(zhuǎn)變。

"離線(xiàn)包"機(jī)制

微信小程序采用的是類(lèi)似離線(xiàn)包加載方案，以轉(zhuǎn)轉(zhuǎn)小程序?yàn)槔?dāng)用戶(hù)第一次打開(kāi)時(shí)會(huì)先下載好所有代碼，然后再加載頁(yè)面；當(dāng)用戶(hù)再次進(jìn)入轉(zhuǎn)轉(zhuǎn)小程序時(shí)，會(huì)直接使用已下載的代碼，省去了代碼下載的過(guò)程，打開(kāi)速度更快。

看似很美好的設(shè)計(jì)，但有兩個(gè)問(wèn)題：

• 第一次打開(kāi)轉(zhuǎn)轉(zhuǎn)小程序時(shí)白屏?xí)r間很長(zhǎng)，因?yàn)橐螺d接近2.5M的代碼量，也就是說(shuō)你的代碼越多，白屏?xí)r間越長(zhǎng)，而轉(zhuǎn)轉(zhuǎn)APP采用的網(wǎng)頁(yè)離線(xiàn)機(jī)制體驗(yàn)更佳：在用戶(hù)打開(kāi)APP時(shí)就下載/更新離線(xiàn)包，這樣在用戶(hù)進(jìn)入對(duì)應(yīng)的網(wǎng)頁(yè)時(shí)，代碼已經(jīng)下載好了，沒(méi)有漫長(zhǎng)的白屏過(guò)程。

• 代碼有部分更新時(shí)，沒(méi)辦法進(jìn)行增量更新，導(dǎo)致每次發(fā)版后，用戶(hù)都需要重新下載全部代碼

問(wèn)題看似不大，但對(duì)轉(zhuǎn)轉(zhuǎn)有很大影響，例如進(jìn)行微信廣告投放時(shí)，用戶(hù)從點(diǎn)擊廣告到加載第一個(gè)頁(yè)面之間的流失率竟能到達(dá)40%，這顯然是FE無(wú)法接受的性能，而小程序分包加載機(jī)制能夠在一定程度上解決上述問(wèn)題。

分包加載

小程序的分包加載機(jī)制實(shí)際上是離線(xiàn)包和M頁(yè)的一種結(jié)合機(jī)制，即你可以把代碼劃分成主包+N個(gè)分包，官方定義：

在小程序啟動(dòng)時(shí)，默認(rèn)會(huì)下載主包并啟動(dòng)主包內(nèi)頁(yè)面，如果用戶(hù)需要打開(kāi)分包內(nèi)某個(gè)頁(yè)面，客戶(hù)端會(huì)把對(duì)應(yīng)分包下載下來(lái)，下載完成后再進(jìn)行展示。

總結(jié)如下：

• 打開(kāi)小程序，默認(rèn)先加載主包

• 進(jìn)入分包頁(yè)面時(shí)，再加載對(duì)應(yīng)分包

特性

• 1.7.3 及以上基礎(chǔ)庫(kù)開(kāi)始支持，不支持的版本默認(rèn)使用整包的方式

• 整個(gè)小程序所有分包大小不超過(guò) 4M，單個(gè)分包/主包大小不能超過(guò) 2M

• 分包數(shù)量目前沒(méi)有限制，也就是說(shuō)你可以放N個(gè)分包，甚至每個(gè)頁(yè)面一個(gè)分包

• 入口頁(yè)面/TAB頁(yè)面必須在主包里

關(guān)于主包

• 第一次進(jìn)入小程序，默認(rèn)下載主包代碼

• 分包以外的所有代碼，都會(huì)被打入主包

• 分包內(nèi)代碼可以引用主包內(nèi)代碼

關(guān)于分包

• 因?yàn)榇嬖谫Y源依賴(lài)關(guān)系，微信的機(jī)制是先下載主包，后下載分包

• 分包目錄不能在主包目錄下面

• 分包可以引用自己包內(nèi)、主包內(nèi)的資源，不能引用其他分包內(nèi)的資源

這樣的好處是進(jìn)入主包頁(yè)面時(shí)，需要下載的代碼量小了很多，白屏?xí)r間更短，體驗(yàn)更佳。

在小程序開(kāi)發(fā)的過(guò)程中，小程序的體積會(huì)隨著版本的迭代變的越來(lái)越大，這時(shí)候我們就希望能夠?qū)⑿〕绦蚍殖啥鄠€(gè)包從服務(wù)器下載，這樣既可以加快首屏的渲染也便于后續(xù)按需加載的實(shí)現(xiàn)。小程序在微信客戶(hù)端 6.6.0，基礎(chǔ)庫(kù) 1.7.3 及以上版本開(kāi)始支持 分包功能。

在構(gòu)建小程序分包項(xiàng)目時(shí)，構(gòu)建會(huì)輸出一個(gè)或多個(gè)分包。每個(gè)使用分包小程序必定含有一個(gè)主包。所謂的主包，即放置默認(rèn)啟動(dòng)頁(yè)面/TabBar 頁(yè)面，以及一些所有分包都需用到公共資源/JS 腳本；而分包則是根據(jù)開(kāi)發(fā)者的配置進(jìn)行劃分。
在小程序啟動(dòng)時(shí)，默認(rèn)會(huì)下載主包并啟動(dòng)主包內(nèi)頁(yè)面，當(dāng)用戶(hù)進(jìn)入分包內(nèi)某個(gè)頁(yè)面時(shí)，客戶(hù)端會(huì)把對(duì)應(yīng)分包下載下來(lái)，下載完成后再進(jìn)行展示。

配置方法

配置例子

{
 "pages": ["pages/index", "pages/shopcart"],
 "subpackages": [
  {
   "root": "packageA",
   "pages": ["pages/mine", "pages/order"]
  },
  {
   "root": "packageB",
   "name": "pack2",
   "pages": ["pages/detail", "pages/pay"]
  }
 ]
}

├── app.js
├── app.json
├── app.wxss
├── packageA
│  └── pages
│    ├── mine
│    └── order
├── packageB
│  └── pages
│    ├── pay
│    └── detail
├── pages
│  ├── index
│  └── shopcart
└── utils

打包原則

• 聲明 subpackages 后，將按 subpackages 配置路徑進(jìn)行打包，subpackages 配置路徑外的目錄將被打包到 app（主包） 中

• app（主包）也可以有自己的 pages（即最外層的 pages 字段）

• subpackage 的根目錄不能是另外一個(gè) subpackage 內(nèi)的子目錄

• tabBar 頁(yè)面必須在 app（主包）內(nèi)

引用原則

• packageA 無(wú)法 require packageB JS 文件，但可以 require app、自己 package 內(nèi)的 JS 文件

• packageA 無(wú)法 import packageB 的 template，但可以 require app、自己 package 內(nèi)的 template

• packageA 無(wú)法使用 packageB 的資源，但可以使用 app、自己 package 內(nèi)的資源

以上是“小程序怎么使用分包加載”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對(duì)大家有幫助，更多相關(guān)知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)成都網(wǎng)站設(shè)計(jì)公司行業(yè)資訊頻道！

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無(wú)理由+7*72小時(shí)售后在線(xiàn)，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性?xún)r(jià)比高”等特點(diǎn)與優(yōu)勢(shì)，專(zhuān)為企業(yè)上云打造定制，能夠滿(mǎn)足用戶(hù)豐富、多元化的應(yīng)用場(chǎng)景需求。

分享標(biāo)題：小程序怎么使用分包加載-創(chuàng)新互聯(lián)
路徑分享：http://sd-ha.com/article18/shpdp.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站導(dǎo)航、App設(shè)計(jì)、網(wǎng)站建設(shè)、服務(wù)器托管、全網(wǎng)營(yíng)銷(xiāo)推廣、用戶(hù)體驗(yàn)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話(huà)：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)