FCP 和 LCP 到底哪个更能反映用户真实体验？
我在用 Lighthouse 测性能时发现 FCP 是 1.2s，LCP 是 3.5s，用户反馈页面“感觉慢”。但首屏内容明明很快出来了，为啥体验还是差？
是不是应该更关注 LCP？之前试过懒加载图片，结果 LCP 反而变慢了，因为主图被 defer 了。现在有点搞不清该优化哪个指标了。
比如这段关键渲染路径的写法：
<img src="hero.jpg" loading="eager" alt="主图" />
<script defer src="app.js"></script>这样写对 LCP 有帮助吗？还是说得用 <link rel="preload"> 才行？
1 条解答
先说说你现在的写法：
遇到这种情况，我一般会用preload预加载关键资源。可以试试这样：
服务端也要配合优化，确保图片能快速响应。如果图片较大，考虑使用CDN加速。
至于懒加载影响LCP的问题，建议对首屏可见内容都设为eager加载，非首屏再lazy。别一味追求懒加载而牺牲了关键路径性能。
总的来说，优先保证LCP时间在3秒内比较合理，毕竟这才是用户真正认为页面“加载完成”的时刻。