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