Skip to content
Advanced javascript bundling in Magento 2
1. What Is Javascript Bundling ?
JavaScript bundling is an optimization Process,its impact on reducing the number of server requests for JavaScript files. Bundling this by merging multiple JavaScript files together into one file to reduce the number of page requests.
2. Javascript bundling in Magento
Bundling javascript modules for better performance is about reducing two things:
- The number of server requests.
- The size of those server requests.
3. Javascript Module Bundling
We have a module for bundling in magento Amasty_Extensions.
Amasty extension Test cases for bundling:
i) Backend > stores > Configuration > Advanced > Developer > Javascript settings
- Merge javascript file : No
- Enable js bundling: Yes
- Minify js files : No
- Move js code to bottom : Yes
ii)`Backend > store > Configuration > Amasty extension > Google page speed optimizer > settings > Javascript setting
- Amasty js optimization : Enable
- Is magento Cloud : No
- Run optimization option and follow all steps
- Click on save config button
iii)From CLI
- Set store mode as production
- Run full deployment
- Clear all cache and set all permissions
4.Enable JavaScript bundling
Javascript bundling does not work unless your magento store is in production mode, once in production mode,javascript bundling can only be enabled using the command lines.
1.Switch to Production mode
$bin/magento deploy:mode:set production
2.To enable Magento’s built-in bundling from the command line
$ php -f bin/magento config: set dev/js/enable_js_bundling 1
3.To Optimize bundling by minifying Javascript files:
$bin/magento config:set dev/js/minify_files 1
4.Enable Cache busting on static file URLs.this ensures users get the latest version of the assets anytime they update:
$bin/magento config:set dev/static/sign 1
5.To enable Magento’s built-in merging from the command line
$ php -f bin/magento config:set dev/js/merge_files 1
Output After bundle:
Conclusion
According to javascript bundling it gets a result to the minimum request of the server. The advanced JavaScript (JS) Bundling for the ecommerce websites of our clients and improve our practices.
Latest Posts
One Comment
Leave A Comment
You must be logged in to post a comment.
Well informed Blog!!