data-em-async
HTML attribute. We call this Dynamic Fragments, a simple change developers can make to content to let Edgemesh Server know to cache most of the site, but intelligently fetch the dynamic content from the server without suffering a performance penalty!/
route such as:/welcome
and it would contain the following template:data-em-async
attribute where the value is the URL to the new page fragment we have just created. Edgemesh Server will then detect those tags and replace them with a client-side fetch and replace. When all is said and done the client-side HTML will be:data-em-async
attribute is completely replaced with the content from the page fragment we created earlier. No extra elements will be injected and the resulting dynamic content will not be cached by Edgemesh Server.{% layout none %}
so that your page does not include any layout code.{% section popout-cart %}
with <span data-em-async="/?view=popout-cart" />
data-em-async
but span or another inline element is probably best to prevent layout issues.Klaviyo
, Elevar
and Stamped.io/Smile.io
. The techniques found in this section will give you the tools necessary to integrate with any Shopify App implementing server side rendered, dynamic data.view-source:https://yoursite.com
. Next do a find on the page for the email you used to log in to your store. Anywhere you see your email in the HTML is most likely a liquid variable that has been server side rendered and will need to be extracted into a dynamic fragment. Any liquid variables that are rendered into the HTML will need to be moved to the dynamic fragment in order to be populated correctly.Klaviyo
.dynamic-fragment
. liquid
and name it dynamic
.theme.liquid
we can remove any code that was moved to the dynamic fragment snippet and render the dynamic fragment.