Author: Robin Hamill
Robin is an independent Shopify and Ecommerce consultant specializing in performant and accessible custom themes, and shop experience augmentation.
Published
You hear this again and again, but performance is critical to conversion in Ecommerce. Even modest wait times can lead to shoppers getting frustrated, and moving on to better things. With this in mind, you should be taking advantage of whatever tools are available to improve the overall performance and load times of your Shopify theme.
It may have passed under your radar, unless you keep up on the Shopify change-log, but {% include %}
tags have been deprecated in favour of a new {% render %}
tag. The new render
tag works a little differently, so it’s not a simple find-and-replace. The render
tag isolates variables used in the snippet, and no longer automatically has access to variables declared in the parent scope. This means that you need to explicitly pass in the variables your snippet needs access to.
This can be done in a couple different ways:
{% assign a_string_var = 'pizza' %}
{% render 'snippet', a_string_var: a_string_var %}
with
parameter {% assign feat_product = all_products['handle'] %}
{% render 'product' with feat_product as product %}
This more declarative syntax should have a positive side effect of making theme code easier to read, and understand what variables are being shared with what snippet.