Web 效能的“為什麼”
網頁效能就是讓網站速度變快，包括讓緩慢的過程看起來更快。本文將介紹為什麼網頁效能對網站訪問者和您的業務目標很重要。
| 預備知識 | 已安裝基本軟體，並具備 客戶端 Web 技術 的基礎知識。 |
|---|---|
| 目標 | 初步瞭解為什麼網頁效能對良好的使用者體驗至關重要。 |
網頁效能是指網站內容在網頁瀏覽器中載入和渲染的速度，以及它對使用者互動的響應程度。效能差的網站顯示速度慢，對輸入的響應也慢。效能差的網站會增加使用者流失。最糟糕的情況下，效能差會導致內容完全無法訪問。網頁效能的一個好目標是讓使用者察覺不到效能問題。雖然個人對網站效能的感知是主觀的，但載入和渲染是可以衡量的。良好的效能對大多數網站訪問者來說可能並不明顯，但大多數人會立即識別出緩慢的網站。這就是我們關心它的原因。
為什麼關心效能？
網頁效能——及其相關的最佳實踐——對於您的網站訪問者獲得良好的體驗至關重要。從某種意義上說，網頁效能可以被認為是網頁可訪問性的一個子集。與可訪問性一樣，在效能方面，您需要考慮網站訪問者正在使用什麼裝置訪問網站以及裝置的連線速度。
例如，考慮 CNN.com 的載入體驗，在撰寫本文時，該網站有超過 400 個 HTTP 請求，檔案大小超過 22.6MB。
- 想象一下在連線到光纖網路的臺式電腦上載入這個。這會顯得相對較快，檔案大小也將基本無關緊要。
- 想象一下在通勤回家的公共交通工具上，使用九年前的 iPad 透過移動資料網路載入同一個網站。同一個網站載入速度會很慢，甚至可能近乎無法使用，具體取決於蜂窩網路覆蓋情況。您可能在它載入完成之前就放棄了。
- 想象一下在覆蓋範圍有限的地區，使用低成本裝置載入同一個網站。該網站載入速度會非常慢——如果能載入的話——阻塞指令碼可能會超時，並且不良的 CPU 影響可能會導致瀏覽器崩潰（如果能載入的話）。
在 3G 網路上，一個 22.6MB 的網站可能需要長達 83 秒才能載入，其中DOMContentLoaded（表示網站的基本 HTML 結構）需要 31.86 秒。
而不僅僅是下載時間是一個大問題。在某些地區，網際網路連線是按兆位元組計費的，這使得大檔案下載變得非常昂貴。我們示例中 22.6MB 的 CNN.com 體驗將消耗移動資料使用者每日流量配額的很大一部分，甚至可能導致某些國際漫遊套餐產生高額費用。
提高轉化率
減少網站的下載和渲染時間可以提高轉化率和使用者留存率。
轉化率是指網站訪問者執行衡量或期望的動作的速率。例如，這可能是進行購買、閱讀文章或訂閱新聞通訊。作為轉化率衡量的動作取決於網站的業務目標。
效能會影響轉化；提高網頁效能可以提高轉化。網站訪問者期望網站在兩秒鐘或更短的時間內載入完成；有時在移動裝置上甚至更短（通常需要更長時間）。這些相同的網站訪問者會在 3 秒後開始放棄緩慢的網站。
網站載入的速度是一個因素。如果網站對使用者互動的響應緩慢，或者顯得卡頓，這會導致網站訪問者失去興趣和信任。
以下是一些效能改進的真實案例
- Tokopedia 將 3G 連線的渲染時間從 14 秒減少到 2 秒，訪客增加了 19%，總會話增加了 35%，新使用者增加了 7%，活躍使用者增加了 17%，每位使用者會話增加了 16%。
- 為效能重新構建 Pinterest 頁面，等待時間減少了 40%，SEO 流量增加了 15%，註冊轉化率增加了 15%。
要構建人們樂於使用的網站和應用程式；要吸引和留住網站訪問者，您需要建立一個提供良好使用者體驗的可訪問網站。構建網站需要 HTML、CSS 和 JavaScript，通常包括影像和影片等二進位制檔案型別。在構建網站時做出的決定和選擇的工具會極大地影響最終工作的效能。
良好的效能是一項資產。糟糕的效能是一種負擔。網站速度直接影響跳出率、轉化率、收入、使用者滿意度和搜尋引擎排名。效能良好的網站已被證明可以提高訪問者留存率和使用者滿意度。內容載入緩慢已被證明會導致網站使用者流失，有些訪問者甚至不會再回來。減少客戶端和伺服器之間傳輸的資料量可以降低所有相關方的成本。減少 HTML/CSS/JavaScript 和媒體檔案大小可以縮短載入時間並降低網站的功耗（請參閱效能預算）。
跟蹤效能很重要。包括網路速度和裝置功能在內的多個因素都會影響效能。沒有單一的效能指標；不同的業務目標可能意味著不同的指標對網站或其支援組織的目標更相關。您的網站效能的感知方式就是使用者體驗！
總結
網頁效能對於可訪問性以及服務於組織或企業目標的其它網站指標也很重要。良好的或糟糕的網站效能與使用者體驗以及大多數網站的整體有效性密切相關。這就是您應該關心網頁效能的原因。