註：本文爲本人當時看到 Wiwi 官大為的 blog 網站上的一篇文章後針對該文寫給他的留言 Email 的稍微改寫並重新發佈的版本。
最近讀完了 Wiwi 在其 blog 網站上發表的那篇「當仙草凍比遊戲還大」的文章，讀到「instagram.svg 檔案竟然大小有 2.9 MB」那部份時真的驚訝到我。
「SVG 檔案不就是因爲以儲存向量資訊而非畫素資訊作爲特色，所以才理應能做到將檔案大小壓縮到極致的效果嗎？使用 SVG 檔案的目的不就是如此嗎？」我當時心想。
再加上讀到文中的這一句：
我真的很好奇這個 SVG 裡面到底寫了什麼，是不是包含了 Instagram 的完整程式碼？還是他們把 Meta 的整個元宇宙都不小心放進去了？
這促使我決定要一探究竟那個 Instagram 圖示檔案如此肥大的原因。
我下載了該圖示的原始檔並使用 VSCodium 打開它以查看它裡頭的 SVG 程式碼（畢竟 SVG 本質上就是 XML），結果發現不得了：裡頭竟然嵌入了長達三萬多行、以 base64 編碼的 PNG 檔程式碼！而且它還是放在通常用於連結到另一網址的 xlink:href 屬性裡頭，代表那其實根本是可有可無的廢 code！
直接把那部份程式碼全刪掉並重新儲存檔案後，結果發現不僅檔案沒有損壞，圖示也完好無缺、沒有變形，而大小則直接大縮水到只剩 1.5 KB！
對嘛，這才是 SVG 檔案格式的正確使用方式嘛！
真的是對某些網頁設計師感到汗顏欸⋯⋯不過他的文章也提醒了我該去檢查看看自己網站上的圖片檔案有沒有太肥大的問題😅。
出於好奇，我也將那 PNG 檔案的 base64 編碼解碼，以獲取它對應的原始圖片，結果該圖片長這樣：
如圖所示，原始檔案大小達到 2.2 MB，爲了不要浪費大家的網路流量，我僅附上該圖片在某圖像瀏覽軟體開啟時的截圖。
所以嵌入這個圖片到那 Instagram 圖檔裡頭到底是要幹嘛啦？！
（2025 年 7 月 31 日更新）
嚴格來說，之前我刪掉的程式碼部份只是那 xlink:href 屬性中的 base64 編碼。其實我們是可以把整個 <image> 元素裡內含的一切程式碼也一併刪除，以達到更極致的檔案瘦身效果。畢竟在這個使用情境中，誰需要在 SVG 檔裡另外嵌入一個圖檔啊？
在這麼做之後，我們可以將該圖檔的大小進一步縮減至 1.4 KB！好吧，差別不是很顯著，但至少是有差別啦。
題外話：由於近期的 Visual Studio Code 更新（並且連帶影響到 VSCodium），現在在 VSCodium 打開 SVG 檔案會預設以圖片預覽的形式呈現，而非像之前那樣顯示其原始碼。欸不是啊，誰要這個功能啊？！人家都特地用程式編輯軟體打開 SVG 檔了，當然是爲了要查看裡頭的原始碼啊！這下好了，想要查看原始碼還要去特地修改一些設定才行，煩欸⋯⋯