微信小程序----分包预加载

最新推荐文章于 2025-05-02 07:37:55 发布

css_666

最新推荐文章于 2025-05-02 07:37:55 发布

阅读量1.1w

点赞数 8

CC 4.0 BY-SA版权

分类专栏：微信小程序文章标签：预下载分包

本文链接：https://blog.youkuaiyun.com/css_666/article/details/82688651

微信小程序专栏收录该内容

8 篇文章

订阅专栏

本文探讨了小程序分包预下载技术，旨在减少分包加载时间，提升用户体验。介绍了预下载的工作原理、配置方法及对当前页面加载速度的影响。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一，为什么要使用分包预下载

小程序的分包能使小程序有更大的代码体积，承载更多的功能与服务；而对用户而言，可以更快地打开小程序，同时在不影响启动速度前提下使用更多功能。

但是金无足赤，分包肯定不会只有优点没有缺点。使用分包的时候我们就会发现，虽然加载首页的时间变短了，但是当我们打开分包的时候，会有一个明显的加载过程。而且在安卓手机里会有一个系统级别的加载loading。

那么如何解决分包的这个副作用呢？
其实通过分包预下载就可以轻松避免这个问题。

开发者可以通过配置，在进入小程序某个页面时，由框架自动预下载可能需要的分包，提升进入后续分包页面时的启动速度。对于独立分包，也可以预下载主包。

二，、如何使用分包预下载

分包预下载目前只支持通过配置方式使用，暂不支持通过调用API完成。

app.json：

 {
  "pages": ["pages/index"],
  "subpackages": [
    {
      "root": "important",
      "pages": ["index"],
    },
    {
      "root": "sub1",
      "pages": ["index"],
    },
    {
      "name": "hello",
      "root": "path/to",
      "pages": ["index"]
    },
    {
      "root": "sub3",
      "pages": ["index"]
    },
    {
      "root": "indep",
      "pages": ["index"],
      "independent": true
    }
  ],
  "preloadRule": {
    "pages/index": {
      "network": "all",
      "packages": ["important"]
    },
    "sub1/index": {
      "packages": ["hello", "sub3"]
    },
    "sub3/index": {
      "packages": ["path/to"]
    },
    "indep/index": {
      "packages": ["__APP__"]
    }
  }
}