Solved

Check webpage loading time

Posted on 2006-11-17
7
1,342 Views
Last Modified: 2013-12-16
Hi,

I'm looking for a way to figure out how long does a webpage take to finish loading in the browser. My webpage is primarily in JSP. Is there a way to use Javascript, or JSP to display the loading time for each page?

I'm testing the web app on different server, and I need to find out how much different in speed each server can serve up the page.

Please let me know if you have any suggestion.

Thanks!

Owon.Seed
0
Comment
Question by:owonseed
7 Comments
 
LVL 7

Expert Comment

by:rangasuman
Comment Utility
That would be very hard to determine as it depends on several factors like internet speed, browser, operating system etc. Although some of the web editors give an approximate load timing for static pages, dynamic pages coming from a server may differ vastly depending on the server load and other characteristics.
0
 
LVL 12

Assisted Solution

by:UnexplainedWays
UnexplainedWays earned 130 total points
Comment Utility
Here's something i quickly wrote up to give you an idea.  However, this doesn't include a trip to the server, its how long it takes to download the content's of the page.


What you could do is that this and expand on it.  I would start with a pop up window.  Do the same thing, take a time stamp and then the test page load's in the window, and have the same type of 'onload' thing in the test page where it talks back to the parent window, who gets the second time and does the subtraction.  Only problem is that it includes the speed of opening a new window. However if your testing on the same computer for different server's the offset would be the same.


Just an idea.


<html>
<head>
<script language=javascript>

      
      startTime = new Date();
      
      function DoThat()
      {
            finishTime = new Date();
            duration = finishTime - startTime;
            durToTime = new Date(duration);

            toPrint = duration+"\n\n";
            toPrint += "Seconds: "+durToTime.getSeconds()+"\n";
            
            alert(toPrint);      

      }

</script>
</head>
<body onload=DoThat()>

      <img width=200 src="http://www.ibiblio.org/wm/paint/auth/durer/large-turf.jpg">

</body>
</html>
0
 
LVL 28

Expert Comment

by:gamebits
Comment Utility
You need to use FireFox and dowload the Web Developer toolbar, once you have that open the page you want to test, in the browser toolbar under Tools there is an option "View Speed Report" that will give you a lot of information on your loading time, including Analysis and Recommendation.

Gamebits
0
IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

 
LVL 5

Accepted Solution

by:
wranlon earned 130 total points
Comment Utility
Hi,

A little bit ago I wrote an article (with same code) on developing passive Web page monitors: http://www.imnmotion.com/documents/html/technical/dhtml/monitor.html

In a nutshell, you can figure out the loading time by tracking timestamps for the following:

1) timestamp when user left previous page
2) timestamp from top of current page
3) timestamp from bottom of current page
4) timestamp from page load (window.onload)

You can collect these values by doing the following:

1) Attach an event handler to the unload, and set a cookie with the current time (call this FETCH_DATE).  You'll want to probably include a hash of the URL so you can correlate the time value between pages.

2) Add a bit of javascript at the top of the Web page, in the HEAD section, and collect the date (eg: var TOP_DATE = new Date().getTime();)

3) Add a bit of javascript at the bottom of the Web page, before the end of the BODY, and collect another date (eg: var BOTTOM_DATE = new Date().getTime();)

4) Add a bit of javascript to a window.onload to collect the date (eg: var LOAD_DATE = new Date().getTime();) and then  figure out your perf metrics:  latency = TOP_DATE - FETCH_DATE, parse time = BOTTOM_DATE - TOP_DATE, render_time = LOAD_DATE - TOP_DATE, and overall response time is TOP_DATE - FETCH_DATE (or - TOP_DATE if FETCH_DATE isn't available).

That will give you a general idea of page performance.  It won't give you network performance, but it will give you an idea of what the end-user's performance was.
0
 
LVL 2

Expert Comment

by:Messiadbunny
Comment Utility
There's also webpages that will tell you how long it takes to download all the materials on your website and give recommendations on how to reduce loading times.  There's one here:

http://www.websiteoptimization.com/services/analyze/
0
 

Author Comment

by:owonseed
Comment Utility
The pages I'm testing requires user login, therefore I won't be able to use the Firefox addon and also the websiteoptimization web service. I do find them usefull for my other webpage performance testing however.

I'd implement the method that UnexplainedWays and wranlon suggested. They are both similar, hence I'd give the same point to both of them.

Thanks all for the suggestion.
0
 
LVL 12

Expert Comment

by:UnexplainedWays
Comment Utility
I was thinking about reading the page from the server, but then you would been to find and download each file associated with it, parse the page etc.

So it would be alot easier to write something client side.


Glad i could help :]
0

Featured Post

Better Security Awareness With Threat Intelligence

See how one of the leading financial services organizations uses Recorded Future as part of a holistic threat intelligence program to promote security awareness and proactively and efficiently identify threats.

Join & Write a Comment

Suggested Solutions

Title # Comments Views Activity
Web Site Hosting 10 68
.NET website different than other website? 4 45
Problem to echo 6 51
Do we need servers??? 5 109
Password hashing is better than message digests or encryption, and you should be using it instead of message digests or encryption.  Find out why and how in this article, which supplements the original article on PHP Client Registration, Login, Logo…
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
This video teaches users how to migrate an existing Wordpress website to a new domain.
The purpose of this video is to demonstrate how to update a WordPress Site’s version. WordPress releases new versions of its software frequently and it is important to update frequently in order to keep your site secure, and to get new WordPress…

762 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now