Shopify Plus是一款廣受歡迎的SaaS電子商務平臺，吸引了一些全球最大的品牌，如Tesla，Victoria Beckham Beauty，Staples，Oreo/Mondelez和Red Bull。 這份清單不止一遍，廣泛採用也不足為奇–Shopify Plus使用簡單，可輕鬆自訂。 它提供了大量的插件和API，並有一個響應迅速的支援團隊作為後盾。 電子商務平臺還能帶來什麼？ 無論是Shopify商店還是其他商店，答案都是一樣的：次秒頁面載入和SEO打敗您的競爭對手。
即使是最簡潔，最美麗的Shopify Plus網站，也無法抗拒大型零售商的激烈競爭，除非營運商加倍努力優化網站，使其達到亞秒級速度。
讓您的Shopify Plus商店盡可能快，這是讓您的商店在SERPS中排名更高，並借助卓越，無縫的購物體驗提高轉化率的最簡單方法之一。
Shopify讓您提供產品，而非體驗
許多電子商務平臺(如Shopify Plus，Magento或Salesforce Commerce Cloud)都採用後端和數據優先的方法構建，很少關注實際客戶體驗。 他們的重點是SKU，而不是人員。 這就加重了網站對平臺客戶，系統集成商，設計人員和開發人員的優化速度。
無論您的商店是在Shopify Plus還是任何其他流行的電子商務平臺或後端系統上執行，如果您想要提供最快的體驗，您都需要實施以速度為中心的高級Web技術。 爲此，你必須先無頭。
無外設電子商務的優勢
無外設電子商務體系結構是指站點的前端設計(即表示層)與後端基礎架構分離的架構。 這有點像使用WordPress管理移動應用程式的內容(對於其價值而言，這是通過WordPress的REST API實現的)。
傳統的單片電子商務架構
“無頭經營”已被確定為2020年及以後許多零售商的首要計劃之一。 它使零售商能夠為其前端選擇與後端無關的最佳解決方案，從而使商店能夠更快地執行，推動轉化率和排名提昇。 無外設電子商務，也稱為微服務架構，幾乎是一種能夠在競爭中占據優勢的安全故障方法。
API層允許將站點的前端與後端分離
更具體地說，無外設電子商務提供了幾個好處：
1.速度更快
實現無頭是實施許多以速度為中心的技術的先決條件。 這可以通過將顯示邏輯轉換到客戶端並簡化後端以獲得最佳性能來實現。 通過僅關注內容的快速交付，前端可以比將辛苦工作留給瀏攬器的前端更快，響應更快。
2選擇自由
許多電子商務平臺都為用戶提供專有前端。 Shopify Plus也不例外，它根據Shopify的Liquid模板語言提供一系列響應式主題。 通過採用無頭技術，您可以完全擺脫供應商束縛的束縛，超越平臺的前端工具。 這將帶來更高的靈活性，並使您可以獨立於電子商務平臺的路線圖開發前端。
3後端獨立性
對無外設網站的投資使商店能夠適應未來。 您擁有前端程式碼，並能自信地開發與投資。 這使您可以隨時隨地將其移動到另一個更便宜或更好的電子商務平臺。 在這種情況下，即使您的商店與第三方工具進行了數十種集成，也不需要為新的電子商務平臺重新編寫它們，您只需將舊平臺的API替換為新平臺的API。
4更好的SEO
無外設站點不僅速度更快，而且還具有更好的SEO。 通過無外設網站，您可以選擇如何處理URL，元數據，robots.txt文件以及技術SEO的其他方面。 Shopify Plus不支援此開箱即用功能。
5。支援未來使用案例和端點
有了無頭前端，例如漸進式Web應用程式(PWA)/單頁應用程式(SPA)，營運商可以滿足未來需求，自由添加新端點，並開發其他功能。 您只需連接到API即可。 您幾乎可以添加任何設備或平臺作為端點，並通過無頭方式為您的商店結帳。
速度最快的Shopify Plus商店背後的祕訣
無頭是實施多種高級Web技術和優化技術的基礎，這些技術有助於開發更快，響應更快的店鋪。 結合使用，它們可以幫助優化任何Shopify Plus網站，以實現最大速度，SEO和收入。
便攜式PWA前端
通過無外設並將Shopify Plus與PWA便攜式前端相結合，您可以在移動設備上獲得網站上快如閃電的瀏攬速度。 通過PWA，您的客戶將享受到增強的即時頁面轉換體驗。 與PWA瀏攬過渡一樣快，它們的第一次載入時間往往比傳統的多頁網站要長。 為了應對這一問題並提供從著陸到結帳的超快體驗，請考慮為您的PWA添加伺服器端渲染和AMP支援。
伺服器端渲染(SSR)
伺服器端渲染是快速PWA附帶的一項重要Web技術。 如果沒有伺服器端呈現，瀏攬器必須下載，解析和執行所有JavaScript代碼，然後才能在顯示器上呈現任何內容。 沒有SSR的PWA在模擬3G上努力實現2.5秒以下的首次有意義塗料(TTFMP)。 結合具有邊緣計算功能的現代CDN，使用SSR的站點可以實現幾乎即時的TTFMP時間。
SSR可確保電子郵件，社交媒體和推薦的訪客快速體驗第一次載入。 借助SSR支援，PWA提供了更出色的首頁載入速度快如閃電的體驗，以及超越首頁的即時頁面轉換。
伺服器端渲染還可帶來更好的SEO。 電子商務業務依賴於SEO，100％確定您的網站將被搜尋和社交爬蟲程序和爬蟲程序理解的唯一方法是將其轉換為HTML。
如果您為Shopify Plus構建了大量JavaScript的電子商務PWA前端，這一點尤為重要。 您必須在伺服器上呈現頁面，因為爬網程序和爬蟲程序不能可靠地索引JavaScript內容。
Shopify Plus不附帶內置SSR支援。
加速移動網頁(AMP)
Google AMP是一種開源框架，通過簡化HTML並強制實施對CSS和JavaScript的嚴格限制，創建超快移動網頁。 平均AMP頁面在500毫秒內從搜尋中載入。 這些頁面在Google伺服器上暫存和預呈現，這就是它們快速交付的方式。
Shopify Plus不提供AMP或真正的SSR開箱即用支援，這嚴重妨礙了您在移動設備上優化首頁載入的能力。 您需要自行將這些功能添加到您的網站。 對於AMP和SSR，您需要前端的後端。 更多關於這一點的資訊如下所示。
前端的後端(BFF)
BFF在使用無外設電子商務和基於微服務的架構API方面發揮著核心作用。 它是應用程序堆棧中的一個獨立層，允許單個客戶端(例如PWA或本機Android或iOS移動應用程序)更有效地使用共享API，而無需爲每個客戶端優化它們。 它‘地“截取”API調用並轉換傳遞的參數，使特定端點能夠理解這些參數。
BFF是執行前端伺服器端渲染和AMP轉換的理想場所。 BFF還為Shopify商店帶來許多其他好處：
BFF和速度
您的前端可能需要協調對多個服務的調用和/或重新格式化響應數據，以最適合頁面設計，並且此代碼需要在某個位置執行。 BFF可讓您將此程式碼放在前端套件之外，使其小巧快速。 在大多數情況下，響應是可暫存的，因此，它不是在每個用戶的設備上針對每個請求執行此Shim代碼，而是在雲上執行，雲可以進行擴展以滿足需求，並且只有在暫存丟失時才執行。
對於移動客戶端來說，太多HTTP請求在時間上很昂貴，每次調用都會增加不必要的毫秒。 爲了儘量減少請求的數量，前端通常傾向於通過單個API獲取關聯的數據。 這意味著，有時後端將負責UI相關邏輯處理，以滿足每個客戶端的需求。 這是一種效率低下的方法。
實施前端後端後端後端(移動，Web)僅通過BFF訪問後端微服務，每個客戶端獲得單獨的BFF服務。 使用BFF，微服務之間的相互呼叫就會減少。 這是因為某些UI邏輯是在BFF級別處理的。
BFF和開發速度
BFF通過讓不同的開發團隊獨立工作來提高開發人員的速度。 它允許開發人員添加新功能，而無需更改核心API。 如果API由Shopify Plus提供且無法更改，則此功能特別有用。
最大限度地減少供應商束縛
如果您需要將Shopify轉換為另一個電子商務平臺，前端的後端可減少工作量和成本。 這在無外設體系結構的靈活性方面提供了巨大的優勢。
基於BFF的前端和後端去耦
利用邊緣計算進行預測預取和CDN
預測預取是一種高級功能，用於預暫存和呈現訪客點擊之前最可能訪問的頁面。 具有邊緣計算功能的現代CDN使您可以將動態數據流傳輸到邊緣，然後再傳輸到用戶的瀏攬器，然後再發送到用戶的瀏攬器中。 這些技術結合在一起，讓您的Shopify Plus商店無論在哪裡點擊，都能領先購物者5秒。
通過預取動態數據並將動態數據流傳輸到邊緣，您可以暫存並立即為瀏攬Shopify商店的消費者等待的內容提供服務，即JSON數據可轉換為您庫存中的不同產品，價格和資訊。 但要做到這一點，您需要一個了解您的應用程式的復雜CDN。
Layer0 CDN-AS-JavaScript將高速暫存命中率優化到前所未有的水平，並將智能帶入邊緣。 這有助於企業所有者通過對類似頁面(例如PDP，PLP和Cart)進行分類，而不僅僅是顯示無數的URL列表，從而識別趨勢和優化機會。 這使您可以採取行動並查看網站載入時間的差異。
Layer0 CDN-AS-JavaScript在邊緣動態內容的快取命中率超過95 %，而一般電子商務網站的平均快取命中率為15 %。 這種差異，加上預測性預取，使大型電子商務網站在購物者的前5秒，無論他們點擊什麼位置。
使用Shopify Plus實現無頭不動的難度有多高？
選擇電子商務平臺來執行您的商店，應考慮平臺對無外設網站的支援以及支援亞秒級網站的技術。 許多電子商務平臺都是開箱即用的單片平臺(即，它們將前端與後端結合在一起)。
雖然Shopify Plus並未明確支援無外設架構，但它允許零售商經營無外設店鋪，並使用不同的前端架構(如React Storefront)或Contentful等無外設CMS，許多無外設Shopify內部版本都使用該架構。
Shopify Plus提供了可靠的專有店面API集合，通過允許訪問平臺的內容和組件，實現無外設的可能性。
請注意，Shopify Plus不正式支援無顯示網站，也不提供許多以速度為中心的功能和開箱即用技術。 這並不奇怪–該平臺旨在管理您的庫存，定價和數據，而實施這些技術通常需要大量的努力。 但是，除了一些注意事項，Shopify Plus仍然是一個很好的選擇，因為它使零售商相對容易無頭，並實施以速度為中心的關鍵策略。
Shopify Plus專業級
- 用於提供產品資訊的優質API借助Storefront API，Shopify Plus為產品和訂單處理提供了合適的參考，並且API已有詳細的文檔記錄。
- GraphQL API格式Storefront API提供現代，面向未來的GraphQL格式。
Shopify Plus缺點
- 無開箱即用的PWA框架Shopify Plus本機不支援PWA。 但是，有些商家確實在平臺上運行PWA。 為了實現這一點，商店可能需要前端後端(BFF)，這允許您在店面API和PWA前端之間執行微服務。 這是一種優化API並避免為每個客戶端創建單獨API的方法(並將客戶端邏輯量降至最低)。
- 沒有AMP開箱即用Shopify Plus不提供任何專有的Accelerated Mobile Pages (AMP)解決方案(儘管通過Shopify App Marketplace的付費應用程式可以實施AMP)。
- API覆蓋範圍，而Shopify在產品方面擁有相當好的API，而許多其他事物的API覆蓋範圍並不完全。 例如，Shopify Plus控制面板允許商家在網站導航菜單中設定項目，但沒有API可用於獲取這些菜單項。 無外設Shopify Plus實施不會提供一種簡潔的方法來訪問它們，而無需進行一些手臂摔跤和變通辦法。
- 限制Shopify Plus可限制單個用戶可以發出的請求數。 Shopify Plus具有用於API調用的特殊標頭，因此BFF層不計爲單個用戶。 但是，由於上述API覆蓋範圍問題，請求可能並不總是實際的API調用，BFF層仍將其計數爲來自單個用戶。 即使該層為許多用戶代理流量，也會發生這種情況。
Edgio (Layer0)如何簡化流程
我們知道，閱讀所有這些PWA，SSR，AMP和BFF三字母技術縮寫詞會讓您頭腦發抖，更不用說自己實施這些技術可能會有點麻煩。 Edgio (Layer0)以一種性能出色，可擴展的方式為您處理所有這些問題，幾乎不需要DevOps或維護。
在Edgio (Layer0)，我們致力於幫助客戶贏得知名度，觸及率，收入和客戶滿意度，這是唯一能夠保證數據庫驅動的電子商務網站頁面載入的平臺。
我們幫助復雜，動態的電子商務網站實現亞秒級速度，同時提高開發速度和利潤增長，並降低DevOps成本。
除非我們的客戶成功，否則我們不會成功。 我們的產品組合中有即時Shopify店鋪，這些店鋪使我們的信心躍升，以確保他們在競爭激烈的電子商務環境中的地位。
Planet Blue如何在Moovweb XDN上成功啟動了即時Shopify Plus商店
Planet Blue在Layer0 (Edgio)上從16秒的瀏攬過渡到500毫秒
Planet Blue已從一家店的精緻有機服裝供應商發展為國際設計師和全通路服裝零售商。 他們在n ü ç 上的即時Shopify商店讓他們能夠提供卓越的購物體驗。
在tayer0上啓動之前，Planet Blue的移動頁面加載時間爲10秒。 零售商超過70％的移動流量嚴重影響了他們的轉換率。 Planet Blue了解到，需要全面改進其移動體驗，以滿足客戶需求並保持競爭力。 在Layer0上推出後，導航時間縮短了4%(臺式機為95秒→0.5秒，移動設備為10秒→0.5秒)，給人的印象是，用戶瀏攬網站時不會產生摩擦。
Planet Blue對Layer0的結果：
- Layer0上的即時站點使轉換率提高31％
- 97秒→0.5秒的過渡，臺式機的速度降低了50%
- 95秒→0.5秒的轉換，移動設備的速度降低了50%
- 跨設備的首頁載入平均減少60％以上
- 客戶滿意度評級提高20％以上，頁面一瞬間即可載入
- 使用React Storefront構建的超快電子商務PWA
- 伺服器端渲染和AMP支援
- 預測性預取
- CDN-AS-JavaScript可優化邊緣動態內容的高速暫存命中率，以便商店可以提前5秒預測購物者的點擊次數。
摘要
向無外設商業架構過渡是許多零售商的首要計劃—梅西百貨，沃爾瑪，Target，Nike，Airbnb等已經實現了這一轉變。 這一趨勢之所以越來越引人注目，主要有三個原因：它使您免受電子商務平臺前端工具的限制，允許實施一流的Web技術，從而提高網站速度和SEO，並允許輕鬆實施未來的使用案例。
除了上面討論的一些注意事項，Shopify Plus很好地構建了無頭商店，並實施了以速度為中心的關鍵技術。 您能承受落後的負擔嗎？
