網站速度如何影響網站？解決策略是什么？

我來簡單概述一下在擴展業務的過程中可能遇到的一些網站性能損害因素及其解決措施。

1.速度對發現的影響

在參與分析的網站中，82%（僅提供英文版）的網站受到嚴重影響性能的問題的困擾，44% 的網站存 在嚴重問題。修復這些問題刻不容緩。Google 宣布將于 2021 年 5 月開始根據速度等核心網頁指標 (Core Web Vitals) 進行網站評分（僅提供英文版），以對網站進行排名和推薦。 性能不佳將對自然搜索排名產生負面影響。

系統將以核心網頁指標來計算，滿分為 100 分，并衡量多種性能指標（僅提供英文版）來確定真實訪 客對您網站速度的感受。您還可以使用 Google Lighthouse（僅提供英文版）：Google Lighthouse 不使用來自真實用戶的數據，而是在模擬實驗室設置中衡量您的網站，以了解您的網站性能并跟蹤您 的提速進度。

根據零售系統研究公司 (Retail Systems Research) 的年度報告單（僅提供英文版），排名接近互聯網 零售商 500 強的品牌已將移動端頁面加載時間從 9.25 秒縮短到 7 秒，但與購物者期望的 3 秒仍有很 大差距。系統將以毫秒為單位衡量（僅提供英文版）您的網站，相對微小的速度疏忽可能會嚴重影響 您的排名。

與可發現性相關的性能問題

您添加到網站的代碼和第三方應用會加重頁面負擔、延長加載時間，并且很快將導致網站受到搜 索引擎優化 (SEO) 懲罰。即使是擁有相對成熟開發團隊的品牌，也會在嘗試改善客戶體驗時無意 間降低網站性能。

代碼膨脹問題

品牌在提高網站速度時通常會優先考慮圖片（質量和數量），而事實上，在為高質量圖片和媒 體文件創造空間的同時，還有影響更大的優化方法。JavaScript 問題是其中一大影響因素， 在 Lighthouse 評分中，其執行情況占 40%（僅提供英文版）。隨著功能的增加，頁面上的 JavaScript 數量也會增加。JavaScript 需要更多時間來下載、解析和執行。JavaScript 累積 得越多，網站速度就越慢。 性能不佳的網站也可能使用阻礙解析的 JavaScript（使用

第三方集成問題

第三方解決方案可能會因為在標簽內加載來自第三方的同步腳本、樣式表或字 體而減慢您的網站速度。直接添加到中的阻礙解析的腳本（僅提供英文版）通 常會對性能產生直接影響。 甚至已卸載的集成（例如應用）也可能留下導致網站停滯的代碼片段，從而使您在結果中 的可發現性降低。  Google Optimize 等 A/B 測試工具可能因為使用防閃爍代碼片段而導致頁面在轉換時 變為空白，該代碼片段會隱藏初始頁面，直到實驗容器就緒為止。事實上，即使您根本未 運行實驗，Google Optimize 也可能減慢您的網站速度。

頁面大小問題

 頁面具有各種形狀和大小。隨著某些頁面日益龐大，它們在不同的地理位置或不同的設 備上的加載速度也可能不同，這會對國際拓展工作產生負面影響。您可以在 Lighthouse 審核建議中看到超大或未使用文件的清單。 體積龐大的頁面加載速度較慢，并且可能不會立即呈現首屏（頁面中最有價值的位置） 的內容。

如何提升性能和可發現性

保持網站精簡靈活

使用縮?。▋H提供英文版）技術來縮減所需代碼。刪除網站中低質量的 HTML、CSS 和 JavaScript 代碼，在不影響功能的情況下，減少發送給用戶的數據量（僅提供英文版）。

對第三方集成進行取證審核

查看現有集成（例如應用）并量化它們為業務增加的價值。一些應用提供產品推薦和社交 圖片信息流，這會不必要地請求大量圖片。將價值與可能的性能降低進行比較，然后刪除 不必要或損害價值的集成。 即使在卸載應用后，您還需要在網站上搜索剩余代碼的痕跡并手動將其刪除，以確保應 用在卸載后不會影響性能。 為給應用清理工作提供方向，請創建速度基準（僅提供英文版）來確認您的工作是否真正 提高了性能。

優先加載首屏內容

延遲加載（僅提供英文版）不會強制用戶下載您網站上的所有圖片，而是一開始僅向購物者顯示網 站頂部的圖片。只有當用戶開始向下滾動后，頁面才會獲取該頁面部分的圖片。使用 lazysizes（僅提 供英文版）、lazyload（僅提供英文版）和 yall.js（僅提供英文版）等 JavaScript 庫延遲加載您的網 站。如果您的大多數訪客使用 Chrome，您可以通過將 loading=“lazy”（僅提供英文版）屬性添加 到 標簽中來延遲加載選定圖片，但請注意，您的圖片不會在其他瀏覽器中延遲加載。

權衡速度和頁面大小

在對網站性能進行基準評估時記錄頁面大小和加載時間。使用這些輸入數據來指導優化工作。 例如，假設頁面平均大小為 15 MB，加載時間為 2 秒。如果您希望將加載時間縮短 0.7 秒，并且 您的基礎設施能夠向用戶提供平均每秒 7.5 MB 的數據，那么您每頁的頁面大小需要不超過 9.75 MB 才能達到 1.3 秒的加載時間目標。

2.速度對瀏覽的影響

當您知道只有 10% 的購物者（僅提供英文版）訪問您的網站時會將商品添加到購物車時， 豐富瀏覽體驗就顯得很有必要。但促使購物者下單的工具、信息和推銷內容可能會顯著 降低網站速度（僅提供英文版）。

近四分之一的客戶旅程都是從產品詳細信息頁面（PDP）[僅提供英文版] 開始的，該頁面通常 圖片和文字都很豐富（僅提供英文版）。PDP 通常包含具有以下功能的代碼或第三方應用。

零售系統研究公司 (Retail Systems Research) 2019 年的一項研究（僅提供英文版）顯示，當問 及使網上購物最愉快的兩項在線功能時，產品評分或評論以及比較類似產品的功能位居榜首。 創建豐富且快速的 PDP 通常需要在性能和功能（僅提供英文版）之間進行艱難的權衡。優化 PDP 的最大內容繪制（僅提供英文版），或者讓購物者覺得 PDP 有用，這對于改善瀏覽體驗 至關重要。

與瀏覽相關的性能問題

快速 PDP 和登陸頁面的結構旨在平衡加載速度和功能豐富的瀏覽體驗。定期開展用戶體驗 實驗的高增長品牌必須最大限度地減少第三方腳本和應用對速度的負面影響，同時以最佳方 式構建產品頁面。

配置問題

標簽中加載的第三方同步腳本、樣式表或外部字體可能會對瀏覽體驗產生負面 影響。直接添加到中的腳本通常會對性能產生直接影響。  第三方腳本、域名和資源（例如 Google Analytics、Tag Manager 或 Facebook）并不總 是能立即被瀏覽器發現。它們可能會導致 TCP（傳輸控制協議）和 TLS（傳輸層安全性 協議）延遲并爭奪帶寬。這尤其會降低移動端瀏覽體驗，而移動端瀏覽體驗在移動購物 不斷增長的時代至關重要：在 2020 年黑色星期五/網絡星期一期間，67% 的銷售額來自 移動設備，而來自臺式機的銷售額只有 33%。 不受支持的外部網絡字體（僅提供英文版）并不總能立即呈現，這可能導致加載延遲。

架構問題

在網站或頁面呈現之前，依賴運行 PHP 或服務器環境的應用層以及必須引用的 SQL 數據庫來計算數據并返回結果 ; 移動端設計或架構有缺陷（由內存有限（僅提供英文版）的服務器提供的數據過多）， 如果發出過多 HTTP 請求（僅提供英文版），它們可能無法完全或快速呈現， 尤其是在使用老舊設備連接到蜂窩網絡時更是如此 ; 基礎設施集中，在分發存儲桶和最終用戶之間形成距離 ; 不可靠和不可預測的第三方集成會增加客戶旅程中的摩擦，進而提高跳出率。

如何提升性能和瀏覽體驗

通過預連接節省數百毫秒時間

預連接到關鍵第三方域名（僅提供英文版），幫助瀏覽器更快下載。Google 工程師建議使用 rel=preload（僅提供英文版）作為提示資源，這樣可在瀏覽器發現關鍵資源之前提前獲取它們。 域名系統 (DNS) 預取規則將指示瀏覽器查找并緩存外部域名的 DNS 信息，并可能將加載時間縮短 數百毫秒。

對第三方集成進行審核

查看現有的第三方集成（例如應用），并嘗試從瀏覽體驗中消除盡可能多的“jankiness”。 jankiness 是指 Google 試圖通過核心網頁指標中的累積布局偏移來捕獲的內容?？紤]任何集成可 能帶來的性能降低，并刪除無法創造價值的集成

3.速度對結賬和轉化的影響

網站速度較慢會對轉化率產生負面影響。業界廣泛引用“頁面加載時間”這項統計數據 來衡量該影響。這一時間每延遲 1 秒，會導致轉化率下降 7%（僅提供英文版），其真實 的影響被低估了，因為疫情將電子商務相當于推進了 10 年。速度提高 1 秒可能意味著高 達 27% 的轉化率提升（僅提供英文版）。即使是最小幅度的改進（毫秒級別）也可以產 生數百萬美元的額外銷售額（僅提供英文版）。 研究表明，移動網站速度僅提高 0.1 秒即可將轉化率提高 8%， 將消費金額提高 10%。

與轉化相關的性能問題

業務發展超出基礎設施承載能力的情況并不少見。同樣，品牌往往缺乏隨著業務發展優化基礎 設施和營銷資產所需的技術專業知識。

基礎設施問題

 在節假日促銷和限時搶購等高流量時期或快速增長時期，帶寬不足的自托管電子商務網站 很容易崩潰。低成本的 DNS 托管通常“免費”且無需支付注冊商費用，但可能缺乏國際擴展所需的高 可用性和低延遲。  在一個地理區域托管的單一內容分發網絡（CDN）[僅提供英文版] 可能會導致其他區域 或市場的訪客無法訪問您的網站。  不靈活的結賬流程無法受益于緩存加載，因此一個簡單的頁面可能需要長達 20 秒的時 間來加載、執行以及呈現數百個 JavaScript 和 API 請求，從而導致結賬速度緩慢。

資產大小和格式問題

傳統觀點認為高分辨率圖片更好，在適當的背景下確實如此。網站或應用上存在的問題是在實際只需使用 較小圖片時使用大圖片。 格式也非常重要。格式錯誤的圖片（PNG 與 JPEG）可能會給網站帶來負擔。圖片應占頁面大小的 50-75%（僅提供英文版）。一般來說（僅提供英文版），照片應保存為 JPEG 格式，圖形（和屏幕截圖） 應保存為 PNG。

如何提升性能和轉化率

使用值得信賴的基礎設施來提高速度

在可隨您業務自動擴展且數據中心遍布全球的 CDN 上構建業務。確保您選擇的 CDN 在您計劃的未來目標市場中擁有服務器。

優化營銷資產

壓縮圖片（僅提供英文版）以縮短加載時間和提高網站速度得分，并考慮在圖片 HTML 標 簽上使用 srcset（僅提供英文版）屬性。這可以識別用戶的設備，并根據用戶的瀏覽器在 同一圖片的不同版本之間切換。確定來自高 DPI 設備或視網膜顯示器的流量的百分比， 以確定是否需要高分辨率圖片。如果您選擇使用 WebP 格式來縮小圖片，并順暢地回退到 相同大小的 JPEG，請注意，這也會降低圖片質量。您可以通過多種方法優化網站，從而為 高質量圖片和媒體文件創造空間，這被認為是電子商務網站的一個關鍵部分。