DCL 和 FCP 如何影響 SEO？| Web 效能指標
DCL 和 FCP 都是 Google 在評估網頁效能時使用的重要指標。這些指標比僅僅測量頁面的總載入時間或第一個位元組接收時間 (TTFB) 更深入。
學習目標
閱讀本文後，您將能夠：
- 定義 DCL 與 FCP
- 瞭解瀏覽器如何使用文件物件模型 (DOM)
- 說明 SEO 如何受到這些效能指標的影響
相關內容
想要繼續瞭解嗎？
訂閱 TheNET，這是 Cloudflare 每月對網際網路上最流行見解的總結！
複製文章連結
什麼是 DCL？
DCL 是 DOMContentLoaded 的縮寫，是一個重要的網頁效能指標。DCL 測量瀏覽器準備好執行任何用戶端指令碼的時間點。用更專業的詞彙來說，DCL 是在網頁載入過程中，瀏覽器已組裝 DOM（文件對像模型）且沒有樣式表阻止執行 JavaScript 的時間。（為幫助您理解這些詞彙，請參閱下面的「有關網頁運作方式的簡要說明」。）
什麼是 DOM（文件物件模型）？
DOM 是 Document Object Model（文件物件模型）的縮略字。文件物件模型是網頁結構的表示形式，與研究論文的大綱相同，包含要點和子要點。另一種方法是將 DOM 視為樹，頁面本身是樹根，頁面的不同 HTML 元素是樹枝。
DOMContentLoaded 意味著瀏覽器已經從它收到的 HTML 程式碼產生了該頁面的此模型。這也意味著它已經準備好執行指令碼和顯示動態內容。
什麼是 FCP？
首次內容繪製 (FCP)，是另一個關鍵的效能指標。FCP 測量呈現 DOM 中第一個內容（顯示第一個 HTML 元素）的時間點。這可以是文字、影像或使用者將識別為網頁部分的任何內容。首次內容繪製與首次繪製 (FP) 不同，後者測量頁面中任何元素呈現的時間。
還有其他一些效能指標可以測量「首次」發生某事件的時間。例如，第一個位元組接收時間 (TTFB) 測量來自 Web 伺服器的第一個位元組何時到達瀏覽器。但是，FCP 測量的是使用者可以看頁面開始成功載入的最早時間點。因為使用者對 Web 效能的感知對於其與網站持續互動很重要，所以從使用者的角度來看， TTFB 幾乎無關緊要。
DCL 和 FCP 如何影響 SEO？
網站速度是可靠的 SEO（搜尋引擎最佳化）策略的關鍵部分。效能對於 Google 搜尋引擎排名尤為重要。DCL 和 FCP 是 Google 評估效能時強調的兩個指標，而 Google PageSpeed Insights 可以幫助開發人員對其進行評估。（儘管 Google 並未具體說明這兩個效能指標對於搜尋排名的影響有多大，但肯定將它們考慮在內。）
開發人員可以採取許多措施來改善網站的這些效能指標。利用快取和 CDN 是縮短 DCL 和 FCP 時間的兩個基本措施。
Cloudflare 如何改善 DCL 和 FCP？
Cloudflare CDN 透過在世界各地快取內容，大大加快網站的速度，從而可以更快地回應 HTTP 請求。因此，瀏覽器可以更快地接收頁面 HTML，從而改善這兩個指標。
有關網頁運作方式的簡要說明
網頁是由 HTML 程式碼、CSS 程式碼和 JavaScript 程式碼的組合所組成。當瀏覽器對網頁發出請求時，相關的 Web 伺服器會傳送一個 HTML 檔案，其中包含所有 CSS、JavaScript 和瀏覽器必須單獨請求的其他資產的清單。
- HTML（超文字標記語言）是為瀏覽器提供有關如何顯示內容和請求其他資產的說明的程式碼。
- CSS（階層式樣式表）程式碼提供有關如何顯示 HTML 內容以及有關網頁配置的進一步說明。
- JavaScript 是一種程式設計語言，可以獲取 HTML 內容，並在滿足某些指定條件時對其進行更改。此外，JavaScript 可以用於更複雜的任務，如 3D 呈現、遊戲或其他技術複雜的活動。
HTML 檔案包含頁面上顯示的內容、如何顯示該內容的說明，以及從其他來源載入其他內容（例如影像）的說明。它連結到 CSS 檔案（樣式表）和包含進一步說明的 JavaScript 庫。然後，瀏覽器獲取該程式碼、對其進行解釋，並顯示產生的網頁。
在大多數瀏覽器中，可以透過按右鍵一下任何網頁並在下拉式功能表中選擇「檢視頁面來源」來檢視瀏覽器正在解譯的 HTML 檔案。然後 HTML 檔案將在新索引標籤中開啟。檔案的文字幾乎總是以「<!DOCTYPE html>」開頭。