🔌 Preconnect

What is Preconnect?

Every external resource on your store (a Google font, a third-party app script, an image CDN) needs a handshake before it can load. That handshake takes time.

Preconnect tells the browser to do those handshakes early, in the background. By the time the file is actually needed, the line is already open. It's especially helpful on mobile, where every millisecond of network setup matters.

Why use Preconnect?

• Faster external resources — fonts, CDNs, and app scripts start loading sooner because the connection is already open.
• Big mobile win — saves network setup time where it matters most, on slower mobile connections.
• Better Core Web Vitals — earlier resource loading improves perceived speed and LCP.
• Set and forget — turn it on once and apply; the connection hints are added automatically.

⚙️ How to use Preconnect

Step 1: Open Self-optimize

Go to Speed up → Self-optimize.

[Screenshot: Speed up page with Self-optimize tab open]

Step 2: Turn on Preconnect

Turn on Preconnect.

[Screenshot: Preconnect toggle switched on]

Step 3: Apply to your theme

Click Speed up now and pick a theme to apply changes.

[Screenshot: Speed up now button and theme selection modal]

Step 4: Verify it's working

To check it's working, view your store's page source — you should see <link rel="preconnect"> tags near the top.

[Screenshot: page source showing preconnect link tags]

📌 Merchant Notes

• Always click Speed up now after turning this on to apply the changes.
• Preconnect helps most when your store loads resources from external domains (fonts, CDNs, third-party apps).
• The benefit is most noticeable on mobile and slower connections.
• This feature requires the Pro or Expert plan.
• For an overview of all optimization features, see Speed up.

Contact us in live chat if you have any problems.