JavaScript UI framework comparison or Why I choose ExtJS & JQuery
Recently we’ve spent several days trying to decide which UI JavaScript framework/library to use. Our company is developing a media website with funky design which has a very complex admin panel with lots of crammed together pages. We were going to rewrite the admin CP’s UI from scratch because of it’s slowness and were searching for a solution that would require as small as possible effort to build a functional/comfortable admin panel and require only minor UI customizations. Also the library we use should have made our life easier when doing stuff on the main funky site. Well we couldn’t find a solution which will satisfy both this requirements instead we decided to use ExtJS for the admin CP and JQuery for the main site. The reasons behind this choice are listed bellow:
Why ExtJS for the admin CP?
- It’s faster than the other frameworks with complex UI elements we tried
- It’s look & feel is significantly better. Most of the UI elements have layout we’re not going to change at all for the admin CP. We don’t need a unique or beautiful design here we just need it to be acceptably good looking & comfortable. Ext provides this.
- The code was easier to write/read using Ext
- Was good documented and there were lots of tutorials written by the fans
Why JQuery for the main site?
- It’s very light. It sucks when the user has to wait for a “Loading” after opening the page. JQuery is about 20 Kb in total so there’s nearly no performance difference at all.
- It has lots of community built plug-ins for nearly anything. It’s true that JQuery lacks complex UI elements like ExtJS’s grid but we had no need for stuff like these on the website (the admin CP is another issue).
- The UI elements/plugins JQuery provides are easily customizable/editable because of their small size(in most cases).
Bellow is the result of our “research” on the subject.
QooXdo |
|
| Pros | Cons |
|
|
| We skipped this framework because it’s a bit too young. It doesn’t have a solid community and support (it’s opensource). Also it didn’t provide some of the functionality of the grid which was a requirement for us. | |
ExtJS |
|
| Pros | Cons |
|
|
| One of the leading JS frameworks on the market. I’d like to note that there has been quite a discussion on the internet regarding ExtJS’s license changes (these guys have changed the license 3 times making it more restrictive with each change. Now it’s GPL for non commercial use). Some people even claim ExtJS being an illegal software. Anyway if you’re concerned check out ExtJS Licensing Policy and google for rest(ilegality issues & stuff) ;) I personally do not belive in validness of any of those claims.
Regarding the point about no good solution in the field of error reporting & related stuff. I’m working with ExtJS for several months already and it’s a common thing for me to spend hours debugging ExtJS code trying to find out which parameter I passed to the library was wrong or something like that. Basically if you don’t supply a required parameter or give an invalid value to something you usually won’t be getting an ‘invalid parameter, blah blah blah should be specified” error. What you’ll be getting is usually a “blah blah is not a function” from the depths of ExtJS. After that you may spend hours trying to find out what really is the cause. The only solution to this is probably the experience of working with ExtJS which will not come fast :) Also don’t expect ExtJS to be fast. It’s slow but it’s faster that it’s opponents out there (at least at the time of my research I got this impression). It’s flexibility and the huge amount of customizable UI elements come at a cost – that’s it’s slowness & the time required to getting familiar with it. I’ll also add some links form the ExtJS website you may find usefull. |
|
JQuery |
|
| Pros | Cons |
|
|
| A good lightweight UI framework. For more details see the beginning of the article ;)
jQuery related Links follow jQuery plug-in catalogue ( but mainly you’ll be using Google in search of the plug-ins you want, this ‘list’ is not even close to being as good as Firefox’s or WordPress’s plug-in catalogue ) iQuery UI – a jQuery written & maintained library of UI elements for jQuery |
|
Dojo |
|
| Pros | Cons |
|
|
| This was the least researched framework. First of all what I didn’t like were the examples on their website. They look as if they need to be be tuned and pixel-perfected a lot before can be put to actual use. Also this proved some articles i found on the subject. Well honestly I’m a little surprised by the following chart showing that there are more dojo developer positions available.
Also you may want to check out the following pages: |
|
Backbase |
|
| Pros | Cons |
|
|
| This is a HUUUGE framework/taglib which has nearly anything that you’ll want to implement. It’s very flexible and really heavy. We decided not use this mainly because of it’s speed and complexity. The framework provides some options for speed up but we didn’t test it. | |
In the end i’d like to add that everything i wrote is my subjective opinion. Feel free to discuss it and disagree :)
Related links:
Wikipedia JS framework comparison page
JS framework speed comparison charts ( ExtJS not included )
Last Updated on December 15, 2009 – Modified jQuery & ExtJs section
very helpful :)
Indeed a very nice comparison!
Unfortunately some major frameworks like YUI, MooTools, Prototype are missing…
Check http://en.wikipedia.org/wiki/Comparison_of_JavaScript_frameworks for some nice information.
Bux, thank you. I’ll include that link in the article :)
Thanks. This review/comparison was very helpful. I will begin using JQuery based upon your review. It was good to have your opinion regarding debugging issues.
Nice comparison. Specially the pros and cons look neat. thanks
I also tried doing a basic comparison between the various frameworks here ( http://technoticles.com/2010/01/15/javascript-framework-comparison/ ) but need to expand the article, with more inputs like the ones that you have in your article about Dojo and Backbase.
Nice write-up. You clearly put a lot of work into it. I especially liked the lists of pros/cons which summarized things quite nicely.
Thanks a lot :) Your comments are also really appreciated :)
Very good comparison, thanks! You might also check dhtmlx ( http://dhtmlx.com ) , it’s quite a complete widgets library with good features and full docs. It’s GPL licensed like ExtJS.
This was a very helpful article.
As you stated, ExtJS is perfect for back-end apps and jQuery perfect for all that is lightweight and front-end. We use ExtJS with PHP Yii in a framework called Ext4Yii.