Web Tech Guide

www.blogsmonetize.com feed

Measuring Page Load Time with JavaScript

 

Today, I'm going to guide you to create a simple widget that measures the time loading your blog using JavaScript.

1. Login to your account --> Design --> Edit HTML
2. Click on "Download Full Template" to backup your template.
3. Check "Expand Widget Templates"
4. Search for

<head>

5. Add the following code after it

<!--Start loading timmer -->
<script type='text/javascript'>
var myTime = new Date();
var startTime = myTime.getTime();
</script>
<!-- End loading timer -->

6. Find </body> and add the following code above it

<!-- start loading timer  -->
<script type='text/javascript'>
var myTime2 = new Date();
var endTime = myTime2.getTime();
var totalTime = (endTime - startTime)/1000;
document.getElementById(&quot;loadingTime&quot;).innerHTML = &quot;Page loaded in: &quot;+ totalTime +&quot; seconds&quot;;
</script>
<!-- end start loading timer -->

7. Save your template and go to "Page Elements" -->  Add a Gadget --> HTML/JavaScript. Copy the following code and paste.

<div id="loadingTime"></div>
<div style="clear:both"></div>
<div style="float:right">Widget by <a href="http://www.blogsmonetize.com/" title="WebTechGuide">WebTechGuide</a></div>

8. Save your widget, now you have a page loading counter widget.

9. You can check out a demo here.


© 5/30/2011 12:19:00 AM www.blogsmonetize.com
Loading related posts...

0 comments:

Post a Comment