智能小程序档案馆——如何给“包”瘦身

上传小程序代码的时候包体积太大不知如何是好?小程序打开速度慢,流量耗费大不知如何优化?在今天的文章里,我们一起来讨论一下如何给“包”瘦身。

为什么要限制包的大小?

我们都知道小程序作为一种 Hybrid 的解决方案,需要动态的进行包的更新,因此如果包的体积过大,将会出现打开速度慢,耗流量等问题,因而影响用户体验。 因此小程序在上传的时候会对包的大小进行限制。

包的大小要多少才合适呢?

官方文档中,百度小程序对于包的限制是:“整个小程序所有分包大小不超过 8M ,单个分包大小不能超过 4M。” 展开来说,如果你有 N 个分包,那么请确保这 N 个分包加起来的大小不超过 8M,同时每个分包的大小也不能超过 4M。

假如你并没有做分包,只有一个包的话,那么你的小程序包大小就不能超过 4M 了。

如何减少包的大小?

外链资源文件

我们在开发小程序的时候,往往需要很多资源文件,如:图片/iconfont 等,这些资源文件,最好只留必要的(如:离线场景下也需要的 icon 图片,或者首屏就需要的图片),其他的图片文件,建议换成远程地址,以减少包的体积。

当然这个还是得开发者自行斟酌包大小与图片请求的关系。

首页独立分包

其实分包的本质并不算减少了包的体积,而是减少了进入场景下的页面的包体积。比如,我们的小程序非常大,但是每次进入首页的时候,没必要所有页面都下载下来的话,就可以把首页做成独立分包。

{
    "pages": [
        "page/index"
    ],
    "subPackages": [
        {
            "root": "subpackage",
            "pages": [
                "pages/subpageone",
                "pages/subpagetwo"
            ]
        }
    ]
}
复制代码

这样,用户打开首页时,只会加载首页的包,有利于提升加载速度。subpackage 文件夹下的打包则会在之后访问到隶属于 subpackage 下的页面时,开始加载。

使用依赖分析模式

相信用过小程序开发者的同学们,肯定会注意到开发者工具上方有一栏“编译模式“ 默认情况下是依赖分析模式

依赖分析模式其实就是指,开发者工具中的编译模块,会以每个页面为入口,依赖分析式将所有文件打包到一起。这种模式下,我们很多没有被引用到的代码,将不会被打到发布包中。从而保障发布包中的代码尽量为有用代码。


以上为今天的全部内容,为您介绍了三种可以减少包体积的方法,感兴趣的童鞋可以都尝试一下哦~

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值