View Full Version : Extending Components Vs Using the existing components

13 Dec 2010, 9:24 AM
Hi All,
Is it advisable to extend components than using the existing components. I understand if there are components that are reusable may be 10 to 15 places in an application then it makes sense to extend. If a component(same grid or same datefield) is not used more than twice extending doesn't make sense.
Please do advice me. And also does extending degrade the performance ?

Thanks in advance!

13 Dec 2010, 9:44 AM
Component extension is a large part of several design patterns used with Ext.

Checkout this excellent video from Jay Garcia on 'The dangers of Ext.getCmp()'. Near the end of the video, he covers the three main design patterns used when constructing Ext apps.


13 Dec 2010, 9:59 AM
Thanks for the quick reply Screamy,
I've seen this video before. And also other videos which explain extending is good if we've many components that are being reused.
1) Extending also has some global scope issues.
2) Extending degrade performance.

Saki's blog: http://blog.extjs.eu/know-how/writing-a-big-application-in-ext/

After going thru all these.

I kinda feel extending degrades performance, may be milliseconds but it does.
I'm just curious like what's the best approach.


Tim Toady
13 Dec 2010, 10:12 AM
Never preoptimize. Readability is far more important than shaving off a couple milliseconds. Using a javascript framework degrades performance. Why not just write the application in plain JS?

Most components provide a 'plugins' property (thanks to inheritance). Sometimes I find it preferable to use it to decorate an object rather than creating a new class. Can't tell you how performance compares, but it can be an alternative in some instances.

13 Dec 2010, 10:24 AM
Tim, I'm sorry if I didn't understand your response properly. That wasn't my question. If you've really worked on extending components you would know what I'm talking about. I'll give you a simple example.
1) Extend a Ext.Window() and use Ext.getCmp('').show() on clicking a button.
2) Configure a Ext.Window in the same javascript file where you've the button and click on the button to show the window and let me know which is faster.

Then you'll know what I'm talking about. May be in this scenario both take the same time in milliseconds.
Please don't try answer whatever comes to your brain. I like Ext JS and have been using it since 3 years.

13 Dec 2010, 11:21 AM
Sorry Tim, I didn't see your Edit:.
Creating new classes contradicts the basic purpose of using Ext JS.

Tim Toady
13 Dec 2010, 12:30 PM
Every time you extend an ext component you create a new class. I wouldn't say that contradicts the purpose of ExtJs. And even so, there still may be need to create a new class that doesn't inherit anything if Ext doesn't have what is needed.

The point of my initial post was, if you need to extend something, do it. A user doesn't notice milliseconds of time. I have extended components many many times and have not noticed a difference in performance. Sure there is overhead, but what difference does it make if it is not noticeable? If you need to only create one instance of something, then fine, create that instance. But if you need to reuse something, than extending an Ext component is a good option. Another good option for reusability I mentioned in my last post was creating a plugin.

Perhaps thats not what you are asking, but thats how I understood your post. Maybe you should rephrase your question if I am still off track.

13 Dec 2010, 1:09 PM
I kinda feel extending degrades performance, may be milliseconds but it does.
I'm just curious like what's the best approach.

Did you benchmark this? Results?

13 Dec 2010, 6:44 PM
I'm not against extending components. For some reason as a Developer I can see and feel that overhead. Not really sure if I'm correct.

13 Dec 2010, 9:23 PM

A user doesn't notice milliseconds of time.
Yes you are right. But the Performance Testing Team does! So what do u want me to respond to the Testing Team.

Tim Toady
14 Dec 2010, 5:56 AM
Code Complete can probably explain it better than I can

If they identify extending a component as a performance bottleneck than your project requirements are unreasonable. Honestly, there will probably be so many things that affect performance more than extending a component it won't even be given a thought. It is going to take far more time for your code/images/whatever to download than for the time it takes to extend a component.

But mankz is right, you really need to benchmark before you optimize.

14 Dec 2010, 6:47 AM
The most expensive process in ExtJS is the rendering, so I wouldn't place too much importance on whether extending components has a negative impact on user experience.

ExtJS is held back by poor javascript engines (IE8), so I would worry about maintainability first and then benchmark later on if you see a real performance hit (chances are there's something wrong in your code if this is the case).

14 Dec 2010, 10:07 AM
@ Tim
The Performance Testing team doesn't care where is the problem. They only care for the problem to be fixed. That was my concern.
Anyways based on all the responses I feel extending components is no harm and doesn't cause any performance issues.

Thank you all!