1. #1
    Touch Premium Member
    Join Date
    Nov 2010
    Location
    Chicago
    Posts
    1,326
    Vote Rating
    115
    LesJ is a glorious beacon of light LesJ is a glorious beacon of light LesJ is a glorious beacon of light LesJ is a glorious beacon of light LesJ is a glorious beacon of light LesJ is a glorious beacon of light

      0  

    Default this.callParent(arguments) - simple performance optimization

    this.callParent(arguments) - simple performance optimization


    Try this code in Firefox and IE7.

    You will see that this.callParent([arg1, arg2, arg3]) calls are faster compared to this.callParent(arguments);

    FF - 10% faster
    IE7 - 100% faster

    I suggest making this modification in the Ext code base.

    Code:
    Ext.define('MyClass', {
        test: function(arg1, arg2, arg3) {
        }
    });
    
    Ext.define('Sub1', {
        extend: 'MyClass',
        test: function (arg1, arg2, arg3) {
            this.callParent(arguments);
        }
    });
    
    Ext.define('Sub2', {
        extend: 'MyClass',
        test: function (arg1, arg2, arg3) {
            this.callParent([arg1, arg2, arg3]);
        }
    });
    
    var obj1 = new Sub1(),
        obj2 = new Sub2(),
        i = 0;
    
    console.time('1');
    for(i=0; i<20000; i++) {
        obj1.test('123', {}, 123);
    }
    console.timeEnd('1');
    
    console.time('2');
    for(i=0; i<20000; i++) {
        obj2.test('123', {}, 123);
    }
    console.timeEnd('2');
    Also, try this code. It's at least 100% faster on IE7

    Code:
    Ext.define('MyClass', {
        test: function() {
        }
    });
    
    Ext.define('Sub1', {
        extend: 'MyClass',
        test: function () {
            this.callParent(arguments);
        }
    });
    
    Ext.define('Sub2', {
        extend: 'MyClass',
        test: function () {
            this.callParent();
        }
    });
    
    var obj1 = new Sub1(),
        obj2 = new Sub2(),
        i = 0;
    
    console.time('1');
    for(i=0; i<20000; i++) {
        obj1.test();
    }
    console.timeEnd('1');
    
    console.time('2');
    for(i=0; i<20000; i++) {
        obj2.test();
    }
    console.timeEnd('2');
    I see code like this in Ext. I think the bold arguments is not needed.

    Code:
        enable: function() {
            this.callParent(arguments);
    
            var itemsToDisable = this.getChildItemsToDisable(),
                length         = itemsToDisable.length,
                item, i;
    
            for (i = 0; i < length; i++) {
                item = itemsToDisable[i];
    
                if (item.resetDisable) {
                    item.enable();
                }
            }
        }
    Results for the 2nd example on IE7

    860ms 203ms
    828ms 187ms
    843ms 172ms
    1500ms 218ms
    984ms 125ms
    1250ms 296ms
    344ms 141ms
    703ms 125ms
    937ms 141ms
    547ms 125ms
    890ms 219ms
    Last edited by LesJ; 24 Feb 2012 at 8:30 AM. Reason: 2nd example

  2. #2
    Touch Premium Member
    Join Date
    Nov 2010
    Location
    Chicago
    Posts
    1,326
    Vote Rating
    115
    LesJ is a glorious beacon of light LesJ is a glorious beacon of light LesJ is a glorious beacon of light LesJ is a glorious beacon of light LesJ is a glorious beacon of light LesJ is a glorious beacon of light

      0  

    Default


    See this post arguments considered harmful.

    Basically, in some JavaScript implementations there's a price to pay for using the arguments object. The price is worse performance.

  3. #3
    Sencha - Community Support Team mankz's Avatar
    Join Date
    Nov 2007
    Location
    Stockholm, Sweden
    Posts
    2,748
    Vote Rating
    106
    mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all

      0  

    Default


    How many calls to callParent are done in a typical app launch? 10-100? 100-1000? 1000+?

    without that knowledge you're just shooting in the dark. Using arguments instead of listing each arg makes the code future proof.

    No more optimizations backed by "hunches" please

  4. #4
    Touch Premium Member
    Join Date
    Nov 2010
    Location
    Chicago
    Posts
    1,326
    Vote Rating
    115
    LesJ is a glorious beacon of light LesJ is a glorious beacon of light LesJ is a glorious beacon of light LesJ is a glorious beacon of light LesJ is a glorious beacon of light LesJ is a glorious beacon of light

      0  

    Default


    Quote Originally Posted by mankz View Post
    How many calls to callParent are done in a typical app launch? 10-100? 100-1000? 1000+?

    without that knowledge you're just shooting in the dark. Using arguments instead of listing each arg makes the code future proof.

    No more optimizations backed by "hunches" please
    If you have a drawing applications with 1,000 sprites like mine, then just the Sprite constructor will use arguments 1,000 times.

    Code:
    Ext.define('Ext.draw.Sprite', {
        ....
        constructor: function(config) {
            ...
            me.mixins.observable.constructor.apply(this, arguments);
           //  me.mixins.observable.constructor.apply(this, [config]); <--- change like this is much faster
        }
    I need to support IE7, so I'm trying to squeeze every bit of performance.

    I found an optimization that is easy to implement and is very effective on IE. Just look at the numbers that I provided...

  5. #5
    Sencha - Community Support Team mankz's Avatar
    Join Date
    Nov 2007
    Location
    Stockholm, Sweden
    Posts
    2,748
    Vote Rating
    106
    mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all

      0  

    Default


    Ok the sprite case sounds like it makes sense, but still not convinced this would give results by changing every occurrence in the Ext lib.

  6. #6
    Touch Premium Member
    Join Date
    Nov 2010
    Location
    Chicago
    Posts
    1,326
    Vote Rating
    115
    LesJ is a glorious beacon of light LesJ is a glorious beacon of light LesJ is a glorious beacon of light LesJ is a glorious beacon of light LesJ is a glorious beacon of light LesJ is a glorious beacon of light

      0  

    Default


    Quote Originally Posted by mankz View Post
    Ok the sprite case sounds like it makes sense, but still not convinced this would give results by changing every occurrence in the Ext lib.
    In B3, many each loops were changed to for loops. The code is now less readable and harder to maintain BUT it's faster.

  7. #7
    Sencha - Community Support Team mankz's Avatar
    Join Date
    Nov 2007
    Location
    Stockholm, Sweden
    Posts
    2,748
    Vote Rating
    106
    mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all mankz is a name known to all

      0  

    Default


    All for it if it leads to measurable improvements.

    Just curious how many such calls are made in a non chart app. If you could gain > 100 ms it should be worth it.

Thread Participants: 1