壓縮 GLB 檔案到底做了什麼?
壓縮 GLB,就是把它的貼圖與幾何重新編碼,讓同一個模型占用更少的位元組。省下的空間大多來自貼圖:在我們實測的八個 Khronos 範例模型中,只要檔案裡有貼圖,圖片就占了絕大部分。這個 GLB 壓縮工具會縮小這些圖片、清理幾何,再寫出新的 .glb,全程都在你的瀏覽器中完成。
較小的 GLB 在商品頁上載入更快,能符合 3D 平台與素材市集的上傳限制,在手機上占用的記憶體也更少。模型的形狀、材質與動畫完全不需要為此改變。
GLB 的位元組都用在哪裡
GLB 裝著三種資料:貼圖(包覆在模型表面的圖片)、幾何(頂點位置、法線與三角面清單)以及動畫。貼圖以完整圖片檔的形式存放在 GLB 裡,常常是 2048 × 2048 的 PNG,所以一個只有幾百個三角面的模型,檔案仍可能有 8 MB。壓縮之前,可以先用 GLB 檢視器開啟檔案,看看它自己的容量分布。
無損清理與有損壓縮
有些步驟不會造成任何看得見的改變:移除重複資料、刪掉沒有用到的材質與貼圖,以及合併完全相同的頂點。省得更多的是有損的步驟:縮小貼圖、把貼圖重新編碼為 WebP 或 JPEG,以及用較少的位元儲存頂點位置。有損不代表看起來會變差,但這是值得檢查的部分,「壓縮前 / 壓縮後」切換鈕正是為此而設。
3 個步驟壓縮 GLB 檔案
拖放你的 .glb 或 .gltf
點擊「選擇 3D 檔案」,或把 .glb 拖放到預覽區。若是 .gltf,請連同它的 .bin 與貼圖檔案一起選取,或直接拖放整個資料夾;輸出一律是單一 .glb。面板會列出每張貼圖的尺寸、格式與位元組數。
選擇「Web」、「相容」或「自訂」
「Web」為瀏覽器產生最小的檔案,「相容」讓檔案不帶任何新的擴充功能,「自訂」則讓你自行選擇貼圖尺寸、格式與品質。在你按下任何按鈕之前,貼圖表格就會顯示每張貼圖將變成什麼樣子。
比較後再下載
按下「壓縮 GLB」。完成後,預覽區會切換到「壓縮後」,相機仍停在你離開時的位置;按 B 鍵或使用「壓縮前 / 壓縮後」切換鈕進行比較,然後「下載壓縮後的 .glb」。
選擇 .glb,或連同相關檔案選擇 .gltf。
依模型接下來的去處挑選預設集。
比較「壓縮前」與「壓縮後」,然後下載。
貼圖:大部分位元組的去處
GLB 裡的每張貼圖都是一個完整的圖片檔,模型一顯示出來,GPU 就會把它解開成原始像素:一張 2048 × 2048 的貼圖,不論它的 PNG 檔有多小,在未計 mipmap 的情況下都要占用約 16 MB 的視訊記憶體。所以壓縮 GLB 時,貼圖設定同時決定了下載檔有多大,以及模型顯示起來有多吃資源。
調整貼圖尺寸:4096、2048、1024 還是 512?
把貼圖的寬和高各減半,像素就只剩四分之一。在網頁上,模型通常只占畫面的一部分,1024 px 對大多數商品來說就夠了;主視覺與特寫鏡頭值得保留 2048 px,小道具則適合 512 px。這個 GLB 壓縮工具只會縮小貼圖、從不放大,而且會維持原本的比例。如果想手動調整單張貼圖的尺寸,可以使用圖片尺寸調整工具。
GLB 裡的 WebP、PNG 與 JPEG
PNG 與 JPEG 是 glTF 本身的一部分,所以每個能開啟 GLB 檔案的應用程式都能讀取。WebP 通常能產生最小的檔案,但使用 WebP 的 GLB 會宣告 EXT_texture_webp 擴充功能,開啟它的應用程式必須支援才行。JPEG 無法儲存透明度,所以只要貼圖的像素不是完全不透明,這個工具就會把它保留為 PNG。想了解這些格式一般的取捨,請參考 PNG 轉 WebP。
法線貼圖需要較溫和的壓縮
法線貼圖用顏色記錄表面的方向,有損壓縮留下的區塊狀瑕疵,會以光照錯誤而不是顏色雜訊的形式出現。兩種預設集都為法線貼圖設定了較高的品質下限(0.9)。WebP 與 JPEG 也會以較低的解析度儲存色彩,這會讓法線貼圖,以及把粗糙度、金屬度與環境光遮蔽分別存在不同通道的貼圖損失一些精度。如果這份精度很重要,請選擇「自訂」並保留原格式。
帶透明度的貼圖
樹葉、貼花與玻璃常常仰賴 alpha 通道。WebP 能保留它;JPEG 不行,所以原本要轉成 JPEG 的透明貼圖會改存為 PNG。在我們的實測中,Lantern 與 ToyCar 各有一、兩張貼圖因此保留為 PNG。
幾何壓縮:meshopt、量化與 Draco
幾何通常是 GLB 中較小的部分,但在高密度網格、掃描模型和帶動畫的角色中,它可能占了檔案的大半。「Web」預設集會用 meshopt 壓縮幾何;其他預設集則維持原本的編碼方式,只做清理。
meshopt 壓縮做了什麼
meshopt 先重新排列頂點與三角面,讓相鄰的資料放在一起,接著把位置、法線與貼圖座標從 32 位元浮點數改存為較小的整數(這叫做量化,以 KHR_mesh_quantization 宣告),最後再用 EXT_meshopt_compression 打包。它在瀏覽器中解碼非常快,three.js、model-viewer 與 Babylon.js 都能讀取。
焊接頂點與移除重複資料
匯出工具常常把同一個頂點寫好幾次、複製整個存取器(accessor),或留下沒有任何東西使用的材質與貼圖。合併相同的頂點並刪除未使用的資料是無損的,每個預設集都會執行;光是這一步,就讓小小的 Fox 模型省下了 32%。
為什麼 Draco 模型會保留原本的幾何
Draco 是另一種幾何壓縮擴充功能,壓縮率常常比 meshopt 更高。要寫回 Draco 需要它的編碼器,而把它解碼後改以不含 Draco 的方式儲存幾何,會讓一個測試網格變大 4 到 13 倍。所以當 GLB 已經使用 Draco 時,這個工具只會重新編碼貼圖,其餘每個位元組,包括 Draco 幾何在內,都完全保持原樣。結果卡片會註明這種情況。
該選哪個預設集?
壓縮 GLB 之前,先想想模型接下來要用在哪裡:該選哪個預設集取決於此,因為最省空間的設定仰賴 glTF 擴充功能,而不是每個應用程式都能讀取。預設集下方的說明會列出目前設定將加入的擴充功能。
用於網頁檢視器:three.js、model-viewer、Babylon.js
選擇 Web。它會把貼圖縮到最大 1024 px、存為 WebP,並用 meshopt 壓縮幾何。瀏覽器檢視器,以及以 three.js 或 Babylon.js 打造的引擎,都能讀取它用到的三種擴充功能,產生的檔案也是這個工具能做到最小的:在 Khronos 範例上縮小了 48% 到 98.8%。
用於 Blender、Unity 與桌面檢視器
選擇相容。它會保留最大 2048 px 的貼圖,不透明的存為 JPEG、透明的存為 PNG,完全不加入任何擴充功能。桌面工具與遊戲引擎的匯入工具對 WebP 和 meshopt 的支援參差不齊,所以當你無法掌控另一端的軟體時,不帶這些擴充功能的檔案是最保險的選擇。
什麼時候該用「自訂」
想讓貼圖維持原始尺寸、為精確的資料貼圖保留原格式、調高或調低品質,或關閉 meshopt 時,就用「自訂」。每改一項設定,貼圖表格都會跟著更新,壓縮前就能看到會發生什麼。
Khronos 範例模型的實際結果
為了讓你知道大概能省下多少,我們用這個頁面壓縮了 Khronos glTF Sample Assets 收藏中的 GLB 檔案:共八個原始檔,在桌上型電腦的 Chrome 中執行。使用「Web」預設集時,這八個檔案平均縮小 86%,中位數縮小 96%;省最多的是 Avocado,從 7.73 MB 降到 0.09 MB,因為它的三張 2048 × 2048 PNG 貼圖幾乎就是整個檔案。每個模型大約只花一秒鐘。
「相容」省得較少,因為它會保留 2048 px 的貼圖並避開 WebP,但仍讓八個模型中的四個縮小了 83% 到 93%。省得最少的模型,不是幾何最多(ToyCar 約有 109,000 個三角面),就是帶有透明度的貼圖,這些貼圖會維持 PNG。
實測:原始檔案 vs Web vs 相容
| 模型 | 原始大小 | Web 預設集 | 相容預設集 |
|---|---|---|---|
| Avocado | 7.73 MB | 0.09 MB(−98.8%) | 0.57 MB(−92.6%) |
| WaterBottle | 8.55 MB | 0.12 MB(−98.6%) | 0.88 MB(−89.7%) |
| BoomBox | 10.12 MB | 0.22 MB(−97.8%) | 1.12 MB(−89.0%) |
| Corset | 12.87 MB | 0.51 MB(−96.0%) | 2.15 MB(−83.3%) |
| Lantern | 9.12 MB | 0.36 MB(−96.0%) | 5.49 MB(−39.8%) |
| SheenChair | 3.93 MB | 0.97 MB(−75.3%) | 1.72 MB(−56.3%) |
| ToyCar | 5.17 MB | 1.30 MB(−74.9%) | 3.92 MB(−24.2%) |
| Fox | 0.16 MB | 0.08 MB(−48.0%) | 0.11 MB(−31.9%) |
壓縮會弄壞我的模型嗎?
壓縮 GLB 改變的是資料的儲存方式,而不是模型本身。網格、材質、節點名稱、動畫與其他 glTF 功能都會保留下來;需要檢查的是新檔案要求的擴充功能,以及貼圖近看的樣子。
輸出檔案可能需要的擴充功能
「Web」預設集可能會加入 EXT_texture_webp、EXT_meshopt_compression 與 KHR_mesh_quantization,並標記為必要擴充功能,讓無法讀取的應用程式直接回報,而不是顯示一個壞掉的模型。「相容」則完全不加入。原本就使用其他擴充功能的 GLB 會保留它們;如果這個工具不認得某個擴充功能,就會改為只重新編碼貼圖,不會改寫任何它不理解的內容。
動畫、蒙皮與變形目標
動畫、蒙皮角色與變形目標經過壓縮後都會保留。meshopt 也會壓縮動畫關鍵影格,而量化保留的精度對一般尺寸的模型來說已經足夠;如果是非常大的場景,或以公釐為單位的工程模型,請開啟線框比較結果,或在「自訂」中關閉 meshopt。
KTX2 貼圖會維持原樣
已經以 KTX2(KHR_texture_basisu)儲存的貼圖,是專為 GPU 壓縮的格式,在記憶體中也保持小巧。這個工具會原封不動地保留它們,而不是把它們轉回一般圖片。
為什麼 GLB 壓縮後還是很大
如果壓縮 GLB 後省得不多,面板通常會顯示原因。檔案可能已經壓縮過:原本就是小尺寸 WebP 或 JPEG 的貼圖很難再縮小,而且只要重新編碼沒有讓貼圖變小,工具就會保留原本的貼圖。如果結果完全不會更小,就不會提供下載,這是刻意的設計。
高密度掃描與攝影測量模型
掃描物件與攝影測量模型常常帶有數十萬甚至數百萬個三角面,這時占滿檔案的是幾何而不是貼圖。meshopt 有幫助,但真正的解法是減少三角面:先在 3D 編輯軟體中精簡網格,例如使用 Blender 的 Decimate 修改器,再到這裡壓縮結果。
壓縮帶有外部檔案的 .gltf
.gltf 會把幾何與貼圖存放在獨立的檔案中。把它們全部選取,或拖放整個資料夾,工具就會把所有東西打包成一個壓縮後的 .glb。使用 Draco 的 .gltf 必須先匯出為 .glb,因為只有在 GLB 中,Draco 資料才能保持不變。
對應的命令列做法
這個頁面是在你的瀏覽器中執行開源的 glTF Transform 函式庫。如果你想在建置流程中壓縮大量檔案,它的命令列工具可以完成類似的工作,例如 gltf-transform optimize input.glb output.glb --compress meshopt --texture-compress webp --texture-size 1024。
你的模型從不離開你的裝置
許多線上 GLB 壓縮工具會把檔案上傳到伺服器,有些還會限制你每週能壓縮幾個檔案。在這裡,整個工作都在你瀏覽器分頁內的背景執行緒中完成:模型從你的磁碟讀取、在記憶體中壓縮,再直接以下載的方式存回。這對尚未發表的產品、客戶的案子,以及任何受保密協議(NDA)約束的內容都很重要。關閉分頁後,什麼都不會留下。其他以相同方式運作的工具,請見我們所有的免費工具。