原因和內容為何？
您可能聽說過漸進式網頁應用程式技術為網站做些什麼。您可能會想直接跳到的地方，新增 PWA 功能。那是可行的，但最好先瞭解「PWA-Ready」 就能獲得更好的使用體驗。
無論使用多少 PWA 魔法，都能修正阻擋 JavaScript 或波紋圖片等問題。PWA 需要穩固的基礎
那麼，該如何檢查網站的健康狀態呢？第一步是做網站稽核
稽核網站或應用程式有助於打造彈性且高效能的體驗，並突顯能以最少完成簽署程序快速實作的結果。稽核也提供了資料導向開發的基準。是否改變了事情？和競爭對手的網站有何差異？這樣一來，您就能取得優先處理工作的指標，並且在您著手改善時，提供具體的證據。
如果時間只有 5 分鐘...
在首頁上執行 Lighthouse，然後儲存報表資料。您擁有量化基準和待辦事項清單，可在效能、無障礙功能、安全性和 SEO 方面做出改善。
如果時間只有 30 分鐘...
Lighthouse 可能仍是最佳開始方式，但您也可以多一點時間，從其他工具記錄結果：
- Chrome 開發人員工具安全性面板：HTTPS 使用率。
- Chrome DevTools 網路面板：載入時間、資源大小和 HTML、CSS、JavaScript、圖片、字型和其他檔案的要求數。
- Chrome 工作管理員：如果您的網站經常使用大量的 CPU 或記憶體，超過其他應用程式，您可能需要修正記憶體流失、工作執行或資源載入問題。請務必利用能夠代表使用者的裝置測試您的網站。
- WebPagetest：不同位置和連線類型的效能、快取、第一個位元組的時間、CDN 用量。
- Pagespeed Insights：載入效能、資料費用和資源用量，包括醒目顯示實際效能統計資料的 Chrome 使用者體驗報告資料。
- Speed Scorecard 與影響計算機：與同業比較網站速度，並預估改善網站速度的潛在收益商機。
請務必在首次使用者看到網站時進行測試使用無痕式 (私人) 視窗開啟網站，或使用瀏覽器工具停用快取及清除儲存空間。這可以確保每項資產都是從網路 (而非本機快取) 擷取，讓您準確掌握第一次載入的效能。
現實世界測試並沒有什麼優點，那就是使用與使用者相同的裝置和連線來嘗試網站，並記錄主觀體驗。
如果您發現有些工具有很多種...
詳情請參閱「如何思考速度工具」指南。
如果沒有其他問題，請使用 Lighthouse 檢查：
- HTTPS：所有網站都應該透過 HTTPS 傳送所有資產。
- 伺服器設定：網路伺服器或 CDN 應正確使用壓縮功能、使用 HTTP/2，並加入適當的標頭，以便讓瀏覽器快取資源。
- 可移至網頁底部和/或指定非同步或延遲屬性的指令碼元素。
- 可移除的 JavaScript 和程式庫。
- Unused CSS 和未使用的 JavaScript。
- 可透過較高的壓縮或像素尺寸儲存的圖片。
- 使用不同格式進行較小儲存的圖片檔，例如以 PNG 格式儲存的相片。
目標對象、利害關係人、背景資訊
重構的優先順序取決於您的目標對象、內容和功能。哪些人會造訪您的網站？客戶使用這項工具的原因和方式您的效能預算為何？如果不確定這些問題的答案，可以嘗試從我們的 PWA 訓練資源收集練習的需求：您的目標對象、內容和適合所有使用者的設計。
利害關係人是誰？他們的優先順序為何？這會影響您建構、呈現及分享稽核資料的方式。
如果您無法稽核整個網站，不妨查看網頁分析，瞭解應該注意的地方。例如高跳出率、網頁停留時間偏低和非預期的離開網頁，都是判斷起點的最佳起點。 同樣的業務指標，例如代管費用、廣告點擊和轉換。從利害關係人瞭解他們重視的資料。
測試、錄製、修正、重複測試
進行任何變更「前」記錄網站狀態，藉此找出問題並設定改善或迴歸的起點。這樣您就能提供資料，證明及獎勵 開發工作的合理性
請務必在網站上測試多種網頁類型，不要只測試首頁。針對單一頁面應用程式，請測試不同的元件、路徑和使用者體驗流程，不要只測試第一次載入體驗。