Is there a better, faster, more readable, way to make looping efficient when forward counting is needed?

Question

I've been reading a lot about loops. I've lerned that the fastest way to do a loop in javascript is when you

var i=10; while(i--){console.log(i);}

this will start at nine end at zero because zero is false. It looks like it's fast because it does seems to only do the one check while also setting at the same time (each browser performs differently, please don't shoot me!)

From all that I have seen though, this isn't always practical (as you are counting down)

As this article states in point 3 http://gamealchemist.wordpress.com/2013/05/01/lets-get-those-javascript-arrays-to-work-fast/; you may be looping through an array and Quote

"Because all CPU caches in the world expect the processing to be ‘straight’"

Also if yo need the number++ in the loop for a calculation like so

for(var importantNumber=0;importantNumber<10;importantNumber++){console.log(importantNumber);}

I think that will check both sides of < on each loop

or

importantNumber=0;

while(importantNumber<10){console.log(importantNumber);importantNumber++;}

I think the above is pretty the same as the first

importantNumber+=1; would improve it

while(importantNumber<10){console.log(importantNumber);importantNumber+=1;}

how about one number that is polar oposite to the other

var i=[0,10];// i[0] is the importantNumber

while(i[1]-=1){console.log(i[0]);i[0]+=1;}

Is there a better, faster, more readable, less goofy way to make looping efficient when forward counting is needed?

It is important I feel when dealing with large loops or many loops in sequence or large arrays and big calculations else this is not an issue in normal situations

Answer 1

I've been reading a lot about loops. I've lerned that the fastest way to do a loop in javascript is when you [while loop]

Loops in javascript in modern browsers are highly optimised, there is usually little or no difference in current browsers between for, while and do loops. There were differences a few years back, but they were inconsistent across browsers so what was faster in one wasn't in another.

So just use the loop that suits and if there is a performance issue, investigate. It will generally have little or nothing to do with the type of loop.

It looks like it's fast because it does seems to only do the one check while also setting at the same time

Not necessarily. It's less typing to write it that way, but often it's faster to do assignments separately to the test (but the difference is small either way), e.g.

while (i) {
  --i;
}

may well be faster, or at least no slower than,

while (--i) {
  ...
}

But again, use whichever seems appropriate in the context of the surrounding code. See Elias' answer regarding premature optimisation.

Answer 2

I'm sure you've come across this quote before: "Premature optimization is the root of all evil". And perhaps you're familiar with this one, too: "Debugging is twice as hard as writing the code in the first place. Therefore, if you write the code as cleverly as possible, you are, by definition, not smart enough to debug it."

Both of these quotes ring true. You are talking about writing loops. Loops are basic structures, essential building bricks of (almost) any piece of code. Compare it to building a wall: Yes, you could save a few cents by keeping bricks that have broken in half, and use those halves when you find yourself in need of half a brick. But is it really worth it? I mean: look at the last snippet you posted here. By your own admission, it looks goofy, and isn't all that readable.
KISS is key: perhaps, in some cases, on some JS engines, a decrementing while loop will outperform an incrementing for loop, but you're writing JavaScript not C, or assembly. The mere fact that you're writing JS means that losing or gaining a few micro-seconds isn't going to be noticeable.

It all boils down to common sense: Write what you know, and write it so that you can understand the code at a glance.
If that means writing:

var i=10;
while(i--)//note, this will never log array[0]!!!
    console.log(array[10-i]);

Then I'd have to say: get help, but no matter. If that's what is most readable to you, then that's what you write. However, I will say this:

while( --i)
    console.log(array[10-i]);

Will not perform the way you expect it to (pre-increment vs post-increment - or decrement in this case). Perhaps the closest you can get with a while loop in terms of predictable behavriour, or behaviour resembling that of a for loop is either one of this:

var i = 0;
while(i < array.length)
    console.log(array[i++]);
//or
i = array.length;
while(i)
    console.log(array[array.length - (i--)]);

But let's be honest, compared to:

for (var i = 0;i<array.length;++i)
    console.log(array[i]);

I'd say it's pretty obvious which code makes the most sense. What might impact the performance here is how array.length is implemented. Chrome/chromium translates all objects (this of course includes arrays) to hidden C++-like classes, which in turn means that array.length is an O(1) operations (accessing a member), whereas IE engines of old implemented this magic property differently, which caused it to perform an order of magnitude slower. However: don't worry about this difference. Engines evolve, and by the time you've finished optimizing your loops to get a consistent speed across all browsers, the next version will have been released, and you can start all over again. So TL;TR:

Never mind the Bollocks