上个月有个做定制家具的客户找过来，官网首页放了个3D全屋场景，打开要等十几秒，访客基本等不了那么久。他一度把原因归结到服务器不行，打算花两万多换台高配机器。后来我们把模型文件一查，光一个组合柜的GLB就有40多兆，问题根本不在服务器。这类情况见得多了，网页里的3D模型加载慢，原因往往不在一个点上，得按顺序排。
先称一称模型本身有多重
建模软件里做得再流畅，导出环节的面数和贴图常常是没人管的。一个家具模型几十万面、贴图全是4K，导出来的GLB轻松上几十MB。我们实测过，40MB左右的模型在4G网络下要等20秒往上，基本等于用户流失。处理办法不复杂：面数先减到几万到十几万的量级，再用Draco压几何，贴图降到2K或者1K，转成KTX2格式。多数项目压完能到5MB以内，画质上肉眼几乎看不出损失。具体压到什么程度，得看模型的复杂度，没有放之四海皆准的数字。
尤其在配置器这类项目里，模型不是一个，是一整套。我们给客户搭3D产品选配系统是怎么回事的时候，光材质变体就有上百组，前期不规划资产体积，到后期加载问题会成倍放大。体积这一关过不了，后面做什么都是白搭。
带宽这道坎比很多人想的高
模型压完还是慢，就得往服务器这边查。普通云服务器默认带宽一般就3到5Mbps，摊上一个10MB的模型，光下载理论上就要十几秒，这不是优化代码能救回来的。常见的做法是把模型文件、贴图这些静态资源挂到CDN上，用户从最近的节点拉数据，再开HTTP/2让多个文件并行传，排队等待能省掉不少。之前有个客户对自己那台低配服务器有感情，我们没动它，只把模型挪到对象存储加CDN，首屏等待从14秒左右降到3秒上下，一个月成本也就几十块。另外提醒一句，如果还在纠结选哪种做法，四种3D展示技术方案的适用场景这篇可以先看一遍，部署和流量成本最好在选型阶段就算进去，别等上线了才发现带宽扛不住。
加载顺序和方式，比绝对速度更影响体验
就算优化都做到位了，大场景该等还是得等，这时候要处理的是用户的感受。渐进式加载算是标配：先给一个低面数的占位模型，配上进度提示，后台把高模悄悄换上来；首屏要用的东西优先加载，大模型往后放。用户对等待的忍耐其实取决于有没有反馈，同样是8秒，看得见进度条的等待和一片白屏的等待完全是两码事。手机端尤其明显，移动网络波动大，不做渐进处理很容易直接黑屏，也就是用户口中说的3D模型加载不出来。不太清楚网页3D展示整体怎么搭的话，可以参考从建模到上线的Web3D工具链这篇，再结合自己的场景去排优先级。
排查顺序上我们的习惯是，先开F12看网络面板，确认GLB文件到底多大，这一步能定位八成的问题；体积正常再去查带宽和并发；最后才轮到加载策略。璇玑动画做了八年多、五百多个项目，多数情况走完压缩加CDN这两步，加载体验就能过客户验收了，剩下的一小撮再单独处理。
常见问题
3D模型加载慢一定是服务器带宽的问题吗？
不一定。实际项目里模型体积过大占了大多数，先把F12网络面板里GLB文件的实际大小查清楚，再判断要不要动服务器。很多时候模型从几十MB压到5MB以内，问题就解决了。
模型压缩之后画质会明显变差吗？
Draco压的是几何数据，参数设置合理的话视觉差异很小；贴图分辨率是另一条线，一般降到2K在网页端看不出明显区别。压完必须在不同设备上过一遍才算数，手机上那一关尤其不能省。
手机上加载3D展示特别慢有什么针对性办法？
移动端带宽和发热都受限，压缩标准要比PC端更严，贴图建议从1K起步，再加上渐进式加载先出占位模型给反馈。真机测试别省，模拟器测不出真实网络环境下的表现。
