8

I'm currently working on Magento 2 and I noticed that loading times for all the pages are extremely high.

I'm running on Xampp at the moment, production mode enabled, HTML/js/CSS are merged and minified, Varnish is disabled and I will not use it since my web hosting can't install it on my server because it will interfere with some scripts. I use a custom theme which parent is the blank theme of Magento 2. After changing my settings I redeployed static files and emptied the cache.

My main concern is that when I look at the network panel I see that a huge amount of js files is loaded every time. For example on my category page, 122 js files are loaded which I found is quite a lot, for a total size of 955 ko.

I tested it on my server without the merging and minifying but as I said above, I think the issue lies with the amount of file loaded because even if it loads faster it's still too long and on the checkout process it's even worse.

I tried the bundling option but it generates an 8MB js file which is worse.

Did I miss something or is it somewhat normal that the amount of js files is this much? Is Varnish mandatory for good performance and is there an alternative to it?

I'm fairly new to Magento 2 so if you need more info I will be happy to provide it.

Improve this question
1
  • This is common with Magento 2, to have 120 or even over 150 scripts loaded. You can always merge and minify them into one file. But just check to make sure your using HTTP1 or HTTP2 on your server. If your have HTTP2 enabled then having 120 or even 150 js scripts loaded asynchronously will not be an issue due to how HTTP2 works. HTTP2 does better with several smaller files loaded at once, than having to load one large combined minified js file. But i feel your pain, Magento 2 is a big headache to work with compared to Magento 1. But I feel Magento 2 is still slow!
    – Jonathan Marzullo
    Oct 23, 2017 at 17:44

4 Answers 4

Reset to default
3

The amount of JS is huge, but if it sums up to 8MB there's something wrong. You should use the "Bundling" configuration in production mode if you don't want >100 files loaded.

With the default Luma theme, bundling, merge and minify enabled, the bundled JS file is 1.9MB.

Varnish is another topic and won't help with performance of generated static files.

Improve this answer
4
  • That what I did and it genrates an 8mo js file. Is there a specific configuration to do regarding bundling beside activating it on te admin? I flushed and cleaned the cache afterwards.
    – Tonani
    Mar 4, 2016 at 8:25
  • You have to activate production mode, redeploy static files and flush the cache but I guess you already did that
    – Fabian Schmengler
    Mar 4, 2016 at 8:28
  • Yes i did. Maybe there is something wrong with the blank theme.
    – Tonani
    Mar 4, 2016 at 8:43
  • I was having similar issues however feel like bundling had an issue at some point and its now fixed. I used this seoptimer.com however and this still shows my site to have huge JS of around 5MB when DevTools shows 1.5MB within the network tab for the JS on product page. Is this site just wrong?
    – harri
    Aug 22, 2018 at 13:30
1

I'm also fairly new to Magento 2, but so far with both magento 1 and 2, we have had to enable caching to get anything to have any sort of speed. The amount of js is huge, so caching is your best friend. You can enable caching by running php bin/magento cache:enable. If you have caching on, you'll have to flush it after making changes using php bin/magento cache:flush. Magento 2's built in caching is available, even without Vanish.

Improve this answer
1

It's really surprising that this issue is actual for Magento 2 in 2020. Bundling doesn't bundle 90% of files (as described here)

Js merge, on the other hand, merges everything into a super-heavy-mega-pack.

However, despite it couldn't be solved with default Magento, here is a paid extension that improves the abovementioned behavior a lot: Google page speed optimization

Improve this answer
1
0

You can solve most of the bloated JS requests by implimenting the Magepack javascript bundle. It reduced our JS requests from over 150 to around 10.

https://blog.gaiterjones.com/magento-2-javascript-bundling-with-magepack/

Follow the instructions carefully. Everything you need is in there.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.