3D 产品模型文件大小：手机上能加载多大

3D 产品模型文件大小超过 5 MB，就已经不适合让买家在手机上打开的商品页了。能在一部中端安卓手机、普通移动网络下撑住的重量，大约在 2 MB 左右——原因不是审美，是算术：5 Mbps 下，每 1 MB 要先等 1.6 秒，然后渲染器才能画出第一帧。

意识到这一点，讨论的性质就变了。多数供应商把 3D 模型当成营销素材，把文件大小当成三维工作室的问题；买家只看到它是一打开页面就要下载的第一件东西。下面是预算表、字节真正花掉的四个地方，以及把 3D 链接贴进报价邮件之前要跑的六项检查。

3D 产品模型文件大小对照表：手机先下载的是什么

下载时间 = 文件大小 × 8 ÷ 带宽，公式里没有渲染、没有旋转、也没有第一帧。下表假设连接稳定，且不计 TLS 握手和往返延迟，所以真实手机只会更慢。

50 MB 那一行值得再读一遍：在办公室好网络下也要 13 秒，在仓库、展厅或酒店那种弱移动网络下要四分多钟。这么大的模型不是展示素材，而是一次买家没有同意的文件传输。

3D 产品模型是唯一一种买家必须先下载完整个产品、才能看到产品任何一部分的商品素材。 照片可以逐行加载，视频可以缓冲几秒就播，GLB 不行。

为什么整个模型必须先到齐

glTF 2.0 规范明确写着它不是流式格式：二进制数据本身可流式传输，但 glTF 并没有定义任何流式结构。所以查看器只能先加载资产、解析，然后渲染，中间没有"看起来像产品"的半成品画面。

容器选择也影响这一点。GLB 把 JSON 场景描述和二进制缓冲打包成一个文件，没有 base64 膨胀，单次请求效率最高，代价是买家要等整个包。拆开的 .gltf 加 .bin 加独立贴图可以让查看器分块拉取、更早开始，但请求更多、更容易出错。单个 SKU 的产品卡通常一个 GLB 就对了；六十个 SKU 的系列，共用拆分的文件总重常常更小。

这些不会出现在性能报表的图片栏里，所以容易被忽略。商品页的最大内容绘制（LCP）元素通常是首图或文本块，不是 WebGL 画布。Google 的标准是第 75 百分位的 LCP 不超过 2.5 秒。如果你的查看器脚本和模型下载跟首图抢带宽，页面会错过这个阈值，而三维团队那边只会汇报"模型渲染正常"。

页面其他部分已经占了多少

Web Almanac 引用的 2024 年 HTTP Archive 数据：桌面端页面中位数 2,312 KB，移动端页面中位数 2,037 KB；移动端仅图片一项就占了其中约 900 KB。

把模型放进来对比：

预算就是这么定的：3D 展示只是页面上的一个元素，同一页还有图库、参数表、评价、统计脚本和主题。模型单独就比页面中位数还大，那模型就成了页面，而买家是在用自己的时间买单。

天气、展会 WiFi 和设备都会放大这件事。三年前的中端手机解码 4096 像素贴图，比当初审片的笔记本慢得多。用手机测，不要用工作室的显示器测。

字节花在哪，哪种压缩修哪一块

3D 产品模型文件大小的开销集中在三块，按常见占比排序：贴图、几何体、其他（动画、相机、多余节点）。很多人意外的是几何体往往不是大头——一个由照片生成的模型，只要挂一张 4096 × 4096 的 PNG 贴图，就可能比它包住的网格还重。

两个已由 Khronos 批准的扩展承担主要压缩工作，且解决的是不同问题：KHR_draco_mesh_compression 用压缩几何数据替代原始顶点数据流；KHR_texture_basisu 用 KTX2 加 Basis Universal 超压缩存储贴图，既降传输体积也降显存占用。

两者都是扩展，不是 glTF 基础能力。查看器必须支持，且没有未压缩回退文件时，必须在 extensionsRequired 里声明。发送之前，请用买家真正会用的那个查看器打开导出文件——你的产品卡、你的官网，或者平台的 3D 位。能在 Blender 里打开，不能证明手机浏览器里没问题。

发出 3D 产品展示链接前的六项检查

按顺序做。前两项能挡掉大部分损失，后四项能挡掉那些最后变成客服邮件的失败。

• 文件是面向网页导出的单个 .glb，不是带散落贴图的 .blend、.step 或 .obj
• 这个 .glb 落在买家实际网络条件对应的重量预算内
• 先加载静态图，买家点击或滚动到位后才启动查看器
• 单指可旋转、双指可缩放，模型不跳、不转过界
• 轮廓、零件数量和五金件仍与产品和尺寸图一致
• 不支持 WebGL 或被企业策略限制的买家，仍能看到照片和参数表

检查 1：它是网页导出，不是工程文件

.blend 或 .step 是创作文档，带着历史记录、相机、材质，有时还引用某人笔记本上某个文件夹里的贴图。网页容器是 GLB，场景里应该只有一个产品、一个相机、查看器读得懂的材质。导出对话框问"是否应用修改器""是否包含隐藏对象"时，前者选是，后者选否。

模型背后的原始照片同样重要。混用不同角度和光线的素材建出来的模型，买家一转就会看见接缝——和照片组不匹配会毁掉商品页是同一个道理。如果照片组还在拍，先看3D 产品展示需要哪些照片，再碰导出器。

检查 2：重量对应的是买家的网络，不是工作室的

打开导出文件，读出以 MB 计的 3D 产品模型文件大小，和上面的表对照。一定要看导出文件，不看源工程——40 MB 的工作文件可能导出成 3 MB，3 MB 的工作文件也可能因为打包贴图导出成 30 MB。

超标时先修最大的那一块。把四张 4096 像素 PNG 换成一两张 1024 像素 JPEG，通常比改几何省得多。Draco 和 KTX2 放在后面用：它们的价值是把合理的资产做小，而不是把不合理的资产变得可以接受。

检查 3：第一帧是海报图，不是空白画布

延迟加载查看器，先显示静态图——最好和模型打开时的角度一致——直到买家操作再启动。这让 3D 画布不进关键路径，也给页面一个真正的 LCP 候选。

下一个最常翻车的是交互响应。Google 的 Interaction to Next Paint 标准是第 75 百分位不超过 200 毫秒，超过 500 毫秒算差。一个重模型加上物理引擎和阴影通道，在中端手机上很容易让"点击旋转"超过这条线，哪怕页面本身加载很快。

检查 4：一个拇指就能转

单手拿手机，用拇指转模型。如果手势需要两根手指、松手后模型自己漂移、缩放时旋转中心跑偏，买家就会跟查看器较劲，而不是读产品。

边缘也要测：顶面、底部、背面。把旋转限制在 ±45 度的查看器，恰好藏住了买家最想看的那些面——也就是摄影棚从来不会拍的那几面。

检查 5：形状仍然和产品一致

拿模型对着实物和尺寸图转一圈，看轮廓、五金件、拼缝，以及板材边缘的厚度；再重点看买家会检查的地方：铰链、脚垫、拉手、线条的断面。

把照片转成 3D 是展示步骤，不是测量步骤。模型可以把一条弧线做顺，但不能凭空长出一个拉手、抹掉一条拼缝，或者改掉尺寸图上写明的比例。模型和图纸冲突时，以图纸为准，重建模型。

这也是两类输出必须彼此诚实的地方。可旋转模型表达形状和零件如何相接，标注过的尺寸图表达数字。把量出来的尺寸钉在照片上、再用同一份素材生成可旋转模型的软件，能让这两种视图不跑偏——尺寸留在标注上，买家读得到，而不是埋进渲染里，谁都量不了。

检查 6：看不到的人也有退路

企业笔记本会禁 WebGL，有些浏览器默认关闭，老手机在大贴图上会内存不足。以上任何一种情况，买家都应该还能拿到静态图、参数表和联系按钮。

把回退方案写进页面，不要只写在计划里。WebGL 不可用时只显示一个转圈的灰框，比没有查看器更糟，因为买家会认定你的产品页坏了。

3D 展示能证明什么，不能证明什么

3D 产品展示是展示资产：它传达形状、比例和零件之间的关系，不是测量记录。模型在屏幕上的视觉大小取决于相机、视场角和买家屏幕，所以买家没法从上面读出一个尺寸，供应商也不该暗示可以。

这句话值得直接写在页面上。一行字——"尺寸以实物测量为准，3D 展示只表达形状"——能挡住这个流程里最贵的误会：买家以为模型就是带尺寸的图纸，然后照着它下单。

什么时候 3D 不值得这份重量

3D 不是所有买家问题的默认答案，把所有格式都堆在一页上，比只放对的那一种更慢。用下面的判断规则。

如果问题只是"发哪种格式"，真正的选择通常在 3D 展示和照片序列之间，而不是 3D 和什么都不发之间。取舍点是文件重量、交互程度，以及买家需要多少控制权；3D 产品查看器与 360 度照片的对比把这个区分讲得更细。

3D 值得占位时，把它放在能被看见的地方：一个和测量尺寸并排打开的3D 产品展示，放在买家会转发给同事的那张产品卡里，比藏在目录页三次点击之后的查看器有用得多。

常见问题

网站上的 3D 产品模型应该多大？

5 MB 以下；如果买家很可能用手机打开，2 MB 以下。上限来自算术而非偏好：5 Mbps 下，5 MB 的模型要先等 8 秒才出第一帧，而且还没算查看器脚本的运行时间。看导出的 GLB，不看源工程。

3D 模型会让商品页变慢吗？

会，通常在两处。下载会和首图抢带宽，把最大内容绘制推过 Google 的 2.5 秒良好线；查看器脚本再抢主线程，把交互延迟推向 200 毫秒的 INP 阈值。要在模型真实上线的情况下跑 PageSpeed Insights，不要用占位图测。

GLB 和 glTF 有什么区别？

GLB 是二进制容器，glTF 是格式。.gltf 是 JSON，指向另外的 .bin 和图片文件；.glb 把 JSON 和二进制缓冲装进一个文件，不用 base64，所以是一次请求、比等价的 JSON 内嵌略小。两者都是 glTF 2.0，都能在合规的查看器里加载。

不破坏形状的前提下能减小 3D 模型文件大小吗？

能，三步：删掉材质用不到的贴图、把几何减到查看器真能显示的细节、再对几何用 Draco、对贴图用 KTX2/Basis。每做完一步都重新核对轮廓和零件数量。最便宜的收益几乎总在贴图；最贵的错误是把曲面减到轮廓已经不像图纸。

买家能从 3D 展示里量出产品尺寸吗？

不能。3D 展示表达形状和比例，无法确认尺寸，因为视觉大小取决于相机、视场角和屏幕。需要数字的买家应该看标注过的规格图或尺寸图——尺寸要挂在产品上，而不是从渲染里推断。

资料来源

• web.dev — Largest Contentful Paint（LCP）：良好阈值 2.5 秒，较差阈值 4.0 秒，按第 75 百分位衡量
• web.dev — Interaction to Next Paint（INP）：良好阈值 200 毫秒，较差阈值 500 毫秒
• HTTP Archive Web Almanac 2024 — Page Weight 章：移动端页面中位数 2,037 KB，桌面端 2,312 KB，移动端图片约 900 KB
• Khronos Group — glTF 2.0 规范：GLB 容器结构、二进制缓冲，以及 glTF 并非流式格式的说明
• Khronos Group — KHR_draco_mesh_compression 扩展：以压缩几何流替代原始顶点数据
• Khronos Group — KHR_texture_basisu 扩展：KTX2 贴图与 Basis Universal 超压缩，降低传输体积与显存占用