Categories
Tools

How to calculate page load time using javascript

Last updated on February 11th, 2022 at 02:37 pm

Click to rate this tutorial!
[Total: 4 Average: 5]

Measuring web page load time has become very easy with the use of simple Javascript. Display time in milliseconds or seconds. Looking at the script one can see that there is a variable with the name startime where the current time gets loaded. Please take a look at the script below.

Add this script in the header of any webpage.

<script type="text/javascript">
var d = new Date();
var starttime = d.getTime();
</script>

Now comes the second part of the script which has to be added in the footer of any webpage.This script will simply find the difference between the loading time and convert it in to seconds.

<script type="text/javascript">
var d2 = new Date();
var endtime = d2.getTime();
var totaltime = (endtime - starttime)/1000;
var result = Math.round(totaltime*100)/100;
document.getElementById("time").innerHTML = '<strong>Page loaded in: '+totaltime+' milliseconds and ' + result +' seconds';</script>

Now Javascript required to calculate the loading time is ready. For displaying the loading time on your webpage you need one HTML tag with id=”time“..

<div id="time"></div>

Happy Coding 🙂

Demo (Note: Refresh the page if you see 0 in both millisecond / second due to caching. The time depends on how fast those image loads )

Click to rate this tutorial!
[Total: 4 Average: 5]

Leave a Reply

Your email address will not be published.