前端性能优化到底怎么做啊!平均 LCP 已经 1.7s 了

[dashsoap97]

领导坚持要看 95 分位数据 要 2.5s 以下 现在 3.2s 怎么办啊各位大佬

[luckyrayyy]

换个网速好的地方给他演示

[zhengfan2016]

上 worker ，把所有能缓存的缓存？

[Torpedo]

如果是 lcp 的话，lcp 一般是看某个元素的加载会触发 lcp 。所以你可以看下你们的页面是哪个元素触发的。

lcp 这个指标是不太准的，毕竟自动选的某个元素。

不过这不是重点。重点是你想想你们领导让你性能优化，那你可以和领导达成一个合理的指标，而不是单纯说领导提的这个指标不合理。

[gaobh]

图片用 wabp ，先压缩到十几 K 就合格，放存储桶套 cdn 完事，这最简单。然后搞图片懒加载。不行让 cursor 鼓捣一下

[dashsoap97]

@Torpedo #3 是的..只是说已经优化无从谈起了 该压缩的都压缩了 现在就是第一个 chunk-app.js 还有 300 多 k

[PainAndLove]

试试 SSR ？

[laikick]

@dashsoap97 #5 做了代码分割了吗? 先看看里面有啥看看能不能拆出来

[ChefIsAwesome]

利用浏览器能同时下好几个资源的特点优化。
把大的 js 包拆成几个，并行下载。
放一部分 js 进 html 里。比方讲页面加载之后，要请求后端拿用户信息，要根据路由取数据，这种逻辑可以写在 html 里。获得的信息存在全局变量的 promise 里，js 加载之后再去读 resolve 的值。这样取数据和下载 js 是并行的，而不是等 js 下载完了再去请求。

[dashsoap97]

@laikick #7 每个 router 都做了 chunk split
@ChefIsAwesome #8 谢谢 可以考虑一下~

[dashsoap97]

@PainAndLove #6 不行 一方面后端不行 另一方面 这还是 vue2

[dashsoap97]

@luckyrayyy #1 不是 这个是接入了一个平台 每次用户访问的 都有记录

[xiaoming1992]

analyzer 分析一下什么东西尺寸最大，看看能不能给它们 lazy 一下，让它们在首屏渲染完成后再加载

[LASockpuppet]

真难优化，一个 h5 页面，客户端容器启动占了 4s ，前端占了 4s ，用户可交互时间直接搞到了 8s

[JeriffCheng]

这个没有必要搞的，99%的网站都过不了这一关，除非网页特别小，全是文字，没有 js

[chaoschick]

把没那么重要的第三方 js 库都移除掉，手动实现

[murmur]

300k 首屏都不满足要求，只能骨架图造假了

[gxt92]

仅供参考 https://github.com/flowforfrank/performance-checklist

[jydeng]

service-worker 先加上，然后阻塞任务治理一下，阻塞接口拆一下就差不多了。

[des]

F12 Performance 分析一下呗，说不定去掉 unload 分数就上去了

[kamilic]

这种屌要求就刻舟求剑，如果 LCP 元素稳定，直接 base64 写死，或者是首屏试图用 inline 的 <script> 标签实现（狗头