渲染性能优化1.适当监听页面或组件的滚动事件
只要用户在构建Page时传入监听器,基础库就会认为开发者需要监听页面的scoll事件。这时候用户滑动页面时,会从视图层向逻辑层高频率发送事件,有一定的通信开销。
同样,对于 ,
而其他可以通过bindscroll监听滑动事件的组件也会出现这种情况。
由于滚动事件触发的频率很高开发微信小程序,很容易被开发者误用。使用时注意:
Page({
onPageScroll () {} // ❌不要保留空函数
})
Page({
// ✅ 应直接不传入
})
2. 选择一个高性能的动画实现
开发者在开发界面动画时应该选择高性能的动画实现。
3. 使用 IntersectionObserver 监控元素暴露情况
在某些业务场景中,为了改变某些页面的状态或上报分析支付宝小程序开发 app软件开发 ,需要监控元素的暴露情况。
4.控制WXML节点的数量和级别
太大的 WXML 节点树会增加内存使用,并且需要更长的时间来重排样式,影响体验。
5.控制构建Page时传入的自定义数据量
为了方便开发开发微信小程序,开发者可以在Page构造函数传入的Object参数中添加任意函数或数据,在页面的函数内使用this进行访问。例如:
Page({
data: {}
userInfo: {} // 自定义数据
currentUser: 'Wechat' // 自定义数据
onTap() { }
onLoad() {
console.log(this.currentUser)
}
})
为了保证自定义数据在不同的页面实例中也是不同的,小程序框架在创建页面时会对这部分数据(函数类型字段除外)进行深拷贝。很复杂,会带来很多开销。
// ❌ 使用复杂对象作为自定义数据
Page({
onLoad() { }
bigData: { /* A complex object */ },
longList: [ /* A long complex array*/ ]
})
// ✅ 运行时手动赋值到 this。开发者可以根据需要选择进行深拷贝、浅拷贝或不拷贝。
Page({
onLoad() {
this.bigData = { /* A complex object */ },
this.longList = [ /* A long complex array*/ ]
}
})
翻译由微信翻译提供,仅供参考。如中英文版本有任何不一致和差异开发微信小程序,以中文版本为准。翻译错误。
本站声明: 本文章内容来源于互联网,文章内容仅供用户参考。本公司不能完全保证文章内容的准备性、时效性。如果因本文章对用户造成了任何损失或者损害,本公司将不会承担任何法律责任。如果涉及到版权问题,请提交到wikins@nbyuyuan.com