Setting up “Minify engine settings” for JS and “manual JS file management”

  • Resolved Martin

    (@martyshka)


    1 year, 4 months ago

    Hello,

    I am setting up the manual asset minification and cannot find a conclusive explanation for how these 2 groups of JS settings work together:

    “Minify engine settings”
    “manual JS file management”

    When JS files are added manually, three embed options are available for each entry: “in head”, “before body”, “after body”. That in itself seems self-explanatory.

    However, in “minify engine settings” the distinction is made between “BEFORE head”, “after body”, “before body”. How does those two settings group correspond to each other?

    As I understand, one would not add a JS-file like “*min.js” manually, since it is already minified. But how then can it be combined?

    What happens with JS files that are NOT ADDED manually? In which section are they loaded/included? Will they be combined if so selected in the “minify engine settings”?

    I have read https://www.boldgrid.com/support/w3-total-cache/how-to-use-manual-minify-for-css-and-js/ but the actual meanings and interrelations of these setting are not explained there.

    Lot’s of questions, but I think necessary ones for a proper setup.

    Thank you!
    Martin

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Contributor Marko Vasiljevic

    (@vmarko)

    Hello @martyshka

    Thank you for reaching out and I am happy to help!
    Manual minification means that you are manually adding the files which you choose to add and in the order you choose to do so.

    in “minify engine settings” is says before </head> (closing tag) which means that it sill be embeded in <head> before closing tag.

    If the files are not added to minify, they will not be minified or combined.
    The files like “*min.js” can be also minified and combined.

    If for example youwish to combine only the “*min.js” files, you should add them all to minify (embed in head or any other place you want those files combined) na once added, select combine only in Minify engine settings: for the specifed area (before</head>, after <body>, before </body>)

    I hope this helps!

    Thanks!

    Thread Starter Martin

    (@martyshka)

    Hello @vmarko,

    thank you very much, I really appreciate your help!

    I have gone through all assets and added those that did not cause problems on the site. Problems happened mostly with js that made frontend elements disappear or cause errors when added to minify.

    Now I wonder what is actually the right approach. I chose to use manually minify because of some problems the automatic minification caused. But now gtmetrix either reports chained requests of exactly those js that I excluded from minification, or reports them as blocking in the waterfall.

    For example on this product page https://www.pflanzkompass.at/artikel/allium-senescens/

    best regards

    Martin

    Plugin Contributor Marko Vasiljevic

    (@vmarko)

    Hello @martyshka

    Thank you for your feedback.
    Waterfall report does not mean that those files are render blocking. Some files are just not for minification. You can delay specific JS files in the W3 Total Cache by adding them to Performance>General Settings>User Experience (enable the option and go to advanced settings). The option is called “Delay scripts”.
    The Manual minify can be tricky as the files need to be added in order. And you should avoid deferring jQuery because of the dependent files which need to load after jQuery.

    You can always go with Auto Minify and exclude files from the minification in Performance>Minify>Advanced>Never Minify following JS files

    I hope this helps!

    Thanks!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Setting up “Minify engine settings” for JS and “manual JS file management”’ is closed to new replies.