Results 1 to 10 of 10

Thread: Xtype vs Create

  1. #1
    Sencha User
    Join Date
    Jul 2012
    Posts
    235
    Vote Rating
    0
      0  

    Default Xtype vs Create

    Hi,
    What is the difference between declaring an element as 'xtype' inside a container and creating a variable using 'Ext.create' and using that variable inside a container?

  2. #2
    Sencha User sword-it's Avatar
    Join Date
    May 2012
    Location
    Istanbul
    Posts
    1,335
    Vote Rating
    91
      0  

    Default

    Hi

    xtype allow us lazy rendering of the components, lazy rendering terms to faster execution of the code.

    if you are working on a single page application, nothing matters, but if your application is big, xtype will allow fast rendering.


    if you are getting instance everytime in a large project, every time it is instantiates, but if you are using xtype, it will take only once to take reference from the library and instantiates when needed or comes into the evolution.
    sword-it.com, Sencha Developer House in Turkey - Istanbul University Technopark Suite 204.

  3. #3
    Sencha User
    Join Date
    Jul 2012
    Posts
    235
    Vote Rating
    0
      0  

    Default

    but one doubt. if i want one element created by (Ext.create) and using its instance for different window why it is giving error.

    Ex.-how can i use a grid that will appear when i will click on a item of a panel and the same grid with same data should appear when i will click on a button with a pop-up?


    plz any ans will be appreciated.

  4. #4
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,790
    Vote Rating
    392
      0  

    Default

    Quote Originally Posted by sword-it View Post
    xtype allow us lazy rendering of the components, lazy rendering terms to faster execution of the code.
    I don't believe this is true. Lazy rendering is a feature of a card layout or tabpanel and has nothing to do with whether you pass a config or an instantiated component.

    xtypes often make for tidier looking code but in most cases it is equivalent to using Ext.create. Using xtypes does allow for lazy instantiation but the laziness only lasts until you add them to a container. This type of laziness can be useful for getting around shared reference problems with items on the prototype, see here for more information:

    http://skirtlesden.com/articles/conf...-the-prototype

  5. #5
    Sencha User
    Join Date
    Jul 2012
    Posts
    235
    Vote Rating
    0
      0  

    Default

    But plz clarify my doubt i have mentioned.m rely confused.

  6. #6
    Sencha Premium User
    Join Date
    Nov 2010
    Location
    Chicago
    Posts
    2,184
    Vote Rating
    555
      0  

    Default

    Quote Originally Posted by skirtle View Post
    I don't believe this is true. Lazy rendering is a feature of a card layout or tabpanel and has nothing to do with whether you pass a config or an instantiated component.

    xtypes often make for tidier looking code but in most cases it is equivalent to using Ext.create. Using xtypes does allow for lazy instantiation but the laziness only lasts until you add them to a container. This type of laziness can be useful for getting around shared reference problems with items on the prototype, see here for more information:

    http://skirtlesden.com/articles/conf...-the-prototype
    Good article! This should be a mandatory reading for all developers new to Ext JS.

    This post is also helpful.

    http://mitchellsimoens.com/2011/12/e...-property-bad/

  7. #7
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,790
    Vote Rating
    392
      0  

    Default

    Quote Originally Posted by chandan.behura View Post
    But plz clarify my doubt i have mentioned.m rely confused.
    Not sure I entirely understand what your problem is.

    Are you trying to use the same instance of a grid in two different places? Assuming that's the question it isn't really relevant to xtype vs Ext.create. If you need the grid in both places at the same time then that isn't possible, you'd need two grids. You can move a grid though, by removing it from one container and adding it to another.

  8. #8
    Sencha User crysfel's Avatar
    Join Date
    Feb 2008
    Location
    New York, USA
    Posts
    218
    Vote Rating
    9
      0  

    Default

    Quote Originally Posted by chandan.behura View Post
    Ex.-how can i use a grid that will appear when i will click on a item of a panel and the same grid with same data should appear when i will click on a button with a pop-up?
    You need to create a class for the grid that you want, after that you have to create two instances of that class and render those grids whatever you want. You can share the same store on both grids that will allow you to have the same data

    Regards

  9. #9
    Sencha Premium Member tempvalue's Avatar
    Join Date
    Apr 2012
    Location
    Nyon
    Posts
    25
    Vote Rating
    0
      0  

    Default

    By the way, if you use ext.create and provide an id. you can call Ext.getCmp(id) and also other useful methods related with ext component before calling your main panel which render everything to body. In some cases, you want to reference your component in your code and use this reference before and after rendering.

    If you use config object decleration(xtype), you cannot use getCmp like functions before rendering.

    Also, it is important to note that, in either way, before rendering a component, you cannot call view related methods such as getWidth() or setWidth(px)...

  10. #10
    Sencha User
    Join Date
    Mar 2017
    Posts
    1
    Vote Rating
    0
      0  

    Default

    Quote Originally Posted by skirtle View Post
    I don't believe this is true. Lazy rendering is a feature of a card layout or tabpanel and has nothing to do with whether you pass a config or an instantiated component.

    xtypes often make for tidier looking code but in most cases it is equivalent to using Ext.create. Using xtypes does allow for lazy instantiation but the laziness only lasts until you add them to a container. This type of laziness can be useful for getting around shared reference problems with items on the prototype, see here for more information:

    http://skirtlesden.com/articles/conf...-the-prototype


    Great Article skirtle....And I had the same requirement...
    Now my doubt is...what about the components which doesn't have xtype....for example: I am using "Ext.selection.CheckboxModel"...
    I need to use this for grid record selection...but when I cloneConfig() this grid the checkboxmodel fro first grid is disappearing...AND i also can't use xtype because, it doesnt have one...........???

    Thank You

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •