关于小程序 swiper 做长列表性能问题

[tinzing]

现在有个需求就是小程序(uniapp 做的)首页分类导航可以左右滑动，对应的内容列表也跟着滑动变，所以用 swiper 实现。问题来了，用 swiper 做出来后 数据一多就很卡，根本用不了。 问问大家你们有做过这样的需求吗？怎么解决性能问题的？

[GKD]

计算滚动条位置，把视窗外的列表隐藏掉。用一个空的 div 占位。

[wangtian2020]

小程序卡不是很正常吗，uni 哎批批卡那更正常了
是要有多少数据就会卡啊，可以用性能调试工具看看性能消耗在什么地方。css 开销大就尝试减小图片分辨率，代码开销大应该不至于。列表一次性渲染太多就虚拟列表动态添加。
自带的组件卡就自己实现


https://developer.mozilla.org/en-US/docs/Web/CSS/will-change

[mxT52CRuqR6o5]

swiper-item 有个 skip-hidden-item-layout 属性

[mxT52CRuqR6o5]

微信小程序文档里有说 swiper-item 有个 skip-hidden-item-layout 属性
uniapp 不清楚，按照道理是可以用的吧，你可以试试，不过其他平台的 swiper 的类似功能的 api 可能会不一样

[ifdef]

借楼问一下，现在啊有不用做小程序的前端岗位啊？

[tinzing]

@GKD 好复杂的样子

[tinzing]

@mxT52CRuqR6o5 我看了 也有，我试试

[tinzing]

@wangtian2020 几百条数据就开始掉帧了，自己实现的话能力有限

[wangtian2020]

@ifdef 大公司的前端比较专精（前端人数>3 ）。小公司像我大前端，vue3 、electron 、threejs 、cordova 啥都上，明知 uniapp 一坨，领导叫我糊我就糊。小程序跟网页开发一样的，就是恶心点

[ifdef]

@wangtian2020 #9 哭哭，小程序都快把我对前端的兴趣磨灭了

[renmu123]

@tinzing 几百条你要考虑一下需求问题了

[jones2000]

左右滑动直接一个页面的快照图一贴， 等手势停止了在渲染具体页面数据。

[w88975]

@ifdef 用 taro 根本没这种烦恼 100%特性的 react hook 写小程序很爽

[zhuweiyou]

@w88975 看到 taro 那 800+issues 就不敢用