身為每隔幾年優化一次網站的網路考古學家,在 Google 發行的測速網站 PageSpeed Insights 得到 11 分效能也是理所當然。
根據測速網站 PageSpeed Insights 的建議,做了以下幾種優化:
1.降低第三方程式碼的影響,因為第三方程式碼將主要執行緒封鎖了 2,500 毫秒,包括:
Facebook 封鎖時間 1,020 毫秒
Google/Doubleclick Ads 封鎖時間 879 毫秒
Google Tag Manager 封鎖時間 251 毫秒
Google FundingChoices 封鎖時間 240 毫秒
處理方式:
先載入主要內容(創作本體),後載入不重要內容(廣告和社群外掛)。
工具:
下載 Flying Scripts 外掛。
填入第三方程式碼的關鍵字存檔後,就能將程式碼延後執行 5 秒(可設定 1~10 秒)。
關鍵字:
關鍵字要能夠區分特定程式碼,Flying Scripts 在問與答提供三個範例:臉書圖形可用”fbevents.js”、Google 代碼管理工具可用”gtag”、Facebook 客戶聊天外掛可用”customerchat.js”。
關鍵字也可參考測速網站 PageSpeed Insights 回饋的程式碼,一個一個去測速。
“.js” 是個好關鍵字,一次拖延所有 JavaScript 程式碼,網站速度從 11 分直接加到 60 分。
2.處理圖片載入問題,因為頁首圖片過大、JPG 格式缺乏效率:
手動縮小超巨型頁首圖片尺寸至 1400 px。
下載 Flying Images 外掛,延後載入畫面外圖片,並轉換成較快的 WebP 圖片格式。
3.移除停止更新的外掛,以及佔用資源的小工具:
停用並刪除已經停止更新的外掛。
將小工具列一整排隨機文章展示全數移除。
優化過程最高得分是 91 分,目前調整到自己可接受的狀態是 82 分。