现在有个需求就是小程序(uniapp 做的)首页分类导航可以左右滑动,对应的内容列表也跟着滑动变,所以用 swiper 实现。问题来了,用 swiper 做出来后 数据一多就很卡,根本用不了。 问问大家你们有做过这样的需求吗?怎么解决性能问题的?
1
GKD 2022-06-24 17:07:38 +08:00
计算滚动条位置,把视窗外的列表隐藏掉。用一个空的 div 占位。
|
2
wangtian2020 2022-06-24 17:12:27 +08:00
小程序卡不是很正常吗,uni 哎批批卡那更正常了
是要有多少数据就会卡啊,可以用性能调试工具看看性能消耗在什么地方。css 开销大就尝试减小图片分辨率,代码开销大应该不至于。列表一次性渲染太多就虚拟列表动态添加。 自带的组件卡就自己实现 https://developer.mozilla.org/en-US/docs/Web/CSS/will-change |
3
mxT52CRuqR6o5 2022-06-24 17:12:31 +08:00
swiper-item 有个 skip-hidden-item-layout 属性
|
4
mxT52CRuqR6o5 2022-06-24 17:14:15 +08:00
微信小程序文档里有说 swiper-item 有个 skip-hidden-item-layout 属性
uniapp 不清楚,按照道理是可以用的吧,你可以试试,不过其他平台的 swiper 的类似功能的 api 可能会不一样 |
5
ifdef 2022-06-24 17:15:14 +08:00
借楼问一下,现在啊有不用做小程序的前端岗位啊?
|
7
tinzing OP @mxT52CRuqR6o5 我看了 也有,我试试
|
8
tinzing OP @wangtian2020 几百条数据就开始掉帧了,自己实现的话能力有限
|
9
wangtian2020 2022-06-24 17:26:45 +08:00
@ifdef 大公司的前端比较专精(前端人数>3 )。小公司像我大前端,vue3 、electron 、threejs 、cordova 啥都上,明知 uniapp 一坨,领导叫我糊我就糊。小程序跟网页开发一样的,就是恶心点
|
10
ifdef 2022-06-24 17:29:29 +08:00
@wangtian2020 #9 哭哭,小程序都快把我对前端的兴趣磨灭了
|
12
jones2000 2022-06-24 20:48:46 +08:00
左右滑动直接一个页面的快照图一贴, 等手势停止了在渲染具体页面数据。
|