Ext.forEach

[LesJ]

I noticed that Ext.each is used very frequently. It's a very convenient and flexible way to iterate, but it is also slow.

I suggest adding this mapping and using Ext.forEach instead of Ext.each.

Ext.forEach = ExtArray.forEach

forEach is faster because it maps (in newer browsers) to native forEach. I checked the Ext code base... in many (if not almost all) places each could be replaced by faster forEach because we don't check the return value of the callback.

This shortcut would also save a few bytes because it could replace Ext.Array.forEach in a number of places

[mitchellsimoens]

Ext.each is also slow, executing a function for every array/object iteration ("function iteration") comes at a cost and we are looking at removing it all internally. I have already gone through and done this but it's a massive change that needs to be tested and performance analyzed.

[LesJ]

Ext.each is also slow, executing a function for every array/object iteration ("function iteration") comes at a cost and we are looking at removing it all internally. I have already gone through and done this but it's a massive change that needs to be tested and performance analyzed.

I found a post that disagrees with this approach...

We really shouldn't put our efforts into doing that kind of micro-optimizations by hand. Instead we should build a JavaScript compiler that would do that kind of transformations for us.

[evant]

Ideally, yes. Practically, not quite there yet! http://triin.net/2011/03/02/Optimizi...h:_Not_so_fast!

[LesJ]

Ext.each is also slow, executing a function for every array/object iteration ("function iteration") comes at a cost and we are looking at removing it all internally. I have already gone through and done this but it's a massive change that needs to be tested and performance analyzed.

I found an Ext.each that should be converted to a plain for loop.

Ext.define('Ext.util.AbstractMixedCollection', {
    ...
    removeAll : function(items){
        Ext.each(items || [], function(item) {
            this.remove(item);
        }, this);

        return this;
    },
    ...

[mschwartz]

If the 90/10 rule is really true, then 90% of these loops should be Ext.each() for maintainability and readability.

[LesJ]

If the 90/10 rule is really true, then 90% of these loops should be Ext.each() for maintainability and readability.

You got this half right.

These loops should be Ext.forEach, not Ext.each.

Ext.forEach is much faster compared to Ext.each

[mschwartz]

I'm not an Ext4 user yet, though I've dabbled a little.

Ideally, a forEach() type function should work on both arrays and objects.

For example:

var a = [ 1,2,3];
forEach(a, function(value, key) {
  console.log(value);
});
// => 
// 1
// 2
// 3

var o = { foo: 'bar', baz: 'zaz' };
forEach(o, function(value, key) {
  console.log(key + ' = ' + value);
});
// => 
// foo = bar
// baz = zaz

[mitchellsimoens]

I personally wouldn't use Ext.each... Ext.forEach... store.each...

They all are going to execute a function for every iteration that is unneeded. Why not just do a for loop where possible?

[LesJ]

I personally wouldn't use Ext.each... Ext.forEach... store.each...

They all are going to execute a function for every iteration that is unneeded. Why not just do a for loop where possible?

Performance-wise:

for loop > Ext.forEach > Ext.each

But, for loops are more prone to bugs and the code is harder to understand and maintain.

I'd use for loops only in performance critical code.