Menu
I have a large web page (internal, in development) that is taking too long to load. Specifically, loading the 2.3MB HTML page shows the styled content in ~3s, and then the browser locks up for over 20s before becoming interactive.
Using Chrome's Timeline I can see that this is all due to script being kicked off as part of the load event:
However, when I profile the page load I see this (click for full size):
32.01 seconds are spent in some anonymous function with no associated source code. As part of that, 18.87 seconds are spent in the function "get length" (which also has no associated source code).
What is get length? Is there no better information available from the profiler about where time is being spent?
745
This is call to a length attribute of the form (or any other DOM element with the native length attribute.
This is an example code I used
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript" src="js/lib/jquery.js"></script>
<script type="text/javascript">
var doStop = false;
$(function(){
//recursively append dot-button to the form and show its length
function a(counter) {
var $w = $('#wrapper').append($('<button>.</button>'));
$('#txt')[0].innerHTML = 'Form length: '+$w[0].length;
if (!doStop)
setTimeout(function(){ a(counter+1)}, 3);
}
$('#stopper').click(function(){ doStop = true; });
a(0); //let's go now
});
</script>
</head>
<body>
<button id="stopper">stop it</button>
<div id="txt"> </div>
<form id="wrapper"></form>
</body>
</html>
I get the following in the Chrome profiler:
| 0.08% | 0.08% | get length |
I do have an arrow beneath it to drill down through function a() though.
97
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
