Why does a container add a function faster with an array with objects, and then with an array with objects Sencha Touch

I'm trying to figure out what is best used when working with Sencha Touch 2 (speed wise). I already found out that it doesn't really matter if I initialize the components shown on the screen through Ext.createor {xtype:""}. But how can I add controls to the container as follows:

containerPanel = Ext.create('Ext.Container', {
            id: 'appContgdfsainer',
            fullscreen: true,
            items: Ext.create('Ext.Button', {
                text: 'Button',
                listeners: {tap:function(){containerPanel.add(items)}}
            })

        });

Note that the elements is an array containing either 1000 panels created using {html:"test", xtype:"panel"};or using. Ext.create("Ext.Panel",{html:"test"});
This gives me the other results that I expect. I expect it to Ext.createbe faster, because sencha should only add a component that is already created using the function Ext.create. I expect another feature to be slower, because sencha must first create this object before it can be added.
The only problem is that it is not. {html:"test", xtype:"panel"};noticeably faster loading panels when I use Ext.create to add them.

Question:
How is it that when adding panels to a container it’s {html:"test", xtype:"panel"};faster thanExt.create

+3
source share
1 answer

faster?

jsperf.com - , Ext.create .

: http://jsperf.com/st2-xtype-vs-create

+2

All Articles