Tối Ưu Tốc Độ Shopify — Tăng PageSpeed Lên 90+

Mỗi giây trang tải chậm hơn, bạn mất khoảng 7% conversion rate. Không phải lý thuyết — đây là số liệu từ Google và nhiều nghiên cứu thương mại điện tử. Bài này đi thẳng vào nguyên nhân và giải pháp thực tế.

Tại sao tốc độ quan trọng hơn bạn nghĩ

Tốc độ còn ảnh hưởng đến SEO: từ năm 2021 Google chính thức dùng Core Web Vitals — bao gồm LCP (tốc độ tải nội dung chính) — như một ranking factor. Store chậm xếp hạng thấp hơn trên Google, dù nội dung tốt đến đâu.

Kiểm tra tốc độ store của bạn

Có ba công cụ nên dùng song song, vì mỗi cái đo khía cạnh khác nhau:

PageSpeed Insights (pagespeed.web.dev) — Công cụ của Google, cho điểm 0–100 và liệt kê từng vấn đề cụ thể. Nhớ test cả mobile (quan trọng hơn) lẫn desktop.

Shopify Speed Report — Vào Admin → Online Store → Themes → nhìn vào "Speed score". Shopify so sánh tốc độ store bạn với benchmark trung bình ngành.

GTmetrix (gtmetrix.com) — Cho waterfall chart chi tiết, giúp thấy chính xác file nào đang tải lâu nhất.

Nguyên nhân #1: App bloat — thủ phạm phổ biến nhất

Mỗi app Shopify bạn cài thêm JavaScript vào mọi trang của store — dù app đó có được dùng ở trang đó hay không. Cài 15 app = 15 script files tải song song mỗi lần khách vào trang. Đây là nguyên nhân phổ biến nhất khiến Shopify store bị chậm.

Cách audit app: Mở Chrome DevTools (F12) → tab Network → reload trang → filter theo "JS" → xem các file script nào không thuộc Shopify core. Hoặc dùng Shopify Theme Inspector (extension Chrome) để thấy app nào load chậm nhất.

Nguyên tắc đơn giản: xóa app nào bạn không dùng trong 30 ngày qua. Mỗi app xóa đi thường cải thiện 5–30ms — nhân lên nhiều app là đáng kể.

Nguyên nhân #2: Ảnh chưa tối ưu

Hai việc cần làm với ảnh:

Compress trước khi upload: Dùng Squoosh (squoosh.app) để nén ảnh tại browser, hoặc TinyPNG cho JPG/PNG. Mục tiêu: dưới 300KB cho ảnh sản phẩm chính, dưới 100KB cho thumbnail.

Đúng kích thước: Không upload ảnh 4000×4000px khi chỉ hiển thị 800×800px. Resize trước khi upload. Shopify tự tạo nhiều kích thước từ ảnh gốc của bạn — nhưng nếu ảnh gốc quá lớn, file gốc vẫn phải tải về trước.

💡 Shopify tự động convert ảnh sang WebP khi phục vụ cho browser hỗ trợ (Chrome, Firefox, Safari 14+). Nhưng bạn vẫn cần upload ảnh chất lượng tốt và đúng kích thước — WebP chỉ tối ưu thêm, không bù đắp được ảnh quá lớn.

Nguyên nhân #3: Render-blocking scripts

JavaScript "blocking" là script tải và chạy trước khi trang hiển thị được nội dung. Kết quả: người dùng nhìn thấy màn hình trắng trong khoảng thời gian đó.

Giải pháp là thêm thuộc tính defer hoặc async vào thẻ script — báo browser tải script song song với HTML thay vì tuần tự. Đây là chỉnh sửa cần developer, nhưng tác động rõ rệt.

Nguyên nhân #4: Theme cũ, không phải OS 2.0

Nếu theme của bạn được cài trước năm 2021, rất có thể nó dùng kiến trúc cũ — nặng hơn và tối ưu kém hơn OS 2.0. Kiểm tra đơn giản: vào Theme Editor và xem có thể kéo thả Sections không. Không kéo thả được = theme cũ.

Migrate sang theme OS 2.0 thường cải thiện tốc độ đáng kể, nhưng đây là dự án lớn cần lên kế hoạch kỹ — bạn sẽ phải rebuild một số tùy chỉnh.

Checklist tối ưu tốc độ