Skip to main content

Shopify 提高速度分數

本篇文章將針對 Shopify 速度優化 做一個小筆記整理 shopify

前提#

Shopify 基礎建設 (效能持續改善中)

  • OS 2.0
  • CDN
  • Local browser cache
  • Server-side page cache

無法控制的因素#

  • 客人的設備, 網路, 地理位置
  • 預設在 content_for_header 的 Liquid tag 內建功能 ( performance analytics + optional features EX: 客戶帳戶自動登出等... )
網站速度 = 功能 / 效能
=> 功能與效能成反比=> 評估 online store feature VS speed

移除 App 時，有關於此 App 的程式碼也應該要移除#

有些 App 的程式碼會用 {% comment %} 包著，以方便整理及清除該段落)

Shopify 官方說法：

Removing unused app code is a best practice that avoids running code for unused features, and makes your theme code easier to read.

容量過於龐大的圖片#

應先將圖片壓縮在上傳

字體#

If you use a font that does not yet exist on your customer's computer, then the font has to be downloaded before your text can be displayed.

Shopify 建議：

The font that displays on your customer's computer depends on their operating system. Below are some examples of the fonts that might be used to render text when you select a system font family:

  • Mono: Menlo, Consolas, Monaco, Liberation Mono, or Lucida Console
  • Sans-serif: BlinkMacSystemFont, Segoe UI, Roboto, Ubuntu, or Helvetica Neue
  • Serif: Iowan Old Style, Apple Garamond, Baskerville, Times New Roman, Droid Serif, Times, or Source Serif Pro

參考資料#

Shopify Store Speed