Improve your online store performance with Liquid

Before you begin

This workshop teaches you how to action performance opportunities identified by Google PageSpeed Insights for your Online Store.

By looking at these opportunities through the lens of a Shopify Online Store, you can make a series of alterations to your theme code which will ultimately improve the shopping experience for your buyers, and encourage better conversion rates.

This isn't an exhaustive look into Online Store performance, but is rather a springboard to get you started on your storefront performance journey.

Learning objectives

After you've finished this tutorial, you'll learn how to do the following:

  • Identify and reduce excessive Liquid logic
  • Reduce Cumulative Layout Shift (CLS) by using image dimension attributes
  • Break down CSS + JS into sections-specific modulus
  • Leverage lazy-loading to remove render blocking content

What you'll need (Shopify Account Requirements)

What you'll need (Libraries and Tools)