渲染优化
本话题发布渲染优化相关的问答文章和技术分享，将持续更新，为您推荐了8篇问答，访问即可查看更多精彩内容。
-
1
回答
10浏览
图片懒加载后为什么还是卡顿？
我在项目里用Intersection Observer做了图片懒加载，但页面滚动时还是卡顿，尝试过把换成标签并添加WebP格式，也调整了threshold到0.1，但效果不明显。代码结构是这样的： c...
-
1
回答
12浏览
动态生成大量DOM元素时页面卡顿，如何优化？
我最近在做一个需要动态生成1000个带过渡效果的div的项目，用for循环拼接innerHTML时页面直接卡死了。改用文档碎片（documentFragment）后流畅度有提升，但滚动时依然卡顿。 尝...
-
1
回答
14浏览
为什么开启will-change后页面反而更卡了？
最近在优化一个滚动列表的性能，给列表项加了will-change: transform想让GPU加速，但发现滚动反而更卡了。帧率从60直接掉到30左右，还偶尔出现卡顿。尝试过把属性改成content也...
-
2
回答
66浏览
Service Worker注册成功但无法拦截请求，是什么原因？
我在给PWA应用添加Service Worker时遇到了奇怪的问题。按照教程写好了fetch事件监听，控制台也显示注册成功，但刷新页面时网络面板显示所有请求都是直接走的网络，没有触发缓存逻辑。已经检查...
-
1
回答
41浏览
预获取（prefetch）在单页应用中如何正确使用？为什么我的页面加载反而变慢了？
我在开发一个Vue单页应用时，尝试给下一页的图片列表页面添加预获取。按文档写了类似下面的代码，但发现首页加载反而变慢了，控制台显示预加载了大量图片资源。这是不是预获取用错了？ <template...
-
1
回答
49浏览
为什么用了React.lazy和Suspense后首屏加载反而变慢了？
我在给React项目做代码分割优化时，把一个大组件用React.lazy包裹了，然后用Suspense包裹渲染。但实际测试发现首屏加载时间比之前还长，控制台显示初始包反而增加了。这是为什么呢？ imp...
-
2
回答
29浏览
Vue列表滚动卡顿，虚拟滚动没效果怎么办？
用Vue做商品列表页时，页面滚动特别卡顿，尝试用v-if做了虚拟滚动但没效果。 代码是这样写的：{ data() { return { items: Array.from({length: 200},...
-
2
回答
47浏览
如何有效减少页面的重排与重绘？
最近在优化一个比较复杂的单页应用，发现滚动或者用户交互时性能不太好。用Chrome开发者工具看了看，发现重排和重绘挺频繁的。 试过使用CSS transform代替left/top属性移动元素，确实减...
