#场景:
页面是不断上拉加载的数据流,不断地加载造成页面长列表,
情况类似使用的新闻app的数据加载方式。
结构示意:
#问题:
此时进行页面渲染后,滑动页面出现卡顿现象,
ios(6s)在超过10页轻微出现延迟,
安卓直接3-4页出现卡顿,
再往后直接延迟3、4秒才响应滑动,直到页面有5、6秒的延迟就操作不动。
#当前情况:
1、setdata已做优化,避免使用concat,采用分段,先占位(分页级别),再渲染。
setdata({
list[page]:datalist
})
2、列表的dom结构不一样,有单图组合文字、3图组合文字、有单张大图
3、滑动区域没有使用scroll-view组件
不知社区内是否有类似情况,且有解的朋友。
楼主找到最优解了么?
2、使用页面滚动,测试安卓下就算刷新到50页+页没有一点性能问题
https://developers.weixin.qq.com/community/develop/article/doc/000ec256ebc54061f0198cdef51813
建议二维数组渲染
为什么 我用 list[page]:datalist 这种方式setData 会报错
相比我的,你的性能应该算是好的了吧
我的用了scroll-view(用它的原因是因为有个下拉刷新的loading要自定义,用页面的下拉刷新的不好做,所以就自己撸了一个)
然后一个页面内有四个scroll-view(类似与tabbar切换,为什么不用官方的tabbar,是因为点击要有自定义动作,其中三个scroll-view中有长列表,两个长列表中包含大图片)
其中一个scroll-view最变态,最少包含两个自定义组件。
红框中的是两个组件
现在在想优化方案,脑壳疼
来个大佬给个建议呗,都是触底加载的无限大列表