Proposal: Avoid layout pollution by utilising snippets

davidwarrington commented 3 years ago

Third party scripts are often required to be present globally inside your layout file(s). Since these files form the base of your templates it's also important that they're kept clean and readable.

In the case of third party scripts they're often minified and unreadable, so polluting the main layout file does not benefit developers, as such one should use place these in snippets where possible.

Another reason to do this is because Liquid is often required to set JS variables. Using Liquid inside JS can easily break syntax highlighting for the rest of the file. Moving this to a separate snippet ensures syntax highlighting doesn't break in the layout file.

Example

<head>
    {% render 'meta.tags' %}

    {% render 'seo.data' %}

    {% render 'base.script-tags' %}
    {% render 'base.style-tags' %}

    {% render 'base.theme-config' %}

    {% render 'app-script-1' %}
    {% render 'app-script-2' %}
</head>

dan-gamble commented 3 years ago

Minor suggestion on this. Rename it to "Avoid layout pollution by utilising snippets". I initially thought you were recommending avoiding snippets and having a larger theme.liquid

davidwarrington commented 3 years ago

@dan-gamble good shout

davidwarrington / liquid-community-standards

Proposal: Avoid layout pollution by utilising snippets #7

Example