[ Context ]
I’m currently working on a site that is very script heavy, loading over 45 scripts. My job is to widdle it down and boost performance. I’ve been given free reign and felt this would be good bedrock/sage project, implementing webpack and sass to minify scripts.
[ Question ]
I was wondering, is it possible/good practice to dequeue wordpress’s jquery and include it into the main.js bundle?
Looking around, I haven’t seen it done. Ideally I would like to include most of the sites scripts/css into bundle files, so jquery, jquery-migrate, jquery-ui, add-to-cart.js, js-cookie, etc would all be in dist/main.js and all/most of the site css/woo css into the dist/main.css.
I don’t really see a reason not too, but it also hasn’t been done before, which leads me to question whether it’s actually a good idea.
It used to be, but I would recommend against it these days
45 scripts is still a ton. Most Sage projects don’t ever come close to that number due to how to the build is setup unless you’re using an insane amount of plugins.
I didn’t build the site initially, but it was indeed built very plugin heavy.
We haven’t adopted HTTP2 yet, which is why I am resorting to traditional methods. Do you have any suggestions on how I would go about hooking into it? I think I’ve seen people use webpack.config and defining a vendors property that can point to plugin scripts. I was thinking using that to point to the wordpress jquery and woocommerce scripts.
Considering the limitations of my circumstances, is that an ideal approach? Or is there another Sage way of doing that?
