What is the most common waste of computing power in Javascript?

Question

We've all seen people who do this:

jQuery('a').each(function(){
    jQuery(this)[0].innerHTML += ' proccessed';
});

function letsPoluteNS() {
    polute = '';
    for (morePolution = 0; morePolution < arguments.length; morePolution++)
        polute.join(arguments[morePolution]);
    return polute;
}

and so on. I was wondering what people have seen the most common JavaScript/jQuery technique that is slowing down the page and/or wasting time for the JavaScript engine.

I know that this question may not seem to fit into what's an accepted question, yet I'm asking "what is the most common accepted waste?"

Answer 1

I'm guilt of this. Basically using only the element's class in a jQuery selector. Instead of combining the class selector with the elements tag name.

<div></div>
<div class="hide"></div>
<div class="show"></div>
<div class="hide"></div>
<div class="hide again"></div>

---

$(".hide").hide();

Instead of the quicker

$("div.hide").hide()

---

---

Also this is inefficient, many people don't make use of the context parameter for selectors

$( selector, [ context ] )

---

   $("#mydiv").click(function () {
      $("#mydiv span").show();
   }

Which can be handled better like this:

   $("#mydiv").click(function () {
      $("span", this).show();
   }

Answer 2

You'll also see this:

$('#this').find('a').doSomeThing();

Know what's a lot more efficient? One selector that covers both will server you better...

$('#this a').doSomeThing();

It seems obvious, but you'll see it all the time.

Answer 3

Anything that has do to with tracking users and heavy publicity. Thats wasted space for sure.

I guess wrong use of stuff like using classes instead ids as selector in very complex html would slow thing down. And ie of course.