showroom 首屏卡顿的现象和排除过程
记录 showroom 首屏卡顿的现象、已经排除的可能和目前的猜测
未解决。 最后一次动它:2026-08-12。当前卡在「还不知道的」第二条。
现象
冷启动打开 /showroom/,从白屏到能拖动视角之间有一段 3 到 5 秒的卡顿,
期间页面完全没有响应,连滚动都不动。刷新之后(缓存命中)降到 0.6 秒左右。
换了三台机器都复现,卡顿时长和显卡强弱基本无关,和网络带宽有关。
证据
Performance 面板里那一段的构成:
1 | 解析 GLB 2.9 s ← 主线程,整段红 |
浏览器控制台在卡顿期间没有任何输出,没有报错。
已经排除的
- 不是模型面数的问题。 把车模减到原来的三分之一,卡顿时长几乎没变。
- 不是贴图解码。 把所有贴图换成 128×128 的纯色图,还是卡 2.8 秒。
- 不是 Draco 解压。 导出一版不压缩的 GLB,反而更慢(文件更大)。
目前的猜测
- 倾向 —— 瓶颈在主线程解析 GLB 这一步,不在 GPU。三条排除项都指向同一个方向:
只有改动「要解析多少字节」才影响时长。 - 猜 —— 可能可以搬到 Worker 里去。还没查过 three.js 的 GLTFLoader
在 Worker 里能不能跑。
还不知道的
- 把 GLB 拆成「先加载一个极简白模,再流式补细节」是否可行,two-pass 的接缝怎么处理。
- Worker 方案在 Safari 上的支持情况 —— 手上没有 Mac,没法测。