时间：2023-02-11 09:49:12 | 栏目：JavaScript代码 | 点击：次
场景：
例如项目里包含类似论坛页面：点击一个点赞图标，赞数要立即+1，会引发页面级所有的数据从js层向视图层的同步，造成整个页面的数据更新，造成点击延迟卡顿
优化方案：
对于复杂页面，更新某个区域的数据时，需要把这个区域做成组件，这样更新数据时就只更新这个组件
注：app-nvue和h5不存在此问题；造成差异的原因是小程序目前只提供了组件差量更新的机制，不能自动计算所有页面差量
场景：
页面中若大量使用大图资源，会造成页面切换的卡顿，导致系统内存升高，甚至白屏崩溃；对大体积的二进制文件进行 base64 ，也非常耗费资源
优化方案：
图片请压缩后使用，避免大图，必要时可以考虑雪碧图或svg，简单代码能实现的就不要图片
功能描述：
此功能只对微信小程序、App、百度小程序、字节跳动小程序有效，默认开启
前往uView手册查看配置
不要滥用本地存储，局部页面之间的传参用url，如果用本地存储传递数据要命名规范和按需销毁
在 uni-app 中，定义在 data 里面的数据每次变化时都会通知视图层重新渲染页面；所以如果不是视图所需要的变量，可以不定义在 data 中，可在外部定义变量或直接挂载在 vue实例 上，以避免造成资源浪费
场景：
页面初始化时，逻辑层一次性向视图层传递很大的数据，使视图层一次性渲染大量节点，可能造成通讯变慢、页面切换卡顿
优化方案：
以局部更新页面的方式渲染页面；如：服务端返回 100条数据 ，可进行分批加载，一次加载 50条 ， 500ms 后进行下一次加载
要知道哪些属性是有继承效果的，像字体、字体颜色、文字大小都是继承的，禁止没有意义的重复代码
防抖：
等待n秒后执行某函数，若等待期间再次被触发，则等待时间重新初始化
节流：
触发事件n秒内只执行一次，n秒未过，再次触发无效
场景：
页面初始化时存在大量图片或原生组件渲染和大量数据通讯，会发生新页面渲染和窗体进入动画抢资源，造成页面切换卡顿、掉帧
优化方案：
场景：
进入新页面时背景闪白，如果页面背景是深色，在vue页面中可能会发生新窗体刚开始动画时是灰白色背景，动画结束时才变为深色背景，造成闪屏
优化方案：
将样式写在 App.vue 里，可以加速页面样式渲染速度； App.vue 里面的样式是全局样式，每次新开页面会优先加载 App.vue 里面的样式，然后加载普通 vue 页面的样式
app端 还可以在 pages.json 的页面的 style 里单独配置页面原生背景色，比如在 globalStyle->style->app-plus->background 下配置全局背景色
"style": { "app-plus": { "background":"#000000" } }
nvue页面不存在此问题，也可以更改为nvue页面
App设置为纯 nvue项目 （manifest里设置app-plus下的renderer:"native"），这种项目的启动速度更快，2秒即可完成启动；因为它整个应用都使用原生渲染，不加载基于webview的那套框架
描述：
有官方API的就不要额外引用js插件增加项目体积
例如：
url传参加密直接用 encodeURIComponent() 和 decodeURIComponent()