6

Checkout forms, gallery on product pages, and more elements loaded by javascript take up to 4 seconds to load.

What can be done to make javascript elements load faster?

Update:

I'm using a custom theme which inherits from Blank theme. I've not added additional JS files, only made minor changes to them for translation purposes. All caches are enabled. It is a live site in production mode.

Pages loading times:

Category and product pages: 5 to 6 seconds. Cart and checkout: 9 to 10 seconds. (is it normal?)

On product pages, product images are the last to load. This can be annoying for the user. Is it possible to make them load faster / before other elements on the page?

product page category page

Improve this question
5
  • 1
    You can optimize your website.
    – Dhiren Vasoya
    Dec 31, 2016 at 4:49
  • 1
    I'm having similar issues. Did you make any headway on this?
    – Robert Egginton
    Mar 24, 2017 at 11:01
  • I have been struggling with this just under a year now - page requests and page speeds are at 17 seconds sometimes for us.. were also struggling and your not alone.. RequireJS adds so many http requests. I wish Magento publish the names of the developers who built this poor system! There front end developers are insane!
    – TheBlackBenzKid
    Apr 14, 2017 at 18:46
  • @TheBlackBenzKid how is your server configured? Check response headers if they are gziped and allow cache? Maybe using a CDN would improve the loading times.
    – Zefiryn
    Apr 14, 2017 at 20:10
  • You can use full page Search plugin which supports redis ( FUll Page Cache is recommended).
    – inrsaurabh
    Apr 21, 2017 at 10:43

4 Answers 4

Reset to default
5
+75

Enable JS Merge/Bundling/Minify from the backend. There was some issue with bundling in previous M2 versions. Now it is fixed in v2.1.5 upward. This will create single file including all small js/html files which make it faster to load and decrease the network traffic. It is recommended to enable CSS minify/merge and minify html templates to gain more performance benefits.

Note: You will have to do static content deployment after doing these changes.

enter image description here

This is what I get after above config changes.

enter image description here

Improve this answer
1

It's totally normal when you run on your local machine or on server don't configured correct.

If you use a local machine try to use this container Docker.

If you use a remote server use the files .htaccess.sample or nginx.conf.sample

Update the memory limit to 2048M on remote server or the max that you can locally.

So run these commands:

alias mage="php -d memory_limit=-1 -f bin/magento"

chmod -R 775 pub/static/ var/ pub/media/ &&
rm -rf var/view_preprocessed/ var/cache/ var/page_cache/ var/tmp/ var/generation/ pub/static/frontend/ ;
mage cache:clean &
mage cache:flush &
mage indexer:reindex &
mage setup:upgrade &&
mage setup:static-content:deploy ; mage setup:static-content:deploy -f;
mage setup:db-data:upgrade &&
mage dev:source-theme:deploy &&
chmod -R 775 pub/static/ pub/media/ var/
Improve this answer
1
0

More information would be helpful, how large are the slowest scripts, is it just Javascript or is it CSS to? Are you adding JS via RequireJs or via XML? What caches do you have enabled? Is it on a local environment or a live site?

You could try minifying the JS via the admin, although be sure to test as this can cause errors. To do this login to the admin and navigate to `Stores > Config > Advanced > Developer > Javascript Settings and set Merge JavaScript Files and Minify JavaScript Files to true.

Improve this answer
1
  • I've updated my question with more information.
    – Luis Garcia
    Jan 3, 2017 at 18:56
0

Enabling your layout cache helps a lot with that, even when developing locally.

Improve this answer

Your Answer

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

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