將 GIF 分割成幀意思是將一個循環動畫檔案變成靜止影像堆疊，每個可見步驟一張。GIF 中的第一個幀變成 frame-01.png、第二個變成 frame-02.png，依此類推，完全按照瀏覽器解碼器讀取它們的順序。每個 PNG 保持原始動畫的完整邏輯畫布尺寸，並顯示檢視者在該時刻實際看到的內容，包括螢幕上仍然存在的每個先前繪製的元素。解碼器不只是複製編碼器儲存的原始矩形；它使用 GIF 處置規則在先前畫布上合成這些矩形，所以閃爍的遊標、移動的貼紙或部分背景更新變成普通、完整的 PNG，任何影像編輯器都可以開啟而無須鏈中的每個較早幀。這些幀對於文件、故事板、設計審查、社交媒體資產或手動編輯很有用，工作發生在檔案開啟的瀏覽器分頁內。
為什麼分割 GIF 幀比看起來更難
GIF 不是具有完整關鍵幀的影片檔案。為了縮小檔案尺寸，GIF 編碼器通常會儲存一個在先前幀之後變更的小矩形，而不是每個步驟的完整畫布。其中一些矩形包含透明像素。某些要求其矩形在顯示後被清除，而其他要求先前畫布被還原。如果工具簡單地提取這些原始矩形並將它們儲存為 PNG，除第一個外的每個縮圖看起來都會不完整、空白或位移。
真正的幀分割器需要解碼每個影像塊、應用先前幀的處置行為、在完整邏輯畫布上繪製新修補程式，然後將該完整畫布匯出為靜止影像。該額外合成步驟是誤導性縮圖和可用藝術作品之間的區別，也是 GIF Splitter 工具圍繞本地瀏覽器畫布而非充當簡單檔案轉換器建立的原因。
如何在瀏覽器中分割 GIF 幀
整個過程發生在頁面本身，所以源動畫絕不上傳到遠端伺服器。下列步驟使用 GIF Splitter 工具，在本地解碼 GIF，並列出每個可見幀及其本身的預覽和下載連結。
- 開啟 GIF Splitter 頁面，從你的裝置選擇動畫 GIF。選定的檔案磁碟上可達 20 MB。
- 選擇 提取 PNG 幀。頁面執行本地合成通行，使用儲存在源檔案中的處置規則應用每個 GIF 塊到先前畫布。
- 等待編號預覽出現。每個預覽顯示幀編號、完整畫布尺寸和以毫秒為單位的解碼顯示延遲。
- 審查清單並下載你實際需要的編號 PNG 檔案。每個連結指向從畫布像素產生的實際 PNG Blob，而非佔位符。
- 如果你的動畫長於 50 個塊，首先修剪它或在外部分割它，然後在較短檔案上重新執行提取。工具將每個檔案的處理上限設為 50 個影像塊。
輸出檔案包含的內容
每個下載的 PNG 具有與原始 GIF 畫布相同的寬度和高度，透明度保留在源使用透明像素的位置。檔案名稱遵循源檔案名稱加上零填充幀編號，這在檔案管理員或影像編輯器清單中保持動畫順序。頁面也顯示不嵌入 PNG 本身的情境中繼資料，所以你可以在儲存前看到時序。
| 顯示的欄位 | 源 | 寫入 PNG |
|---|---|---|
| 幀編號 | 解碼 GIF 影像順序，從 1 開始 | 是，作為檔案名稱的一部分 |
| 畫布尺寸 | GIF 的完整邏輯寬度和高度 | 是，作為 PNG 像素尺寸 |
| 顯示延遲 | 毫秒為單位的解碼 GIF 延遲 | 否，僅在頁面上顯示 |
| 透明區域 | 保留 alpha 的畫布像素 | 是，作為 PNG alpha 通道 |
| 原始修補程式矩形 | 編碼器實際儲存的小區域 | 否，完整畫布被匯出 |
安全限制及為什麼某些 GIF 被拒絕
分割器強加一小組硬限制，以便一個看似微小的檔案無法無聲地分配不合理的畫布記憶體量。選定的 GIF 磁碟上最多 20 MB。其畫布在任一側最多 4,096 像素，每個幀 300 萬像素。頁面接受最多 50 個影像幀，並在開始產生 PNG 下載前檢查總補丁工作和組合輸出像素計數。動畫檔案通常遠超過其原始位元組尺寸解壓縮，所以這些檢查在建立任何輸出前執行。被拒絕的輸入產生清晰訊息，無部分幀清單，所以你絕不會以需要清理的半完成提取結束。
| 限制 | 最大值 | 為什麼存在 |
|---|---|---|
| 源檔案尺寸 | 20 MB | 停止非常大的 GIF 阻止瀏覽器分頁 |
| 畫布寬度或高度 | 4,096 px | 將單一幀保持在典型瀏覽器畫布尺寸上限內 |
| 每個幀的像素 | 3,000,000 | 防止單一巨大幀耗盡分頁記憶體 |
| 檔案中的影像塊 | 50 | 為一個提取執行綁定總工作 |
在你擁有幀之後
一旦 PNG 在磁碟上，它們就像任何其他靜止影像一樣運作。你可以個別裁剪、調整大小、重新著色、加浮水印或註解它們，然後將它們發佈為個別資產或重新組合新動畫。如需逐步指導在較小尺寸重建動畫，在瀏覽器上調整 GIF 大小而不破壞動畫的演練涵蓋如何將調整大小的靜止放回一起同時保持可見幀和逐幀時序。提取的 PNG 也是審計第三方 GIF 在使用前的好方法，因為你可以開啟 frame-01.png、中間幀和最終幀，以確認迴圈中三個點的實際內容，而無須用眼睛透過動畫擦洗。
本地合成器在幕後如何運作
合成通行依賴於瀏覽器的畫布和影像資料 API，而非伺服器端影片工具。當你開始提取時，頁面按解碼器暴露它們的順序逐塊讀取 GIF，在正確時刻應用先前幀的處置指令、使用 CanvasRenderingContext2D.putImageData 在新鮮邏輯畫布上繪製每個透明修補程式，並使用 HTMLCanvasElement.toBlob 將最終畫布變成可下載檔案。所有這些都在當前分頁內運行，暫時 URL 在輸出被替換或元件卸載時被撤銷，源 GIF 本身絕不上傳。如果瀏覽器無法配置必要的畫布或無法解碼提供的檔案，操作在任何 PNG 提供下載前停止，所以頁面絕不提供斷裂或錯誤標籤影像。工具也無法回復瀏覽器解碼器無法讀取的幀、重建影片時軸、保留 GIF 評論或應用程式擴展、偵測重複視覺幀或推斷最有用的靜止，所以提取集恰好是源動畫包含的內容，無其他。
相關閱讀：如何在瀏覽器中為 Discord 製作 GIF。