Menu
I've written a tiny plugin that gets the page load/render time. It collects the finish time at $(document).ready and I've put the code snippet that collects the start time right after the <title> tag.
I'd like this to be less obtrusive, so it seems there should be an earlier event than .ready where I can collect the earliest measurable page start time.
Here is the currently obtrusive javascript
<title></title>
<script type="text/javascript">
var startTime = (new Date()).getTime();
</script>
Here is the plugin:
(function ($) {
$(document).ready(function () {
var endTime = (new Date()).getTime();
var millisecondsLoading = endTime - startTime;
$.get('hicmah.ashx?duration=' + millisecondsLoading, function (data) {
});
});
})(jQuery);
211
bind() method is used for attaching an event handler directly to elements. Handlers are attached to the currently selected elements in the jQuery object, so those elements must exist at the point the call to . bind() occurs.
Event methods trigger or attach a function to an event handler for the selected elements. The following table lists all the jQuery methods used to handle events. Method / Property. Description. bind()
jQuery makes it straightforward to set up event-driven responses on page elements. These events are often triggered by the end user's interaction with the page, such as when text is entered into a form element or the mouse pointer is moved.
You can use onreadystatechange, DOMContentLoaded, and onload, which is what jQuery hooks into with the ready event shim.
if (document.addEventListener) {
document.addEventListener('DOMContentLoaded', callback, false);
window.addEventListener('load', callback, false);
} else {
document.attachEvent('onreadystatechange', callback);
window.attachEvent('onload', callback);
}
Alternatively, you could make sure that your page has a script tag at the top of the page, and at the bottom:
<html>
<head>
<script type="text/javascript">
window.begin = new Date();
</script>
...
</head>
<body>
...
<script type="text/javascript">
window.end = new Date();
</script>
</body>
</html>
Having the plugin do this job is not possible because the plugin can be used anywhere on the page. The best way to achieve this is get the time right at the start of the html markup and right after the end of the html markup, it will give you the best time.
37
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
