首页
AI Coding
数据标注
NEW
沸点
课程
直播
活动
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写笔记
写代码
草稿箱
创作灵感
查看更多
登录
注册
确定删除此收藏集吗
删除后此收藏集将被移除
取消
确定删除
确定删除此文章吗
删除后此文章将被从当前收藏集中移除
取消
确定删除
编辑收藏集
名称:
描述:
0
/100
公开
当其他人关注此收藏集后不可再更改为隐私
隐私
仅自己可见此收藏集
取消
确定
虚拟列表实现
订阅
ReturnToYouth
更多收藏集
微信扫码分享
微信
新浪微博
QQ
5篇文章 · 0订阅
前端长列表优化之虚拟滚动vue-virtual-scroller
一、使用背景 业务开发中存在长列表显示需求,一些用户的聊天列表会出现几千条数据的情况,也就意味着要一次性渲染几千条数据,造成明显的卡顿,这时就有必要对聊天列表进行性能优化来提升用户体验。 对于这种需求
Vue3 封装不定高虚拟列表 hooks,复用性更好!
Vue3 封装不定高虚拟列表 hooks,提高复用性,支持第三方库 Select、Table 组件和自定义组件。
IntersectionObserver:实现滚动动画、懒加载、虚拟列表...
IntersectionObserver使我们能够轻松获取获取元素的交叉状态,实现诸如懒加载、埋点监控、视差滚动等多种场景。 它性能良好,用法简洁。带来了极大的便利和用户体验,非常值得尝试。
IntersectionObserver
如果我们需要监听某个元素是否出现在视口中,一般做法是监听 scroll 事件,然后查询元素离视口顶部的距离,但是监听 scroll 事件存在性能问题。 浏览器原生提供了 IntersectionObs
IntersectionObserver 实现虚拟列表初探
前端开发中经常会遇到大数据量列表展示的性能问题,即大数据量一次性展示时前端渲染大量 Dom,触发渲染性能问题,造成初始加载白屏,交互卡顿等。解决这类问题的方案也有很多,使用虚拟列表展示是一个比较