CODEWITHSUNDEEP
javascriptjqueryperformancegoogle-chrome-devtoolshtml
221B
221B

Reputation: 851

How to check which resource is making webpage load slowly

One webpage is loading slowly, it's basically because of some javascript which is making loading of the page slow. I understand that, if there is any synchronous code which is taking time to load, then it can make the load time slow.

My question is, how do I investigate which script is making this happen. I'm familiar with chrome network debugger but exactly not sure how to find out this script. If I can find out the JS file, how do I check which piece of the code in the file is making it slow?

Let me know if anything is unclear.

Upvotes: 2

Views: 5601

Answers (1)

coderakki
coderakki

Reputation: 260

If you are trying to check the resources on your page with the actions performed while loading, open developer tools on Google Chrome(F12) and go to Performance Tab>> Click Record and reload the page, stop it and see the breakdown time wise.

You can go onto Audits tab and start a new audit to see detailed performance of your page.

Alternatively, you can use Google Pagespeed to test and also to get the compressed resources to speed up your webpage : https://developers.google.com/speed/pagespeed/insights/

or use GTmetrix to choose the location and test your page : https://gtmetrix.com

In GTmetrix, it will help you identify the time taken by each resource on your page(js,css,images) so that you can find and fix it. It also provides useful info to fix those.

Click on Waterfall tab to see the time taken for each file/resource .

Upvotes: 3

Related Questions