今天想把遊戲放到 GitHub Pages，讓任何人打開網址就能玩。過程中遇到三件事：

1. 3D 模型的 .glb 太大，推不上 GitHub，先改回原本的 2D map 模型（只埋一個彩蛋）。
2. 成功設定 GitHub Pages。
3. 實際跑起來，模型載入非常久。

最後一段整理了我和 AI 討論後，列出來的幾個縮小模型的方向。這些方向我還沒有實測，會留到之後的文章。

一、3D 模型推不上 GitHub

發生了什麼

我在 Blender 合成完彩蛋後匯出了 3D model 的 .glb，想推上 GitHub，結果被拒絕：

remote: error: File 3d_unseen_true.glb is 111.97 MB; this exceeds GitHub's file size limit of 100.00 MB
remote: error: GH001: Large files detected. You may want to try Git Large File Storage - https://git-lfs.github.com.
 ! [remote rejected] master -> master (pre-receive hook declined)

逐行看：

• 3d_unseen_true.glb is 111.97 MB：這個檔案有 111.97 MB。
• exceeds GitHub's file size limit of 100.00 MB：超過 GitHub 單一檔案 100 MB 的上限。
• remote rejected：伺服器拒絕了這次推送，整次推送都失敗，不只是那一個檔案。

官方的限制

依 GitHub 官方文件：

• 超過 50 MiB：「If you attempt to add or update a file that is larger than 50 MiB, you will receive a warning from Git.」只是警告，推送仍然成功。
• 超過 100 MiB：「GitHub blocks files larger than 100 MiB.」直接擋掉。
• 想放更大的檔案，要用 Git LFS：「To track files beyond this limit, you must use Git Large File Storage (Git LFS).」

我之前的 blender_output.glb 約 50 MB，落在警告的邊緣，所以推得上去。新的 3D model 有 111.97 MB，就被擋了。

先不處理這個大檔案，改回最一開始的 2D map 模型，大小約 50 MB，而且場景裡只有一個彩蛋。
3D model 要怎麼縮小，放到第四節討論。

程式要跟著改

換回舊模型，程式找彩蛋的名稱也要跟著換。舊模型裡的彩蛋名稱是 CharacterArmature，但 Day 24 我把程式改成了找三個名稱：

const EGG_NAMES = ['EnemyArmature', 'AnimalArmature001', 'AnimalArmature002'];

舊模型裡沒有這三個名稱，程式會找不到彩蛋，Console 會出現「找不到 …」的警告。所以換回舊模型時，要把清單改成舊模型的名稱：

const EGG_NAMES = ['CharacterArmature'];   // 舊模型（2D map）裡只有一個彩蛋

二、設定 GitHub Pages

正確的步驟

1. 打開 repo drone_threejs，點上方的 Settings（是 repo 頁面上方那一列，不是頭像選單裡的）。
2. 左邊選單找到 Pages。
3. Source 選 Deploy from a branch。
4. Branch 選 master，資料夾選 / (root)，按 Save。
5. 等一下，頁面上方會出現網址。

為什麼資料夾選 / (root)：官方文件說，網站的進入檔案要放在來源資料夾的最上層，而我的 index.html 就在 repo 最上層。

網址的規則，依官方文件，專案網站（project site）是：

http(s)://<owner>.github.io/<repositoryname>

設定成功後，可以如圖看到，在設定頁面的上方，出現對應的網址

三、實際跑起來：模型載入非常久

網站上線後，我用網址打開，模型要等非常久才出現。
大概花了 10 分鐘才載好模型

為什麼部署後才變慢

前幾天在 Day 26 整理過，載入分成兩段：

在自己電腦上測試時，檔案在本機硬碟，① 幾乎不花時間。部署後，約 50 MB 的檔案要經過網路從 GitHub 傳到我的瀏覽器，① 就變成使用者看得到的等待。

不過「這次變慢，是 ① 造成的」只是我目前的推論，我還沒有量過兩段各花多久。

四、與 AI 請教解決的幾個方向

我把 3D model 的 111.97 MB 和載入很慢的問題，拿去請教 AI，下面是整理出來的方向。以下都只是方向，還沒有實測，實測的結果會放在之後的文章。

方向 1：先分清楚大小是誰佔的

.glb 裡主要是兩種東西：模型的面（幾何）和貼圖圖片。縮小之前，要先知道是哪一個佔大部分，兩個處理方式不一樣。

方向 2：匯出時調整 glTF 選項

依 Blender 官方手冊，匯出 glTF 時，跟檔案大小有關的選項：

設計一個實驗：同一個場景，用不同的設定各匯出一次，在檔案總管比較大小。

方向 3：減少面數

Blender 有 Decimate 修改器，可以減少模型的面數。這個方向我還沒有讀完官方手冊，要先看過說明再實驗。

方向 4：Draco 壓縮

Draco 只壓縮模型的面，不壓縮貼圖。用在網頁上之前，還要查 Three.js 官方的 DRACOLoader 文件，確認載入端要怎麼設定。

小結

• GitHub 單一檔案超過 100 MiB 會被擋，整次推送都失敗。
• 暫時改回 2D map 模型（約 50 MB、一個彩蛋），程式找彩蛋的名稱也要跟著改。
• GitHub Pages 在 repo 自己的 Settings 裡開
• 部署後模型載入很久，推論是檔案要經過網路傳輸，但還需要量測確認。
• 縮小模型有幾個方向，先量出大小是誰佔的，再用實驗比較。

接下來

下一步是把載入時間量清楚，再挑一個方向縮小模型，之後預計進行手機測試。