前端优化
本话题发布前端优化相关的问答文章和技术分享，将持续更新，为您推荐了13篇问答，访问即可查看更多精彩内容。
-
1
回答
37浏览
预加载图片资源到底该用 link preload 还是 img hidden？
我在做一个图片画廊页面，首屏要快速展示缩略图，但高清大图需要预加载。试过用 <link rel="preload">，也试过用隐藏的 <img> 标签，但不确定哪种方式更靠谱，...
-
2
回答
40浏览
HTTP缓存策略到底该怎么配才有效？
我给静态资源加了 Cache-Control: max-age=31536000，但每次刷新页面还是会重新请求，浏览器根本不走缓存，这是为啥？ 我试过在 Nginx 里这样配置： location ~...
-
1
回答
53浏览
如何正确设置关键CSS资源的加载优先级？
我在优化页面首屏加载速度时，发现关键CSS还是被浏览器低优先级加载了。明明用了preload，但Lighthouse还是提示“未发现关键请求链”。 我试过把关键样式内联，也试过用preload预加载外...
-
2
回答
56浏览
Flutter列表滚动卡顿怎么优化？
我用ListView.builder加载了上百条带图片的数据，滑动时明显掉帧，试过加const widget和cacheExtent也不太行。是不是图片没处理好？ 这是我在Item里用的样式： .it...
-
1
回答
44浏览
小程序列表滚动卡顿怎么优化？
我在做微信小程序的长列表页面，数据一多滚动就特别卡，试过用 wx:for 渲染几百条记录，体验很差。是不是应该用虚拟列表？但不确定小程序支不支持。 目前是这样写的： Page({ data: { li...
-
1
回答
27浏览
Service Worker 缓存 HTML 后页面不更新怎么办？
我用 Service Worker 做了离线缓存，把首页 index.html 也缓存了，但改了 HTML 内容后刷新页面还是旧的，哪怕关掉再开浏览器也没用。是不是缓存策略写错了？ 我注册 SW 的方...
-
1
回答
35浏览
微前端子应用加载太慢，怎么优化首屏性能？
我们用 qiankun 搭了个微前端项目，主应用加载很快，但子应用首次进入时白屏好几秒，用户体验很差。试过动态 import 和预加载，但效果不明显。 子应用入口是通过 script 标签注入的，像这...
-
2
回答
44浏览
Node.js 接口响应太慢，怎么优化性能？
我用 Node.js 写了个 API 接口，前端用 Vue 调用，但每次加载都要等好几秒，本地开发都卡。试过加缓存和减少数据库查询，还是没明显改善。 前端是这样调用的： <template>...
-
2
回答
40浏览
关键渲染路径优化到底该从哪下手？
最近在做页面性能优化，听说关键渲染路径（Critical Rendering Path）是核心，但完全不知道该从哪开始改。我试过把 CSS 放到 <head> 里，JS 加了 defer，...
-
2
回答
22浏览
如何排查和优化页面中的 Long Task？
最近用 Lighthouse 测速，发现有个 120ms 的 Long Task 警告，但不知道具体是哪段代码引起的。我试过在关键函数里加 console.time()，但定位不到源头。 项目里用了大...
-
2
回答
42浏览
Nuxt 项目首屏加载太慢，怎么优化？
我用 Nuxt 3 搭了个博客，首页要加载十几篇文章的摘要，现在首屏白屏时间特别长，Lighthouse 评分才 40 多分。试过 lazy: true 和 suspense，但效果不明显。 数据是通...
-
2
回答
62浏览
为什么我的Service Worker缓存策略导致页面刷新后内容没更新？
最近给项目加了Service Worker做静态资源缓存，但发现更新了JS文件后页面一直显示旧版本。明明已经用cache.first策略，还手动调用了clients.claim()和skipWaiti...
-
2
回答
43浏览
图片懒加载没效果，怎么调整资源加载优先级？
大家好，我在做首屏优化时发现图片加载还是卡顿，虽然用了loading="lazy"属性，但页面加载时图片还是阻塞了其他资源。我尝试给图片加了loading="lazy"和decoding="async...
