網站速度測試如何工作

更新時間:2022-05-24 / 文章作者:Timothy Shim

“一張圖抵千言”這句話你可能很熟悉。 好吧,事實證明,一秒鐘的轉化率約為您網站的 3.4%。 由於加載頁面緩慢,這是大量的業務損失。 

那麼如何確定您的網站加載速度是否足夠快? 網站速度 測試是找出答案的好方法,但是您可以使用許多不同的測試。

本文將為您提供有關正確運行速度測試、解釋結果以及使用這些信息來提高網站速度的信息。

如何正確測試網站速度

您可以使用許多工具來運行網站速度測試。 有些會給你很多信息,有些可能不會給你足夠的信息。 獲得最準確結果的最佳方法是使用幾個工具或通過相同的方式運行多個測試。 

延遲解釋
數據傳輸時間受物理距離的限制。 實際服務器響應時間因服務器位置不同而異。

重要的是要記住,結果通常取決於您的 Web服務器 相對於測試原點的位置。 這兩者相距越遠,數據需要傳輸的時間越長,可能會影響速度測試結果。

因此,您應該始終 選擇一個網絡服務器 靠近您預計訪客最多的位置。 例如,主要服務於美國流量的網站應該位於美國境內。

如果您迎合全球受眾,那麼從多個測試位置運行網站速度測試可以讓您更好地了解距離如何影響來自不同位置的訪問者。

理想的服務器速度測試方法

您的測試方法應該涉及多次運行,看起來像這樣:

  1. 從位置 1 運行測試並重複 3 次,記錄所有測試的結果。
  2. 從另一個測試位置重複該過程,類似地記錄數據。 我建議您至少從三個戰略領域進行測試; 美國、歐洲和亞洲。

推薦的網站速度測試工具

網站速度測試示例
示例 – 我們為託管在以下位置的測試站點進行的網站速度測試 Interserver (詳細信息在這裡) 從不同位置使用 WebPageTest.org

提供有關您網站性能的最多信息的工具使用真實的人類訪問者來測試您的網站速度。 例如,Pingdom 的整頁測試在真實位置(美國、澳大利亞、歐洲)使用真實瀏覽器(IE9、Chrome 和 Firefox)來加載您的站點並提供性能報告。

因為它將您的網站作為一個完整的實體進行測試,包括頁面上的所有對象,所以它可以提供提高性能的建議並深入了解可能會降低您網站速度的原因。

但是,您可以考慮使用許多其他有用的網站速度測試工具,包括:

有關這些工具的完整列表,請查看我們的 20 個免費網站速度測試工具列表。

了解速度測試術語

網站速度測試在很多方面都有幫助,但前提是您了解如何使用結果。 只有了解數據的含義,您才能實施適當的更正以提高網站的性能。

在我們深入解釋速度測試結果之前,熟悉一些術語會很有幫助。 這些術語主要與網絡相關。

潛伏

從您單擊鏈接或在瀏覽器中輸入地址到您在屏幕上看到結果之間發生的所有事情所花費的時間。 延遲的標準度量單位是毫秒 (ms)。

平安

Ping 經常與延遲混淆,是一個精確術語,用於描述單個數據包離開您的計算機並到達其目的地所需的時間。 像延遲一樣,您以毫秒為單位測量 Ping。

第一個字節或第一個字節的時間 (TTFB)

TTFB 是用於指示 Web 服務器響應能力的度量。 您將 TTFB 測量為從用戶或客戶端發出 HTTP 請求到客戶端瀏覽器接收到第一個字節的持續時間。 

頁面大小

網頁的大小是其所有內容的大小。 Web 瀏覽器要完全加載網頁,它必須下載所有內容,包括 HTML代碼、圖像、樣式表等。這些內容的總和越大,加載所需的時間就越多。

第一互動

大多數網絡瀏覽器將允許用戶在完全加載之前開始在網站上執行活動。 首次互動是在這發生之前在您的網站上停留的時間。

根據您選擇的網站速度測試工具,您可能會遇到更多術語。 這些包括:

和更多。 如果您打算使用提供上述數據的測試,請嘗試盡可能多地了解這些術語的含義。

解釋速度測試結果

Google 的 PageSpeed Insights 可以快速評估您的 網站效果.

從上面的術語可以看出,很難將一種解釋方法應用於所有網站速度測試工具。

因此,我將使用一個工具作為示例—— 谷歌PageSpeed​​ Insights的.

Google PageSpeed Insights 非常出色,因為 Google 提供了它,並且很可能會展示搜索巨頭的偏好。 它也非常用戶友好,提供視覺結果和解決發現問題的建議。

Google 分別針對移動和桌面性能進行測試,並重點關註四個關鍵要素:首次內容繪製 (FCP)、首次輸入延遲 (FID)、最大內容繪製 (LCP) 和累積佈局偏移 (CLS)。

每個測試區域將在幾秒鐘內返回一個結果和一個質量指示條。 綠色表示好,橙色表示需要改進,紅色需要更緊急的關注。

向下滾動頁面將提供各個測試區域的細分以及每個測試區域的影響因素。 您可以使用它對您的網站進行外科手術改進。

另請閱讀

對緩慢的網站速度測試結果進行故障排除

速度測試結果數據 - 瀑布圖
瀑布圖,通常由大多數出色的速度測試工具提供,顯示網頁元素加載的詳細進度,讓您查看佔用更多時間的內容。 

大多數緩慢的網站都是類似的缺陷的結果。 例如,未能正確優化圖像會導致高 CLS 時序。 然而,鑑於需要關注的領域數量眾多,不可能全面涵蓋這些領域。

一些常見問題和解決方案包括:

減少未使用的 JavaScript

動態網站(比如那些運行在 WordPress ) 經常遇到這個問題。 你可以通過使用一個好的緩存插件來減少 JavaScript 冗餘來解決這個問題。

減少第三方代碼的影響

今天的許多網​​站都是模塊化的,並使用來自不同開發人員的組件(例如,Google、Facebook、Fonts 等)。 這種組合通常會導致缺乏影響性能的凝聚力。 簡化您的網站並儘可能少地使用不同的代碼源。

減少初始服務器響應時間

從本質上講,谷歌是在告訴你你的網絡服務器很糟糕。 低於標準的網絡託管通常會導致速度不佳,除了移到另一個網站之外,您無能為力 主機提供商.

圖像元素沒有明確的寬度和高度

許多網站所有者犯了簡單地上傳圖片而沒有進一步修改的錯誤。 上傳圖片時,請指定參數以避免混淆網絡瀏覽器並導致加載時間延遲。

以下一代格式提供圖像

對於圖像,不僅尺寸很重要,圖像格式也很重要。 像 WebP 這樣的下一代格式增加了壓縮率,使圖像在網絡上的下載速度更快。

使用高效的緩存策略為靜態資產提供服務

當訪問者加載您的網站時,一些內容會被下載並保存在他們的瀏覽器中。 此過程有助於提高重複訪問的性能。 設置緩存策略可以讓瀏覽器知道在重複請求之前它們應該保留這些圖像多長時間。

避免過多的DOM大小

DOM 是指您的網頁的大小。 收到過多的 DOM 警告意味著您需要考慮精簡頁面。 您可以通過多種方式做到這一點,例如減少頁面上的圖像數量或使用更少的部分。

避免大的佈局變化

動態網站即時生成頁面部分。 當您在頁面上有許多這些可調整大小的元素時,佈局會經常發生變化,從而導致糟糕的用戶體驗。 在可能的情況下,正確定義頁面元素。

可能性是無止境。 在嘗試一一解決這些問題之前,我建議您考慮徹底優化您的網站。 網站所有者需要實施許多普遍接受的性能增強。

要了解更多信息,請閱讀 WHSR的指南 提高您的網站性能.

關於網站速度測試的最終想法

網站速度測試是獲取網站性能快照的好方法。 這些工具易於使用,通常提供相對準確的數據。 當然,許多優秀的網站速度測試工具都是免費的,這也有幫助。

然而,重要的是要記住,上述陳述中的關鍵詞是“快照”。 網站速度測試是靜態的,對您的網站的微小更改可能會顯著改變結果。 因此,最好安排定期對您的網站進行性能評估,並儘快糾正新發現的問題。

閱讀更多

關於Timothy Shim

Timothy Shim是一位作家,編輯和科技愛好者。 從信息技術領域開始他的職業生涯,之後迅速地在印刷領域找到方向,並與國際,地區和國內媒體合作,包括ComputerWorld,PC.com,Business Today和The Asian. Banker。 他的專長在於消費者和企業的技術領域。