小程序--分包加载

分包加载是优化小程序加载速度的一种手段。

一、为什么进行分包

小程序限制单个包体积不超过2M;

分包可以优化小程序页面的加载速度。

二、启用/使用分包语法subPackages

subPackages:下载app.json文件中

root:分包所在的目录

pages:分包包含的页面

javascript 复制代码
  "subPackages": [
    {
      "root": "pkg_building",
      "pages": [
        "detail/detail",
        "list/list"
      ]
    },
    {
      "root": "pkg_repair",
      "pages": [
        "detail/detail",
        "list/list"
      ]
    }
  ],

注意:tabBar页面不允许分包;

整体包体积不得超过20M。

左侧为未分包时,真机调试报错信息;右侧显示二维码则表示可成功调试。

三、分包预加载 preloadRule

在实际使用分包的过程中,纯粹的按需加载也不是最优的方案,可以将即将访问的页面的包预先下载下来,这样能进一步提升小程序加载的速度,通过 **preloadRule**来配置预加载的包:

页面路径作为key属性;

network预加载的网络环境;

packages需要预加载的包。

javascript 复制代码
  "preloadRule": {
    "pages/framework/index": {
      "network": "all",
      "packages": ["pkg_building"]
    }
  },
相关推荐
工业互联网专业3 小时前
毕业设计选题:基于ssm+vue+uniapp的校园水电费管理小程序
vue.js·小程序·uni-app·毕业设计·ssm·源码·课程设计
说私域6 小时前
社群团购中的用户黏性价值:以开源小程序多商户AI智能名片商城源码为例
人工智能·小程序
迷雾yx10 小时前
开发微信小程序 基础02
微信小程序·小程序
迷雾yx10 小时前
开发微信小程序 基础03
微信小程序·小程序
说私域11 小时前
地理定位营销与开源AI智能名片O2O商城小程序的融合与发展
人工智能·小程序
技术闲聊DD1 天前
小程序原生-利用setData()对不同类型的数据进行增删改
小程序
康康爹1 天前
uniapp 小程序,登录上传头像昵称页面处理步骤
小程序·uni-app
小雨cc5566ru1 天前
小程序 uniapp+Android+hbuilderx体育场地预约管理系统的设计与实现
android·小程序·uni-app
DK七七1 天前
【PHP陪玩系统源码】游戏陪玩系统app,陪玩小程序优势
前端·vue.js·游戏·小程序·php·uniapp
正小安2 天前
MobX-Miniprogram:微信小程序的状态管理利器
微信小程序·小程序