<body><script type="text/javascript"> function setAttributeOnload(object, attribute, val) { if(window.addEventListener) { window.addEventListener('load', function(){ object[attribute] = val; }, false); } else { window.attachEvent('onload', function(){ object[attribute] = val; }); } } </script> <div id="navbar-iframe-container"></div> <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> <script type="text/javascript"> gapi.load("gapi.iframes:gapi.iframes.style.bubble", function() { if (gapi.iframes && gapi.iframes.getContext) { gapi.iframes.getContext().openChild({ url: 'https://www.blogger.com/navbar.g?targetBlogID\x3d8211560\x26blogName\x3dTech+Tips,+Tricks+%26+Trivia\x26publishMode\x3dPUBLISH_MODE_BLOGSPOT\x26navbarType\x3dBLUE\x26layoutType\x3dCLASSIC\x26searchRoot\x3dhttp://mvark.blogspot.com/search\x26blogLocale\x3den\x26v\x3d2\x26homepageUrl\x3dhttp://mvark.blogspot.com/\x26vt\x3d-5147029996388199615', where: document.getElementById("navbar-iframe-container"), id: "navbar-iframe" }); } }); </script>

Tech Tips, Tricks & Trivia

by 'Anil' Radhakrishna
An architect's notes, experiments, discoveries and annotated bookmarks.

Search from over a hundred HOW TO articles, Tips and Tricks


JavaScript Performance tips

Excerpted from "Chapter 7: Writing Efficient JavaScript" of the book "Even Faster Websites":
  • Performance .. is not just about how long it takes for the page to load, but also about how it responds as it’s being used.
  • Out-of-scope variables take longer to access than local variables.
  • A very common mistake that leads to performance issues is to omit the var keyword when assigning a variable’s value for the first time. 
  • If an array item or object property is used more than once, store it in a local variable to speed up access to the value.
  • Generally speaking, interacting with DOM objects is always more expensive than interacting with non-DOM objects.
  • The if statement is best used with a small number of discrete values or a range of values; the switch statement is best used when there are between 3 and 10 discrete values to test for; array lookup is most efficient for a larger number of discrete values.
  • To make a loop the most efficient, reverse the order in which you process the items so that the control condition compares the iterator to zero.
  • Trimming strings may be expensive, depending on the size of the string. 
  • Steven Levithan's optimized string trimming function:
    function trim(text){
    text = text.replace(/^\s+/, "");
    for (var i = text.length - 1; i >= 0; i--) {
    if (/\S/.test(text.charAt(i))) {
    text = text.substring(0, i + 1);
    break;
    }
    }
    return text;
    }
  • Array processing is one of the most frequent causes of long-running scripts.
  • Generally speaking, no single continuous script execution should take longer than 100 milliseconds...
  • Because JavaScript is a single-threaded language, only one script can be run at a time per window or tab.
  • Exactly what causes the browser to display the long-running script dialog varies depending on the vendor:
    • Internet Explorer displays it when 5 million (by default) statements have been executed. 
    • Firefox shows it when a script takes longer than 10 seconds (default).
    • Safari displays it when the execution time exceeds default timeout of five seconds
    • Chrome (as of version 1.0) has no set limit on how long JavaScript is allowed to run. The process will crash when it has run out of memory.
    • Opera is the only browser that doesn’t protect against long-running scripts. Scripts are allowed to continue until execution is complete

Labels:

Tweet this | Google+ it | Share on FB

« Home | Next »
| Next »
| Next »
| Next »
| Next »
| Next »
| Next »
| Next »
| Next »
| Next »

»

Post a Comment