Introduction
In this article, I explain how to show page load time using JavaScript.
Use the following procedure.
Step 1
Open Visual Studio 2012 and click "File" -> "New" -> "Web Site...". A window is opened. In this window, click "Empty Web Site" under Visual C#.
Give the name of your application as "Page_load_Time" and then click "Ok". Then add the "HTML page" and write the following code.
Program Coding
PageLoad.htm
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
-
- <title></title>
- <script type="text/javascript">
- var before_loadtime = new Date().getTime();
- window.onload = Pageloadtime;
- function Pageloadtime() {
- var aftr_loadtime = new Date().getTime();
- // Time calculating in seconds
- pgloadtime = (aftr_loadtime - before_loadtime) / 1000
-
- document.getElementById("loadtime").innerHTML = "Pgae load time is <font color='red'><b>" + pgloadtime + "</b></font> Seconds";
- }
- </script>
- </head>
- <body>
- <h3 style="font-weight: bold; font-style: italic; font-size: large; color: #3333CC">Page load time in JavaScript</h3>
- <div>
- <span id="loadtime"></span>
-
- </div>
- </body>
- </html>
Output
Refresh or Reload the page; you will see that the page load time has changed.
Again refresh or reload the page.
For more information, download the attached sample application.