Magento2: JS Bundling issue on production mode

[nicework125]

Dear Magento Development team.

I am the author of Porto magento theme from Themeforest, you can check my profile and portfolio here.
http://portotheme.com
https://themeforest.net/user/p-themes/portfolio
You will be aware of JS bundling issue on production mode. We had over 20k+ customers for our Magento themes so far, but now we see lots of customers are leaving Magento because of this major issue.
Do you have any plan to improve this feature same as Magento 1? As a royal magento developer myself, I want to hear your honest schedule.

Regards, P-THEMES

[sashas777]

@nicework125
Can you kindly add steps to reproduce the issue, please? In case it was presented in other GitHub issue can you give issue # for it, please?

[nicework125]

Hi @sashas777

Porto demo sites have around 2MB of page size, but when I enable js bundling in production mode, it becomes 5M+. I believe this bundling js issue is known since a long time ago?

[DanielRuf]

2MB is too much in general. Bundling concatenates the files.

[nicework125]

Sorry for the delayed response. 2MB for entire page is not big for a magento store.

Btw, here's example issue what I get:
http://www.portotheme.com/magento2/porto/demo5_en

Above url is one of my Porto magento demo site. This page's js files' size is total 2MB but when I enable production mode, bundled js file size becomes over 3MB. Please check attached files to see production mode status.
20180210.zip

[nicework125]

Please take this issue as serious. If we can make Porto's magento 2 version fast enough as Magento 1 version, I believe we can let customers to choose Magento instead of other platforms.

[nicework125]

Any update please?

[DanielRuf]

@nicework125
Can you kindly add steps to reproduce the issue, please? In case it was presented in other GitHub issue can you give issue # for it, please?

Also it depends on how the code is written. Are requirejs modules used and extra files emitted?

You can always exclude files from the bundle or create another one.

Above url is one of my Porto magento demo site. This page's js files' size is total 2MB but when I enable production mode, bundled js file size becomes over 3MB. Please check attached files to see production mode status.

So you add yourself 3MB which results in 5MB+ bundlesize? There are also bundle settings for size and so on.

[DanielRuf]

Imho this is just a (best practice) coding, theme and general setting issue which is documented.

See https://devdocs.magento.com/guides/v2.2/frontend-dev-guide/themes/js-bundling.html#setting-bundle-file-size

[nicework125]

Hi

Can you please show me example that Magento 2's bundling feature works fine? I tried to enable production mode & js bundling on Luma theme, but the page size becomes 3.8MB from 2.4 MB(default).

Regards.

[DanielRuf]

the page size becomes 3.8MB

The page / document itself does not get bigger. It is not just one file.

What you mean is the download size of all assets in sum.

Most files are asynchronously loaded through requireJS and extra js files.

You have to check single emitted bundles (js files) and their sizes.

[DanielRuf]

In general it would be helpful to get a screenshot of the network tab or a webpagetest test link.

[magento-engcom-team]

@nicework125 We would also suggest to take a look at a different approach also describe in the devdocs: https://devdocs.magento.com/guides/v2.3/performance-best-practices/advanced-js-bundling.html

[magento-engcom-team]

@nicework125 we are closing this issue due to inactivity. If you'd like to update it, please reopen the issue.