Does Brooklyn theme offer Javascript minification?

Technical Q&A

Topic summary

Discovery: Adding the query parameter enable_js_minification=1 to theme asset URLs on Shopify (e.g., theme.js) minifies JavaScript; initially observed on the Brooklyn demo and not documented.

Implementation notes:

  • Can be appended in Liquid to asset_url or script_tag.
  • Not compatible with the Theme Editor (Customizer) design mode; use a conditional (request.design_mode) to avoid applying it there.
  • A similar parameter exists for stylesheets: enable_css_minification=1.

Alternative perspective:

  • Some report Shopify auto-minifies valid CSS/JS; invalid code can block minification. No official documentation confirmed.

Latest update (early 2022):

  • JavaScript is minified by default when included with: {{ ‘file.js’ | asset_url | script_tag }}.
  • Exception: files using ES6 (e.g., let/const, arrow functions, default parameters) are not auto-minified. This behavior is undocumented.

Takeaways:

  • Minification appears to be a platform capability, not Brooklyn-specific.
  • The query parameter workaround may be unnecessary now, except in edge cases.
  • Lack of official docs and ES6 handling remain key open points. Status: largely resolved via default minification, with caveats for ES6 and design mode.
Summarized with AI on February 23. AI used: gpt-5.
1

Hi, has been looking at the Brooklyn theme demo shop and noticed that it loads theme javascript using this URL:

https://cdn.shopify.com/s/files/1/0260/0583/1702/t/3/assets/theme.js?enable_js_minification=1&v=1793745868414032183

and it is minified, while

https://cdn.shopify.com/s/files/1/0260/0583/1702/t/3/assets/theme.js?v=1793745868414032183

is not (as before).

Was it mentioned in any documents? Obviously, works for JS files in my test shop…

(Note – this particular file has minified libraries included at the top, so check at the bottom).

2 Likes
2

Oh wow, it does work.

Nice find.

However there’s no documentation on it, and there is nothing like a liquid filter to add to the theme code to generate that param.

3

It’s not a problem to DIY, like this. Just thought I missed the announcement…

{{ 'shop.js' | asset_url | append: "&enable_js_minification=1" | script_tag }}

Or this:

Copy

Or:

<script src="{{ 'theme.js' | asset_url  | append: '&enable_js_minification=1' }}"  defer=defer type="text/javascript"></script>

Copy

1 Like
4

This is useful, nice find!

Shame there isn’t a param like this for css.

5

Looks like it’s not compatible with Customizer, so need to use it like this:

{% liquid
 assign url = 'theme.js' | asset_url 
 unless  request.design_mode 
   assign url = url  | append: '&enable_js_minification=1' 
 endunless 
%}
4 Likes
6

You can also minify scss/css with ?enable_css_minification=1

1 Like
7

If you submit valid CSS and JS, Shopify minify’s automatically. The only time I find my files aren’t is when something is invalid or broken in them.> > Validate your CSS files here:> https://jigsaw.w3.org/css-validator/> > There are a number of JS validators online too. Nothing “official” thought that I’m aware of.

1 Like
8

Early 2022 update

All JavaScript files requested from the storefront are minified by default given that they are called using the following syntax:

{{- 'some-script.js' | asset_url | script_tag -}}

However, if your files contains any ES6 statements like:

  • “let” keyword
  • “const” keyword
  • arrow functions
  • default function parameters

then your JS file won’t be minified automatically. This is apparently not documented anywhere and I spent hours trying to figure out the catch here. Might be helpful for some in the future.

7 Likes