If I make a change to Javascript, do I have to re-minify the file?

[Kieron]

Hi All,

Pretty much as the title suggests, I've made a small adjustment to some JS code (from my limited knowledge). It works on my store, but should I be minifying that file again? What's the pros / cons? Is it worth the effort?

Appreciate any advice!

- Kieron

[David_Weru]

Hello Kieron,

  Minifying is really meant for big javascript files like jquery.  Even the empty space in a file takes space, so removing all that space makes the file smaller which loads faster.  

-> unminified example https://code.jquery.com/jquery-3.6.0.js

->minified example https://code.jquery.com/jquery-3.6.0.min.js

if the file is small, minifying doesn't really change anything as far as load times.  It does make it harder to develop since spacing and indentation is removed.

If the file is many thousands of lines -like a library- then definitely.  Usually the development files are kept unminified and minified when placed online to run.

Most code for stores is short so no, you do not have to minify.

[Kieron]

Hi,

Thanks for your response. You're right, the theme comes with both unminified and minified asset files. The Warehouse theme has 18,000 lines of code on the JS file, so I imagine I should minify it in that case.

But how does it work, seen as I have both a minified and unminified asset file already? I've edited the unminified file (because it's easier to) Does one overwrite the other?

Thanks for your help.

- Kieron

[David_Weru · Accepted solution]

The two files (minified and uniminfied) have different names.  The javascript source file referred to in the store is the one in use.

There are tools to minify code either online or in code editors.  I'd suggest you use one locally.

-> here's one online https://javascript-minifier.com/

->here's one for vscode https://marketplace.visualstudio.com/items?itemName=olback.es6-css-minify

1:make your edits

2:minify the file

3:override the minified file in use (save a backup also)

Also,

Just copy the working theme and keep it for backup.