網站連結:GitHub Page
此網站是 程式導師實驗計畫第三期 第二十週的作業,如果你覺得網站很卡很肥大,沒錯你是對的,因為我們故意把這個網站做得這麼卡。
現在呢,你要來負責最佳化這個網站,在「不動內容」的情形下來調整,意思就是說網頁看起來要「長得一模一樣」,把圖片變黑白、刪減文字或是更動排版都是不允許的,但刪減多餘的 HTML、CSS 和 JS 是 ok 的,只要保證網頁看起來一樣就行了,原始碼怎麼動隨便你,總之目標是使網站的載入速度變快。
這只是一個靜態網站,你可以 fork 到自己的 GitHub 去然後用 GitHub Page 來部署,也可以部署到自己的 Server 去並且額外做一些伺服器端的最佳化。
部署上去之後可以使用 WebPageTest 這個網站來測試你的網站速度為何。(測試地點請統一選擇 Singapore - EC2),Browser 為 Chrome。
完成以後可以在這個 repo 開一個 Issue 來記錄自己的結果(範例)。也可以在 Issues 裡面看到其他人的報告,看看別人怎麼做的,順便偷學個幾招。
若是你沒有任何靈感,可參考 web.dev 或是 Website Performance Optimization
此專案由 @yakim-shu 負責製作,十分感謝。