Is Shopify smart enough to not duplicate JS/CSS files in sections?

When I include a JavaScript or CSS file in a section like this:

<link rel="stylesheet" href="{{ 'MY_CSS_FILE' | asset_url }}">
or
<script src="{{ 'MY_JS_FILE' | asset_url }}" defer></script>

When mutiple instances of the section are called, will the script/js tags be included and called again? Also if Shopify does include them again is the browser smart enough not to try download them again?

Have you tried it at all? Take a look at the network tab and check out what is does.

Hi Anthony, when sections are rendered, we do not de-duplicate any link or script blocks. However that said, because the underlying css or js asset is the same, the files will be cached by your browser clientside so it will not be downloaded multiple times. Each link or script block will refer to the same downloaded asset file.

3 Likes