How to optimize magento2 onepage checkout speed.

[abhisekhranjan]

Hi All,

Any one can help me to optimize  speed up onestepcheckout of magento2 form 20 sec to 2-3 sec. SS attached.Onestepcheckout Page Speed

 My dev environment url http://35.154.238.235/~abhishek/ 

[Manthan Dave]

Hi @abhisekhranjan

I have seen the website link you have shared across and coming to the direct point,  here you required to do performance Optimization of whole site and to do this there are multiple steps involved. - Below i am highlighting few points.

• Make sure your magento application in Production mode you can set application in production mode by running this command - php bin/magento deploy:mode:set production
• Make sure your CSS and JS files are minified and merged
• Make sure on your server you have configured Varnish and Redis caching mechanism
• Make sure your all the image files are resized and compressed
• Make sure you have installed CDN on your server and all the assets are loading from there.
• Make sure you have not used un-necessary loops in your code instead of you need to use collection.
• Make sure you have not used object manager in your code instead of you need to use factory classes. 

Note : This is just suggestion based on our experiment there might be few other points which is involved in this process - but this will surely reduce your timing from 20Sec to at least 5 to 8 sec

Hope it helps

[abhisekhranjan]

Hi @Manthan Dave
As you have suggested we already using on our production website but still
checkout speed around 20-30 sec. Please look @ https://www.vajor.com
Please give me the better solution.
Thanks in advance.

[gelanivishal]

Hello @abhisekhranjan,

I have checked your website there few things missing, Please do that and also make sure below things are enable or not.

1. Turn Caching On
   You would be surprised how many times I fixed a client’s slow-M2 problem simply by enabling cache. “Of course it is slow” – I tell them, “Your cache is off!”.
   
   Go to backend menu System > Cache Management and double check the settings. It should all be green and look like this: https://www.screencast.com/t/e5DeKQZpC
   
2. Turn Production Mode On
   Magento 2 has three modes of operation: default, developer and production. The fastest one is production. Default and developer modes are used for debugging purposes and should never be used for a live site.
   
   You will need to get SSH access details from your hosting provider to find out what mode you are running in now. The command is pretty simple:
   

   php bin/magento deploy:mode:show

   Run it once inside the root Magento folder.
   To set production mode issue this command:
   

   php bin/magento deploy:mode:set production

   
   Depending on your configuration it might take a while. You would see a screen like this: php bin/magento deploy:mode:set production
   
3. Enable CSS/JS Minification
   This is another special Magento 2 feature that was absent in Magento 1. You now can minify JS/CSS files with no need for 3rd-party extension.
   
   Go to Stores > Configuration > Advanced > Developer and set minification on
   https://www.screencast.com/t/FRkWhNym
   
4. Use Built-in Cache, Skip Varnish
   Magento 2 has two options for Full Page Cache: built-in application and Varnish. You can choose between the two at Stores > Configuration > Advanced > System ( on M2.2.2 you need to be in developer mode to make a switch ) https://www.screencast.com/t/9axqatdosU
   

 --
If my answer is useful, please Accept as Solution & give Kudos

[mary_hilko]

Hi!

I don’t recommend merging JS files. JS Bundling works way better than Merging JS files. Minifying, yes. Merge only if you don’t intend to use advanced bundling (Magento 2 built-in bundling is a mess, don’t use it).

Advanced JS Bundling is kind of tricky, you’ll need to know what are you doing. Install npm, nodejs, and require.js.

I use Magento DevTools as a Chrome extension to analyze JS. After you are done with the setup, just start recording within the extension and visit all the important pages one by one. It works well not only for Checkout, as you can see, but for other pages as well.

After you are done you’ll have on your hands a brand new build.js file. Put it into Magento root directory (or wherever you like really, I’m just used to dumping stuff into the root folder lol).

OK so. Now you need to make sure bundling and merging of JS is OFF in Admin panel.

Generate static content (php bin/magento setup:static-content:deploy). All static content will be located at /pub/static/frontend/Magento/luma/en_US/ where luma is the name of your theme and en_US is the locale of your store.

1. Rename the locale folder from en_US to en_US_source. 
2. Execute from Magento root directory: r.js -o build.js optimize=uglify2 baseUrl=”pub/static/frontend/Magento/luma/en_US_source/” dir=”pub/static/frontend/Magento/luma/en_US/” 

Here’s more info if you catch an exception or need other fixes. Worked great for me when I needed to speed up Magento Checkout.

[kuldeep_sharma3]

Hi @abhisekhranjan 

We had a similar issue with our customer e-store http://mmc.support.magentoprojects.net/ . Onestepcheckout was taking roughly aroun 30-40 sec initial. We took series of steps to correct the flows using breakdown analysis . Below are the list of activites we performed to reach to the level of 5-6 sec loading time. Hope these helps you 

- Swap Agreements Block (Below payment method or before place order button).
- Functionality to check newsletter checkbox by default checked.
- Edit Product on checkout.
- Manage Shipping & Billing address field.
- Change sort order of shipping & billing address field.
- Change label of shipping & billing address field.
- Change width of shipping & billing address field.
- Set default value of shipping & billing address field.
- Change required validation of shipping & billing address field.
- Change visibility of shipping & billing address field.

You can refer to the extension which is upgraded to mentioned level . https://www.magedelight.com/magento-2-extensions/one-step-checkout-magento-2.html

Hope this helps you