Top 10 Ext JS Development Practices to Avoidhttp://www.sencha.com/blog/top-10-ext-js-development-practices-to-avoid
In this guest blog post, Seans walks you through a list of the top 10 development practices he and his team at CNX recommend. He shares common mistakes and how to avoid them when developing your Ext JS apps.en-ussean.lanktree@cnxcorp.comCopyright 20132013-07-15T15:00:40+00:00Comment by PremkumarGreat article. I would like to point out that, many of us (ExtJS developers) are still obsessed with syntax of previous releases. Some example out there is also old and does not help in this aspect. I have faced so many problems myself to make a clear point at the very start of my learning curve. And to get hold of the MVC concept, one has to spend more time than we think it should. It would be even better if anyone makes these things clear. Pardon me if I am meaningless. Just shared my thought.Great article. I would like to point out that, many of us (ExtJS developers) are still obsessed with syntax of previous releases. Some example out there is also old and does not help in this aspect. I have faced so many problems myself to make a clear point at the very start of my learning curve. And to get hold of the MVC concept, one has to spend more time than we think it should. It would be even better if anyone makes these things clear. Pardon me if I am meaningless. Just shared my thought.]]>Tue, 06 Aug 2013 11:24 GMThttp://www.sencha.com/blog//top-10-ext-js-development-practices-to-avoid#id:33644#date:11:24Comment by DhanaNice Article. Good startupNice Article. Good startup]]>Tue, 06 Aug 2013 01:27 GMThttp://www.sencha.com/blog//top-10-ext-js-development-practices-to-avoid#id:33643#date:01:27Comment by Leonardo J. ParraVery useful post, could be great to see posts like this periodicallyVery useful post, could be great to see posts like this periodically ]]>Mon, 22 Jul 2013 19:30 GMThttp://www.sencha.com/blog//top-10-ext-js-development-practices-to-avoid#id:33571#date:19:30Comment by Piyush Dholariyait’s good tips to optimize the code…........it’s good tips to optimize the code…........]]>Fri, 19 Jul 2013 11:27 GMThttp://www.sencha.com/blog//top-10-ext-js-development-practices-to-avoid#id:33543#date:11:27Comment by bublerockmany thanksmany thanks]]>Wed, 17 Jul 2013 02:19 GMThttp://www.sencha.com/blog//top-10-ext-js-development-practices-to-avoid#id:33530#date:02:19Comment by afroHow do you achieve points 4&amp;5 in Architect?How do you achieve points 4&5 in Architect?]]>Tue, 16 Jul 2013 13:34 GMThttp://www.sencha.com/blog//top-10-ext-js-development-practices-to-avoid#id:33527#date:13:34Comment by NikolaiIn point “5. Use of global variables” was missed class name (Runtime):
MyApp.config.setMyLastCustomer(12345);—-&gt; MyApp.config.Runtime.setMyLastCustomer(12345);
MyApp.config.getMyLastCustomer();—-&gt; MyApp.config.Runtime.getMyLastCustomer();In point “5. Use of global variables” was missed class name (Runtime):
MyApp.config.setMyLastCustomer(12345);—-> MyApp.config.Runtime.setMyLastCustomer(12345);
MyApp.config.getMyLastCustomer();—-> MyApp.config.Runtime.getMyLastCustomer();]]>Tue, 16 Jul 2013 12:36 GMThttp://www.sencha.com/blog//top-10-ext-js-development-practices-to-avoid#id:33526#date:12:36Comment by JWPutting global variables into a class helps avoid naming collisions, but it doesn’t do anything to avoid the larger problem with globals. If a variable’s value can change at any time, at any point in the code, it becomes hard to debug code that relies on that value. Better to avoid globals whenever possible.Putting global variables into a class helps avoid naming collisions, but it doesn’t do anything to avoid the larger problem with globals. If a variable’s value can change at any time, at any point in the code, it becomes hard to debug code that relies on that value. Better to avoid globals whenever possible.]]>Mon, 15 Jul 2013 22:06 GMThttp://www.sencha.com/blog//top-10-ext-js-development-practices-to-avoid#id:33522#date:22:06Comment by James LorenzenQuestion regarding #4 on Poor folder structure for source code: does that also mean the corresponding controllers also have subfolders like /controller/customer?
Seems like the files under store and model would maybe not have subfolders.Question regarding #4 on Poor folder structure for source code: does that also mean the corresponding controllers also have subfolders like /controller/customer?
Seems like the files under store and model would maybe not have subfolders.]]>Sat, 13 Jul 2013 02:59 GMThttp://www.sencha.com/blog//top-10-ext-js-development-practices-to-avoid#id:33516#date:02:59Comment by Darshita ShahNice article, very helpful to resolve many performance issues.Nice article, very helpful to resolve many performance issues.]]>Fri, 12 Jul 2013 16:56 GMThttp://www.sencha.com/blog//top-10-ext-js-development-practices-to-avoid#id:33512#date:16:56Comment by MarcoHi Geoff,
‘arguments’ is a javascript related local variable existing in all functions.
see e.g. “https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/arguments”&nbsp; for detailsHi Geoff,
‘arguments’ is a javascript related local variable existing in all functions.
see e.g. “https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope/arguments” for details
]]>Fri, 12 Jul 2013 05:28 GMThttp://www.sencha.com/blog//top-10-ext-js-development-practices-to-avoid#id:33511#date:05:28Comment by GeoffInteresting (and apologies in advance if the formatting gets screwed)
This was one of the most detailed and informative explanations of some of the parts in in Extjs that get glossed over. However, you still skimmed over two concepts that everyone seems to ignore.
1)&nbsp; this.callParent(arguments);
The variable ‘arguments’ is this mythical beast that has no name space, yet it isn’t a global and just seems to hang around in its undocumented form. Is it required? Which of these is correct (as they both seem to work):
&nbsp; &nbsp; &nbsp; this.callParent(arguments);
&nbsp; &nbsp; &nbsp; this.callParent();
2) Ext.apply()
In your examples, you show 3 variants on setting config items and yet don’t seem to declare which is right or wrong. And they seem to conflict. So which is it? Whats the difference between these 3 examples:
Version 1
Ext.define(‘MyApp.view.MyPanel’,{
&nbsp; extend : ‘Ext.grid.Panel’,
&nbsp; columns : [{...}],
&nbsp; store: ‘MyStore’,
&nbsp; initComponent : function(){
&nbsp; }
});
Version 2
Ext.define(‘MyApp.view.MyGrid’,{
&nbsp; extend : ‘Ext.grid.Panel’,
&nbsp; columns : [{...}],
&nbsp; initComponent : function(){
&nbsp; &nbsp; &nbsp; this.store = this.buildStore();
&nbsp; &nbsp; &nbsp; this.callParent(arguments);
&nbsp; }
});
Version 3
Ext.define(‘MyApp.view.MyGrid’,{&nbsp; &nbsp;
&nbsp; extend : ‘Ext.grid.Panel’,
&nbsp; alias : ‘widget.customerlist’,&nbsp; &nbsp;
&nbsp; myCustomConfig : ‘xyz’,&nbsp; &nbsp; &nbsp; &nbsp;
&nbsp; initComponent : function(){
&nbsp; &nbsp; &nbsp; Ext.apply(this,{
&nbsp; &nbsp; &nbsp; &nbsp; store : ‘Customers’,
&nbsp; &nbsp; &nbsp; &nbsp; ….
&nbsp; &nbsp; &nbsp; });
&nbsp; &nbsp; &nbsp; this.callParent(arguments);
&nbsp; }
Version 2 is different from 1 because the store can’t be overridden by the instance of the class ( i think )
But what about 3? When should you use Ext.apply() ? And is this just a layover from the ext3 days that people aren’t giving up?Interesting (and apologies in advance if the formatting gets screwed)
This was one of the most detailed and informative explanations of some of the parts in in Extjs that get glossed over. However, you still skimmed over two concepts that everyone seems to ignore.

1) this.callParent(arguments);

The variable ‘arguments’ is this mythical beast that has no name space, yet it isn’t a global and just seems to hang around in its undocumented form. Is it required? Which of these is correct (as they both seem to work):
this.callParent(arguments);
this.callParent();

2) Ext.apply()

In your examples, you show 3 variants on setting config items and yet don’t seem to declare which is right or wrong. And they seem to conflict. So which is it? Whats the difference between these 3 examples:

Version 2 is different from 1 because the store can’t be overridden by the instance of the class ( i think )

But what about 3? When should you use Ext.apply() ? And is this just a layover from the ext3 days that people aren’t giving up?

]]>Fri, 12 Jul 2013 04:26 GMThttp://www.sencha.com/blog//top-10-ext-js-development-practices-to-avoid#id:33510#date:04:26Comment by RayeSo many brilliant tips for designing apps.&nbsp; These concepts are not only restricted to ExtJS.&nbsp; Thank you !!So many brilliant tips for designing apps. These concepts are not only restricted to ExtJS. Thank you !!]]>Fri, 12 Jul 2013 01:48 GMThttp://www.sencha.com/blog//top-10-ext-js-development-practices-to-avoid#id:33508#date:01:48Comment by VelExcellent points for each ExtJS developer to take note !. These are very common mistakes, developers overlook. Thanks for the post !.Excellent points for each ExtJS developer to take note !. These are very common mistakes, developers overlook. Thanks for the post !.]]>Fri, 12 Jul 2013 00:51 GMThttp://www.sencha.com/blog//top-10-ext-js-development-practices-to-avoid#id:33506#date:00:51Comment by Ramone HamiltonWe are currently working a new Ext application and I was saddened to see that we violate all three of these.&nbsp; I would have never known if it weren’t for this posting which has definitely been informative.We are currently working a new Ext application and I was saddened to see that we violate all three of these. I would have never known if it weren’t for this posting which has definitely been informative.]]>Fri, 12 Jul 2013 00:16 GMThttp://www.sencha.com/blog//top-10-ext-js-development-practices-to-avoid#id:33504#date:00:16Comment by DmitryGreat post. Right on the money!Great post. Right on the money!]]>Thu, 11 Jul 2013 20:24 GMThttp://www.sencha.com/blog//top-10-ext-js-development-practices-to-avoid#id:33501#date:20:24