這是因為 LCP 元素始終位於頁面頂部、折疊上方。它通常是英雄圖像或文字區塊，但有時也可以是影片。在載入 LCP 元素之前，您不會在頁面上看到太多內容。
以下是一些修復這個核心網路至關重要的方法——您無需任何編碼即可完成大部分工作。
Google PageSpeed Insights 提供了優化頁面的機會清單以及預 墨西哥 電話號碼庫
計節省的時間。您採取哪些建議取決於您目前的情況和您想要的目的地。 LCP 與其他兩個核心 Web Vitals 指標一樣，根據載入時間分為三個部分：
較差 – 超過 4.0 秒
需要改進 – 2.5 秒到 4.0 秒之間
好 – 不到 2.5 秒
如果您的 LCP 分數位於「較差範圍」內，請努力使其脫離該區域。無需拍攝完美。
約翰·穆勒 (John Mueller) 建議專注於得分「較差」的核心網路生命力。
請注意，您可以使用其他測量和測試工具，包括Chrome DevTools、WebPageTest、GTmetrix，以及Chrome 使用者體驗報告 和Google Search Console 來取得現場資料。但在這篇文章中我們將繼續使用 Google PageSpeed Insights。
您可以過濾 PageSpeed Insights 審核以僅顯示 LCP 的建議，如下所示。
PageSpeed Insights LCP 審核顯示了提高頁面載入速度的機會。
PageSpeed Insights LCP 審核揭示了提高頁面載入速度的機會。
影響LCP的因素主要有四：
伺服器回應時間慢
渲染阻塞 JavaScript 和 CSS
資源載入時間慢
客戶端渲染速度慢
讓我們看看如何解決這些問題。
這聽起來有悖常理，但有時 WordPress 外掛可以解決其他 WordPress 外掛程式引起的問題（LCP 分數低）
點擊發推文
伺服器回應時間慢
每當您造訪網頁時，您的瀏覽器都需要從該頁面所在的伺服器請求內容。如果伺服器滿足該請求的速度很慢，則內容在螢幕上呈現的時間會更長。對於訪客來說，必須等待才能看到內容並不是一種好的體驗，LCP 指標反映了這一點。
你怎麼知道你的伺服器是否很慢？
PageSpeed Insights 將告訴您主文檔的載入時間。在我們的例子中，因為花費了 450 毫秒，所以它位於報告的「通過審核」部分。文字顏色為綠色，因為它很好。
顯示初始伺服器回應時間的 PageSpeed Insights 通過審核。
PageSpeed Insights 顯示初始伺服器回應時間通過審核。
如果您需要更多了解，您也可以使用網頁測試來測試您的網頁。在這裡，您可以使用首字節時間 (TTFB) 來測量伺服器回應時間。
有四種方法可以修復伺服器效能緩慢的問題：
啟用頁面快取
選擇更快的託管服務
使用內容傳遞網路 (CDN)
儘早建立第三方聯繫
啟用頁面快取
頁面快取在伺服器上保留文件的副本，準備為下一個訪客提供服務。由於不需要重新建立此頁面，因此可以更快地滿足請求。檢查您的網站主機提供者是否提供伺服器級快取。如果沒有，而您使用的是 WordPress，請考慮使用WP Rocket等快取外掛。 啟用快取可以對伺服器回應時間產生相當大的影響，但如果這還不夠，請考慮獲得更快的託管服務。
選擇更快的託管服務
更快的託管服務可以對頁面速度效能的各個方面產生重大影響。如果您打算走這條路線，請尋找在大多數訪客附近擁有伺服器的提供者。兩者距離越近，資料傳輸的速度就越快。
請謹慎加入一小段 JavaScript 來增強網站的功能。這些小片段會對表現產生很大的影響。 #SEO #CoreWebVitals
點擊發推文
使用內容傳遞網路 (CDN)
CDN 是一個由地理分佈的伺服器組成的網絡，由於它們距離訪客更近，因此可以更快地提供內容。 CDN 不會將請求傳送到遠處的伺服器，而是負責：
確定訪客所在位置
尋找最近的伺服器
將內容傳遞給訪客
通常，設定 CDN 非常簡單，成本也很低。
儘早建立第三方聯繫
盡快建立第三方連線是優化LCP的另一種方式。有時，您的伺服器需要連接到第三方，例如，如果您使用 Google Analytics 或 Drift Chatbot。在某些情況下，例如需要顯示重要內容時，它們可能會影響 LCP。
在您的程式碼中使用rel="preconnect" 可以快速建立該連線。
並非所有瀏覽器都支援預先連接，因此也包含rel=”dns-prefetch” 更快地解析 DNS 查找。
如果您使用 WordPress， Perfmatters或 WP Rocket等外掛程式 可以幫助您做到這一點。否則，您可能需要開發人員的協助。
渲染阻塞 JavaScript 和 CSS
當 Web 瀏覽器解析 HTML 時，它會建立文件物件模型 (DOM) 樹，然後呈現頁面。但是，如果存在任何渲染阻塞資源（例如 Javascript 和 CSS），則該過程將花費更長的時間，並且 LCP 分數將會增加 - 這很糟糕。有幾種方法可以刪除渲染阻塞資源：
內聯關鍵資產
延後較不重要的資源
內聯關鍵資產
關鍵 CSS 資源是那些「首屏」且需要盡快載入的資源。這需要識別關鍵的 CSS 元素並將它們內聯到 HTML 中。如果您需要走這條路線，請搜尋「線上關鍵路徑 css 產生器」。
透過將其直接包含在 WordPress 中來內聯關鍵 CSS<head>.如果您使用的是 WordPress，則有一些關鍵 CSS 外掛程式 可以為您內聯這些資源。
