有多個因素會影響您的在線商店速度,您可以控制其中一些因素。
如果您不知道自己的在線商店今天的運行速度有多快,您可以查看您的在線商店速度報告。
您無法控制的因素
客戶的設備、網絡和地點
訪問您商店的客戶遍布全球各地,并且其設備和 Internet 連接各不相同。這意味著商店的加載速度可能因這些因素而加快或減慢。
如果客戶因您商店的速度問題與您聯系,請讓您的客戶檢查他們是否使用的是最新版本的瀏覽器、最近是否清除了緩存,以及他們的互聯網服務提供商是否沒有遇到任何服務中斷或性能下降的問題。
Shopify 在快速全球服務器上托管在線商店,并且不限制商店的帶寬。您可以在 Shopify 狀態中查看 Shopify 商店的狀態。
Shopify 不斷改進其代碼和基礎結構。其中一些改進可能會反映在您的速度評分中。
以下是一些會影響在線商店速度的功能。
CDN 代表內容分發網絡。Shopify 通過 Cloudflare 為商家提供世界一流的 CDN 運行,確保您的在線商店在全球范圍內都可快速加載。您可以在 Cloudflare 狀態頁面上查看 CDN 狀態。
您的商店會在客戶的本地存儲中暫時緩存或保存一些元素。當客戶下次訪問您的在線商店時,瀏覽器可以從緩存中加載資源,而不必向服務器發送其他請求。
Shopify 將商店中可緩存資源的瀏覽器緩存設置為每個文件一年。可緩存的文件包括圖片文件、PDF、JS 文件和 CSS 文件。
除了本地瀏覽器緩存外,Shopify 還在服務器端緩存頁面。第一次加載頁面時,可能速度較慢,但以后頁面加載速度會加快,因為客戶將接收緩存的副本。
content_for_header Liquid 對象中的資產`` Liquid 對象可注入多種在線商店功能所使用的資產,包括性能分析功能和動態結賬按鈕等可選功能。加載此對象和相關資產會影響商店的速度。Shopify 正在優化該標簽及其資產,以便加快速度。
下面列出了一些可能影響在線商店速度的因素,以及您可以如何處理這些因素。
拓展您的業務如果您不熟悉以下任何步驟,則可以聘請 Shopify 專家來幫助您。詳細了解如何聘請 Shopify 專家。
當您添加應用以更改在線商店的功能或外觀時,這些應用會在模板中添加代碼,這樣它們才能運行。可以刪除某些代碼或將其重新排序,以提高在線商店的性能。您可以刪除沒有使用的應用。
如果您認為某個應用正在減慢您商店的速度,請執行以下步驟:
禁用您不使用的應用功能,或刪除不需要的應用。考慮在線商店功能與速度之間的平衡。 如果您要刪除某應用,請考慮刪除在該應用安裝過程中添加的代碼。某些應用通過將代碼包裝在提及應用名稱的 {% comment %} 標簽中來幫助您完成此過程。刪除未使用的應用代碼是一種最佳做法,可避免運行未使用的功能的代碼,并使您的模板代碼更易于閱讀。
請咨詢您的應用開發者。 聘請 Shopify 專家以獲得更多幫助。
模板
模板由 Liquid、HTML、CSS 和 JavaScript 代碼組成。編輯或自定義模板時,文件大小可能會增大,并影響商店速度。
如果您認為模板中的某些內容正在減慢商店的速度,請執行以下步驟:
禁用您不使用的模板功能。考慮在線商店功能與速度之間的平衡。 考慮使用系統字體。 咨詢模板開發者。如果您使用的是 Shopify 提供的免費模板,那么您可以聯系 Shopify 支持團隊以獲取指導。 如果您使用第三方模板并需要幫助,則可以聯系模板開發者或聘請 Shopify 專家。 考慮安裝已優化性能的模板,例如 Dawn。 聘請 Shopify 專家以獲得更多幫助。詳細了解如何聘請 Shopify 專家。
模板或應用功能
某些功能(啟用后)也可能也會影響商店速度。例如,當產品系列頁面加載時,某些快速視圖彈出窗口會預加載每個產品頁面中的信息。加載客戶不使用的額外數據可能會影響商店速度而不會增加價值。
如果您認為某項功能正在減慢您商店的速度,可以執行以下步驟:
使用熱圖工具查看客戶是否在使用某些功能。禁用未使用的功能。 禁用您不需要的功能。考慮在線商店功能與速度之間的平衡。 咨詢模板和應用開發者,詢問模板和應用是否預加載數據。 聘請 Shopify 專家以獲得更多幫助。
復雜或效率低下的 Liquid 代碼
您可以編輯用于呈現商店的幾乎所有 Liquid。編寫 Liquid 代碼的方法可能非常高效,也可能效率低下。重復執行復雜操作可能會增加 Liquid 呈現時間,從而影響整體商店速度。
例如,如果您想按價格對產品系列中的產品排序,則應在將產品逐一添加至產品系列前完成此操作,而不應將其作為循環代碼的一部分。這是因為全部產品的排序不會因單獨添加的產品而更改,而計算產品順序會增加請求處理時間。
如果您擔心您的代碼未經過優化,則可執行以下步驟:
運行適用于 Chrome 的 Shopify 模板檢查器,識別減慢在線商店頁面速度的代碼行。 聘請 Shopify 專家來幫助您找到效率低下或無用的代碼。
注意
適用于 Chrome 的 Shopify 模板檢查器適用于熟悉查閱和編輯代碼的商家和合作伙伴。如果您不熟悉如何查閱或編輯代碼,則可以聘請 Shopify 專家來指導您。Shopify 專家還可以幫助您使用此工具的結果來提高商店性能。
過大的圖片和視圖中隱藏的圖片可能會對加載頁面中其他更重要的部分造成干擾。如果用戶必須等待加載大型圖片,他們可能會認為您的商店速度緩慢。
Shopify 添加了一些安全措施,用于防止您的在線商店出現圖片或視頻過載。例如:
產品系列頁面上的產品不可超過 50 件,或主頁上的分區不可超過 25個。 許多模板會延遲加載屏幕上當前未顯示的圖片。 許多模板還根據所用屏幕尺寸加載特定大小的圖片。但是,這些安全措施無法完全阻止圖片或視頻對在線商店的性能造成影響。
如果您認為圖片正在減慢您商店的速度,請執行以下步驟:
查看圖片優化指南。 將配圖幻燈片保持為 2-3 張幻燈片,或使用一張配圖。 請咨詢您的模板開發者,獲取有關在其模板中使用圖片的最佳方式的建議。 聘請 Shopify 專家以獲得更多幫助。
字體
對于在線商店中的文本,您可以從多種字體中進行選擇。但是,如果您使用的是客戶的計算機上尚未存在的字體,則必須先下載該字體,然后才能顯示文本。這會影響加載您的商店所需的時間。
為了避免在客戶的計算機上下載新字體,您可以使用系統字體。系統字體是一種在大多數計算機上已安裝的字體。
您可以選擇等寬、襯線或無襯線字體系列。當您使用這些字體系列中的任何一種時,您仍可以使用字體樣式,例如粗體或斜體。
客戶的計算機上顯示的字體取決于其操作系統。以下是選擇系統字體系列時可能用于呈現文本的一些字體示例:
等寬:Menlo、Consolas、Monaco、Liberation Mono 或 Lucida Console 無襯線:BlinkMacSystemFont、Segoe UI、Roboto、Ubuntu 或 Helvetica Neue 襯線:Iowan Old Style、Apple Garamond、Baskerville、Times New Roman、Droid Serif、Times 或 Source Serif Pro
故障排除工具
您可以使用以下工具來調查在線商店的速度。
如果您是開發人員,您可以使用 Shopify 工具和最佳做法來進一步優化您的模板的性能。
Shopify 的在線商店速度報告使用 Lighthouse 來測量商店的速度。您可以使用 Google PageSpeed Insights 運行自己的 Lighthouse 報告,以查看更詳細的商店頁面指標。若要了解這些指標的含義,請參閱 Google Lighthouse 性能評分文檔。您還可以聘請 Shopify 專家來幫助您了解這些指標和提出改進建議。
由于使用 Google PageSpeed Insights 運行報告時的測試條件不同,因此您得到的評分可能與在線商店速度報告中列出的評分不同。
適用于 Chrome 的 Shopify 模板檢查器是一個使用火焰圖來顯示 Liquid 渲染性能的分析工具。此工具可幫助您識別哪些代碼行減慢了在線商店頁面的速度。了解如何使用 Shopify 模板檢查器。
此擴展適用于熟悉查閱和編輯代碼的商家和合作伙伴。如果您不熟悉如何查閱或編輯代碼,則可以聘請 Shopify 專家來指導您。Shopify 專家還可以幫助您使用此工具的結果來提高商店性能。
如果您使用 Shopify 提供的免費模板,Shopify 支持團隊也許能夠幫助您進行基本的性能改進。
如果您使用第三方模板并需要幫助,則必須聯系模板開發者或聘請 Shopify 專家。
如果您有開發團隊或代理合作伙伴,您還可以聯系他們獲取更多幫助。