目录 300 个 SKU 一次渲染 2400 个节点 LCP 到 4.8 秒

$products = wc_get_products(array(
  'limit' => 24,
  'status' => 'publish',
  'paginate' => true
));

单个目录页塞了 300 个 SKU，打开要 4.8 秒才看到第一屏，Performance 面板里 DOM 节点 2400 个，主线程布局花了 1.9 秒。这类现象通常不是突然出现的，往前翻半天日志能看到苗头。

追下去是这么回事：每个 SKU 都输出完整的规格下拉和库存接口地址，模板还在循环里逐条调 wc_get_product 查库。三百次查询叠上八层嵌套 div，首屏自然拖不动。

「SKU 过多加载慢」排查到最后往往是很小的一处差异，前面那些复杂猜测可以先放一放。权限不要一口气开到最大，先加到够用再往上试，范围小才好收。

把复现步骤压到三条以内，交给同事也能跑出来，才算真的定位清楚。改动写完就同步给同事，下一个人踩同一个坑，成本还是你的。

处理上按这个顺序：循环外先用 wc_get_products 一次取出，别在模板里逐条查；首屏只渲染 24 个，其余走分页或滚动加载；规格下拉改成点击后再请求，别在列表里预生成三十份。

确认没问题再收工，目录页 LCP 降到 2 秒以内，DOM 节点从 2400 降到 400 左右，翻页后仍能正常加载。