Search code examples
javascriptextjsextjs4

What is the need of configuring an alias on classes?


I want to know why we need to configure aliases on classes in ExtJS? What benefits does it offer?


Solution

  • The first, simplest but valuable benefit is that you do not need to type probably long class names, but you can use short(er) aliases when you need to use the class.

    Imagine that we need to use the above class in a layout.

    Without alias, we need to type:

    Ext.create('Ext.container.Container',{ layout:'vbox' ,items:[ Ext.create('MyApp.view.MyGridView',{ // config
    })
    ] });

    Ext.create('Ext.container.Container',{ layout:'vbox' ,items:[ Ext.create('MyApp.view.MyGridView',{ // config
    })
    ] }); and with alias, we type:

    Ext.create('Ext.container.Container',{ layout:'vbox' ,items:[{ xtype:'mygrid' // config }] });

    Ext.create('Ext.container.Container',{ layout:'vbox' ,items:[{ xtype:'mygrid' // config }] }); The latter is about 20 keystrokes less than the former one. Now imagine that you need to use your classes hundreds of times in bigger applications. It is obvious that xtype save a considerable amount of typing not speaking about reducing the risk of typos in long names.

    Second, also very valuable benefit is that Ext.create instantiates the class unconditionally, whether it is needed or not. You can have many views, tabpanels or card layouts in a big application that the user may never click on, or very rarely.

    In other words, some of the defined classes never to be instantiated, or they can wait until the user needs them. Thus, xtype can save the memory, what is not very important in modern computers because instantiated Ext/Touch classes do not eat gigabytes.

    The last benefit I want to mention, and this is really important, is a greatly improved code readability and maintainability as well. Code is not just written once and forgotten when it works, but it is read, debugged and modified by many developers so everything that makes it shorter, nicer and easier to understand counts

    credits:- http://extjs.eu/what-is-an-xtype/