感謝觀看 Google I/O 大會!立即觀賞隨選內容。 本頁面由 Cloud Translation API 翻譯而成。 web.dev 探索 最佳化與下一個顯示的內容 (INP) 互動 如何最佳化與下一個顯示的內容 (INP) 的互動 瞭解如何改善「與下一個顯示的內容互動」指標。 總覽 與下一個顯示的內容 (INP) 互動是重要的回應指標,可評估網頁回應使用者互動的速度。INP 會記錄使用者與網頁互動時發生的所有延遲,並回報所有 (或幾乎所有) 互動中的延遲時間。最佳化 INP 是一項涉及互動的過程,需要瞭解能夠促進互動的各種面向。幸好,以下一系列指南有助您瞭解 INP 的運作方式、如何找出實際運作速度緩慢的互動情形,以及如何在研究室中重現這類互動並修正問題。 熟悉 INP 以及如何進行最佳化 與下一個顯示的內容互動 (INP) 改善與下一個顯示的內容的互動方式 疑難排解 尋找欄位中的緩慢互動 手動診斷研究室中的緩慢互動 最佳化 JavaScript 導致的不良 INP 針對長時間工作進行最佳化調整 最佳化輸入延遲時間 指令碼評估和長時間任務 使用網路工作站在瀏覽器主執行緒中執行 JavaScript 最佳化因算繪作業導致的 INP 不佳 避免發生複雜的大型版面配置和版面配置閃爍 降低樣式計算的範圍和複雜度 DOM 大小過大對互動的影響,以及您可以採取哪些行動 用戶端轉譯 HTML 和互動功能 INP 最佳化的實際案例研究 Disney Hotstar 如何把 INP 減少 61%,讓客廳裝置上的每週卡片觀看次數增加 61% PubTech 的同意聲明管理平台如何將客戶網站上的 INP 減少高達 64%,同時使廣告可視度提升多達 1.5% 內容推薦供應商 Taboola 使用 LoAF 將發布商合作夥伴網站的 INP 改善率提高至最高 36% 經濟時間修正 INP redBus 網站與 Next Paint 的互動成效提升了 7% Trendyol 將 INP 減少 50%,點閱率提升 1%