美文网首页
uniapp 微信小程序包体积/性能优化

uniapp 微信小程序包体积/性能优化

作者: 遛_遛 | 来源:发表于2024-08-08 16:19 被阅读0次

1、manifest.json添加optomization、lazyCodeLoading配置
a. optomization-不开启的情况下子包的组件和js文件会被打包到主包的vendor.js文件中,导致主包的vendor.js文件过大


image.png

b.lazyCodeLoading 启用组建按需注入

 "mp-weixin" : {
      "appid" : "",
        "usingComponents" : true,
        "setting" : {
            "urlCheck" : false,
            "minified" : true
        },
        "lazyCodeLoading": "requiredComponents", //微信小程序官方的配置
        // uniapp特有配置
        "optimization" : {
            "subPackages" : true
        }
},

2、图片、视频、音频等资源等使用网络路径
3、分包 详见微信官方文档
4、压缩设置

image.png

cli创建的项目可以在package.json中添加参数--minimize,示例:

"dev:mp-weixin": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service uni-build --watch --minimize"

详见微信官方文档
5、分包预下载 详见微信官方文档
6、渲染线程空闲时进行预加载 在 page.json添加

"window": {
    "handleWebviewPreload": "auto"
  }

详见官方文档
7、减少页面层级,减少页面的嵌套

相关文章

网友评论

      本文标题:uniapp 微信小程序包体积/性能优化

      本文链接:https://www.haomeiwen.com/subject/arqhkjtx.html