Page Loading Time in jQuery

Introduction

In this article, I explain how to show page load time using jQuery.

First we download the file and then add it to our project; the file is:

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_in_Jquery" and then click "Ok". Then add "HTML page" and write the following code.

Program Coding

Page_LoadTime.htm

<head>

$(function ()

{

var befretime = new Date().getTime();

window.onload = gettimeload;

function gettimeload()

{

var aftertime = new Date().getTime();

// Time calculating in seconds

time = (aftertime - befretime) / 1000

$("#lbltxt").text(time);

}

});

</script>

</head>

<body>

<h3 style="color: #0000FF">Page load time in Jquery</h3>

<div>

your Page load in

Seconds

</div>

</body>

</html>

Output

Refresh or Reload the page; you will see that the page load time has changed.

For more information, download the attached sample application.