Lighthouse 性能评分低，懒加载图片为啥没生效？
我用 Vue 做了个图片列表页，明明加了懒加载，但 Lighthouse 跑出来还是说“延迟加载首屏外的图片”没通过，性能分卡在 60 多。是不是我的写法有问题？
我试过把 loading=”lazy” 加在 img 标签上，也确认图片都在首屏以下，但 Lighthouse 就是不认。
<template>
<div v-for="item in images" :key="item.id">
<img :src="item.url" loading="lazy" alt="示例图" />
</div>
</template>- 2
回答
64浏览
Lighthouse性能评分优化后反而下降了，哪里出问题？
我给网站压缩了图片，移除了没用的JS代码，按理说性能应该更好，但Lighthouse评分从85直接掉到72，这是为啥？ 之前优化时做了这些：img标签加了loading="lazy"，把多个CSS文件...
- 2
回答
17浏览
Lighthouse Node API运行后性能评分一直是undefined怎么办？
我在用Lighthouse Node API跑性能测试时，获取的performance评分总是undefined，但其他指标正常。代码是这样写的： const lighthouse = require...
- 2
回答
110浏览
为什么在Lighthouse测试中首屏加载时间反而变长了？
最近在给项目做性能优化，把公共代码抽离成vendor chunk，还给图片加了懒加载，但Lighthouse测出来的首屏时间反而从2秒变成3秒了。明明控制台Network里总下载量少了200kb，这是...
- 1
回答
5浏览
为什么页面FCP很高但Lighthouse评分却不错？
我在用 Lighthouse 测速时发现 FCP（首次内容绘制）经常超过 3 秒，但整体性能评分却有 80 多分，这合理吗？是不是我哪里监控错了？ 我页面里有个 loading 动画，用 CSS 控制...
- 1
回答
46浏览
Lighthouse 性能报告里的 TTI 和 FCP 到底怎么优化？
我用 Lighthouse 跑了个性能测试，发现 TTI（可交互时间）和 FCP（首次内容绘制）得分特别低，页面明明看起来加载挺快的啊？ 我已经把关键 CSS 内联了，JS 也加了 async，但还是...
- 2
回答
27浏览
Lighthouse生成报告时为什么显示“加载失败”？
在用Chrome开发者工具运行Lighthouse做PWA测试时，点击生成报告总会弹出“加载失败”的红色错误提示。我试过重启浏览器、清除缓存，甚至重装Chrome，但问题依旧。控制台没报错，其他页面却...
- 2
回答
68浏览
为什么我的PWA在Lighthouse评分中无法通过“安装”项？
我按照教程配置了manifest和service worker，但Lighthouse的“安装”评分一直显示失败。明明检查过manifest的图标、名称都填了，service worker也能正常控制...
- 1
回答
30浏览
Lighthouse提示”优化流程”分数低，动态加载的JS脚本还是导致阻塞渲染怎么办？
我在React项目里用useEffect动态加载第三方统计脚本，虽然用了defer属性，但Lighthouse还是显示这个标签造成了渲染阻塞。代码是这样的： useEffect(() => { ...
- 1
回答
11浏览
Lighthouse跑分时为什么总提示“未建立缓存策略”？
我用 Lighthouse 测性能，每次都会报“未建立缓存策略”，但我的静态资源明明加了 Cache-Control: max-age=31536000 啊。是不是哪里没配对？ 我用的是 Nginx，...
- 2
回答
19浏览
Lighthouse 报“Best Practices”里有被动事件监听器问题，怎么解决？
我在用 Lighthouse 做性能审计时，发现 Best Practices 里提示“Uses passive event listeners to improve scrolling perfor...
loading="lazy"确实加上了，但 Lighthouse 检测的是另一种情况。问题在于你的图片一上来就把
src设置好了，浏览器解析 HTML 的时候可能直接就开始请求图片资源了，原生懒加载的触发时机 Lighthouse 有时候抓不到。靠谱的做法是用
data-src先把真实地址存起来，等图片进入视口再赋值给src。给你一个 IntersectionObserver 的实现方案：这样写 Lighthouse 肯定能过，图片只有真正进入视口附近 100px 才会发起请求。
还有几个细节要注意。如果你用 vue-lazyload 这种库也行，但自己写 IntersectionObserver 更轻量，性能开销更小，不用引入额外依赖。记得加个
rootMargin提前加载，用户体验会好很多，不然用户滚动的时候图片会闪一下才出来。另外检查一下你的图片有没有设置宽高，没设置的话会导致布局抖动，CLS 那一项也要扣分的。把宽高写死或者用 aspect-ratio 撑开，这个对性能评分影响挺大的。