性能与 Core Web Vitals

商品有八千个，客户搜「黑色 连衣裙 长款」经常搜不到，联想词也不准。装了个搜索应用感觉更慢。

上周结账挂了四十分钟，是客户在社媒上说的。后台一直能打开，完全没报警。

PageSpeed 显示 85 分，但客户还是反馈很卡；另一台设备显示 45 分。

首页 TTFB 1.2 秒，怀疑是 Shopify 服务器的问题。

商品图上传的是 3000px 原图，前台虽然用了 `img_url` 但下载的还是大文件。

搜索框输入时每次按键都发请求，服务端压力大，前端也卡。

移动端打开页面，标题先显示然后突然往下跳，CLS 0.28。

集合页显示 48 个商品，滚动明显掉帧，移动端更严重。

点购物车图标，抽屉要 1.5 秒才滑出来。

首页 TTFB 1.8 秒，服务器渲染时间占了大部分。

页面打开先看到一堆无样式的 HTML，一秒后才正常。

装了评价、客服、推荐、像素四类应用，移动端加载 6 秒。

装了三家分析工具的像素，担心影响性能。

主题的 `theme.js` 有 200KB，放在 `<head>` 里同步加载，首屏明显变慢。

为了提速，把所有图片都加了 `loading="lazy"`，结果 LCP 变差了。

移动端 LCP 4.2 秒，PageSpeed 指出 LCP 元素是首页 banner 图，图片已经压缩过了。

听说 `preconnect` 能提速，给十几个第三方域名都加上了。

首页放了一个 8MB 的自动播放视频，移动端加载体验很差。

同一页面桌面端性能很好，移动端差距巨大。

移动端点「加入购物车」有明显延迟，INP 指标 480ms。

品牌字体加载慢，出现「先显示系统字体再切换」的闪烁，有时正文空白一秒。