循环网格（Loop Grid）一旦“变卡”，通常不是某一个点坏了，而是“查询慢 + 图片重 + 缓存没命中 + 前端渲染压力大”叠加出来的体感问题。下面按 查询 / 图片 / 缓存 / 前端渲染 四条线写，每条都告诉你在 WordPress、Elementor、浏览器里具体去哪里看。
1）先确认：慢在后端还是前端（在哪里查看）
1.1 在浏览器看 TTFB（判断后端是否慢）
位置：Chrome → 按 F12 → Network（网络）
操作：
勾选 Disable cache（只用于测试）
刷新页面（Ctrl+R）
点最上面那条 文档请求（通常类型是 Doc / HTML）
点击文档名称，右侧看 Timing（计时）
怎么看：
Waiting (TTFB) 很长：后端慢（查询/缓存/PHP）
TTFB不长但页面滚动卡：前端渲染压力大
2）查询（Loop Grid 取数）：在哪里看“每页条数、Query 设置”
2.1 在 Elementor 里看每页显示多少条
位置：编辑该页面 → 点击 Loop Grid 小工具 → 左侧面板 Content（内容）
常见入口名称（不同版本略有差异）：
Content → Layout（布局）
Posts Per Page / Items Per Page / 每页显示（条数）
你要做的测试：
把每页条数从 24 改成 12，再改 8，对比是否变快
2.2 在 Elementor 里看 Query 类型与过滤条件
位置：Loop Grid → Content → Query
重点看这些项有没有开得很重：
Include / Exclude（包含/排除）
Order By（排序：热度/销量/评分通常更慢）
Source（来源：文章/产品/文章分类类型）
3）图片：在哪里查看“单张多大、总共多大”
3.1 在浏览器看图片体积
位置：Chrome → F12 → Network → 过滤选择 Img
操作：
刷新页面
点 Img
看列表里的 Size（大小）
怎么看：
列表缩略图建议 50KB–150KB，尽量别超过 200KB
如果你看到很多 300KB、500KB、1MB 的缩略图，就是主要拖慢点
3.2 在 WordPress 里看缩略图尺寸设置（基础）
位置：后台 → 设置 → 媒体
你可以确认：
缩略图尺寸有没有设得合理（别太大）
但注意：Elementor/主题也可能用自己的尺寸规则
4）缓存：在哪里查看“是否命中缓存、有没有被绕过”
4.1 用无痕窗口判断缓存是否生效（最简单）
位置：Chrome → 右上角三点 → 新建无痕窗口
操作：
无痕打开同一页面，对比速度
怎么看：
无痕明显更快：你登录状态可能绕过了缓存，或缓存规则对登录用户不同
4.2 在浏览器看是否命中缓存/CDN（高级一点）
位置：Chrome → F12 → Network → 点 Doc/HTML → Response Headers（响应头）
你可能会看到类似字段（不同服务器不一样）：
cf-cache-status（Cloudflare 常见：HIT/MISS）
x-cache、cache-control 等
怎么看：
有 HIT 更稳
长期都是 MISS，说明缓存没命中或被规则绕过（例如带参数、页面动态内容多）
5）前端渲染：在哪里查看“滚动掉帧、渲染重不重”
5.1 在浏览器看滚动时的性能
位置：Chrome → F12 → Performance（性能）
操作：
点击录制（Record）
滚动页面 3–5 秒
停止录制
怎么看：
Rendering/Painting 很高：阴影、滤镜、动画、DOM太多
Scripting 很高：JS太重（通常是动效、加载脚本过多）
6）你按这个顺序做，最快定位
浏览器 Network 看 TTFB（确定后端/前端）
Elementor 把 每页条数减半 做对比
Network 过滤 Img 看 图片大小
无痕窗口对比 缓存命中差异
Performance 录制滚动，看 Rendering 是否爆表
结尾
按顺序做完 TTFB → 每页条数 → 图片大小 → 缓存命中 → 滚动性能，你就能确定瓶颈在哪。下一步只改最慢的那一项：
TTFB 高：精简 Query、减少每页数量
图片大：统一缩略图尺寸并压缩
滚动卡：关动画、减阴影、少字段
改完用无痕刷新两次复测：TTFB 和 Finish 明显下降，就算解决。