小程序代码体积优化

简介: 微信小程序在发布的时候,对提交的代码有 2 MB 大小的限制。开发之前就需要提前有个心理准备。由于我也是第一次做小程序开发代码大小就超过了2MB,开发者工具都无法预览了,这就很尴尬了。

微信小程序在发布的时候,对提交的代码有 2 MB 大小的限制。开发之前就需要提前有个心理准备。由于我也是第一次做小程序开发代码大小就超过了2MB,开发者工具都无法预览了,这就很尴尬了。我自己的优化代码积的方式也不多,如果你有更好的方法,可以给我一些指导,感激不尽哦。

1.不要引用本地图片或者图标,最好是从服务器获取,远程 URL 地址加载图片。如果是图标的话,阿里的图标真的很好用,在小程序中使用也非常的方便。

2.优化代码逻辑,这个可能要求有一点高,减少不必要的代码,避免出现重复的代码。同时页面书写时候也要尽量避免不必要的组件嵌套,能用一个 view 做到的,就不要再多套一层 view。对减少代码尺寸和代码性能都是有好处的。

3.尽量的复用页面,判断逻辑写在页面中区分。正常的开发页面都要尽量分开便于维护,但是在小程序中多一个页面可就多生成4个文件呢。所以当你无法再优化和精简你的代码的时候,选择具有相同功能的页面尽量复用吧。毕竟鱼和熊掌不可兼得,谁叫微信有2M的大小限制呢。

4.使用工具压缩优化代码。使用一些前端工程化工具来处理我们的代码,比如使用 Gulp,结合一些功能插件,如:Uglify、CSS Nano、HTML min 等。使用这些工具,可以让我们的代码尺寸小上那么一大截(大约 20%~30%)。网上据说wepy自带的build命令压缩效果要比npm好,由于自己开发使用的就是wepy感觉一般般,其实和普通工程化工具没什么区别。

相关文章
|
24天前
|
开发框架 小程序 JavaScript
小程序代码丢失!反编译找回
小程序源代码的容易获取问题确实存在一些潜在的安全隐患。然而,现在的小程序开发框架采用像 Babel 这样的打包工具,将 JavaScript 逻辑代码混合在一个文件中并进行转编译,使其变得难以理解。
28 0
小程序代码丢失!反编译找回
|
6月前
|
JavaScript Java 测试技术
基于小程序的移动学习平台+springboot+vue.js附带文章和源代码说明文档ppt
基于小程序的移动学习平台+springboot+vue.js附带文章和源代码说明文档ppt
46 0
|
2月前
|
小程序 JavaScript Go
代码总有一个是你想要的分享63个微信小程序源
分享63个微信小程序源代码,包括电商系统、同城拼车、博客等多种应用,涵盖C#、Node.js、Golang等技术栈。每个项目附带源码和示例,适合初学者和开发者参考学习。提取码:8888,代码效果参考:http://www.603393.com/sitemap.xml。
55 2
|
3月前
|
小程序 前端开发 JavaScript
微信小程序实现微信支付(代码和注释很详细)
微信小程序实现微信支付(代码和注释很详细)
|
3月前
|
小程序 JavaScript 前端开发
微信小程序开发必备前置知识:基本代码构成与语法
【8月更文挑战第8天】微信小程序的基本代码构成与语法
100 0
微信小程序开发必备前置知识:基本代码构成与语法
|
3月前
|
小程序 JavaScript 安全
微信小程序实现云闪付支付(代码和注释很详细)
微信小程序实现云闪付支付(代码和注释很详细)
|
5月前
|
XML 小程序 Java
java小程序代码详细展示
java小程序代码详细展示
38 0
|
6月前
|
JavaScript Java 测试技术
基于小程序的健身管理系统及会员微信小程序+springboot+vue.js附带文章和源代码说明文档ppt
基于小程序的健身管理系统及会员微信小程序+springboot+vue.js附带文章和源代码说明文档ppt
49 2
|
6月前
|
JavaScript Java 测试技术
基于小程序的订餐系统+springboot+vue.js附带文章和源代码说明文档ppt
基于小程序的订餐系统+springboot+vue.js附带文章和源代码说明文档ppt
34 0
基于小程序的订餐系统+springboot+vue.js附带文章和源代码说明文档ppt
|
6月前
|
JavaScript Java 测试技术
基于小程序的汽车保养系统+springboot+vue.js附带文章和源代码说明文档ppt
基于小程序的汽车保养系统+springboot+vue.js附带文章和源代码说明文档ppt
37 0