35

Is there a way to check how long does it take for the page to load?

EDIT:

I will extend the question a bit. Say you are working on a ASP.NET project and when you run your project within the Visual Studio there is some loading time before you can see your starting page rendered on the screen and ready to use.

If this website was live the load time should be different from the load time when starting your project from Visual Studio.

What I would like to see is what would be the actual load time if the web site was on a server.

EDIT 2: Answer

Chrome -> Right Click -> Inspect Element -> Network Tab. When you load a page there is a nice report for the timeline of the page showing the actual page load time, css, js etc. load times. There is a similar tool in Mozilla under Net tab.

Anton Belev
  • 11,963
  • 22
  • 70
  • 111

5 Answers5

18

As for Firefox, the op has already answered his own question (Menu - Web Developer - Network or Ctrl + Shift + K - Network or Ctrl + Shift + Q), but I'd like to mention the "app.telemetry Page Speed Monitor" addon, which does not require you to open the web console first. It'll just show the load time in ms in the status bar (it'll even show details when you click it).
https://addons.mozilla.org/en-US/firefox/addon/apptelemetry/
The only downside seems to be the Facebook/Twitter button.

As for Chrome/Chromium, I second Andy Davies' suggestion, the Page load time plugin is awesome, it shows the load time next to the location bar and it also provides details.

basic6
  • 3,643
  • 3
  • 42
  • 47
9

Also note you can now get this via javascript via the window.performance object (Chrome, Firefox and IE9+).

Try this:

window.onload = function(){
  setTimeout(function(){
    var t = performance.timing;
    console.log(t.loadEventEnd - t.responseEnd);
  }, 0);
}

More info here: http://www.html5rocks.com/en/tutorials/webperformance/basics/

lambinator
  • 10,616
  • 7
  • 55
  • 57
3

As @nick-rtz does I use webpagetest for serious testing, if you want a quick look at load time and don't want to use the dev, tools this Chrome extension will help - https://chrome.google.com/webstore/detail/page-load-time/fploionmjgeclbkemipmkogoaohcdbig

Andy Davies
  • 5,794
  • 2
  • 26
  • 21
2

I use this tool: http://www.webpagetest.org/ But it's for live sites. If you want to benchmark local files that wouldn't be representative of actualy usage, but you might want to measure rendering times and not just transport times. Note that load times depend on where geographically on the planet the user is relative to the server.

Niklas Rosencrantz
  • 25,640
  • 75
  • 229
  • 424
1

For loadtime of a site that is live, I would also look into Real User Monitoring (aka RUM) to get performance data from your real users in production. You can do this yourself with open source projects like Boomerang and Bucky or go with a vendor. The data is invaluable! The tool mentioned by @vikramvi helps you track page performance in dev/test and helps prevent performance regression early in the dev cycle.

mverkerk
  • 31
  • 1
  • 2