Diving into ExtJS 5 and talking to some of the engineers behind it I'm forming the conclusion that there are 3 distinct scrolling systems being employed in ExtJS 5. What are they?
- For traditional "mouse-only" desktops - using the native browser overflow: scroll
- For mobile "touch-only" devices - using Sencha Touch's kinetic "momentum" JS scrolling
- For hybrids that have both mouse and touch support (i.e. MS Surface or Google Pixel) - using some sort of a hybrid of #1 and #2 where the JS kinetic scroller kicks in on tap-drag
I'd love to dissect this on an HTML level...
With ExtJS5 beta announced last week there were clear efforts on behalf of ExtJS 5 to behave closer to Sencha Touch in regards to utilizing the unique and powerful config system. Last year I wrote ExtJS vs. Touch Config System article to highlight some important differences. Today I'd like to explore this topic in the context of different versions of ExtJS 4 and ExtJS 5 beta.
I've been meaning to say a few words about this for a long time: stop comparing ExtJS to AngularJS!
It's like comparing a car to a tire:
- One is not better than the other; it's an invalid comparison
- If you need a car, you probably shouldn't buy just the tire
- If you need just a tire, you probably shouldn't buy an entire car
Consider this: minified version of ExtJS 4.2.2 is 1.4 MB (ext-all.js) and that's not counting all the CSS and resources. By contrast, AngularJS 1.2.13 is just over 100 KB.
Now when I'm calling AngularJS a "tire" what I mean is that if you are building an app of any magnitude, you will probably be bundling it with some other libraries. I'm guessing many newer apps will have a bare minimum of AngularJS + jQuery + Bootstrap.
So, when would I chose one over the other, if I were equally proficient in both?
- If an important objective is fast page load times (i.e. landing page), I would go with a lean stack on top of AngularJS
- However, if I'm building an enterprise portal with a ton of UI and functionality, I would probably go with ExtJS
- Now how about both? I've built apps that had a lean landing page with just jQuery that would then transition to the "app" in ExtJS; I think LastPass is an excellent example of that.
A few years ago I wrote about ExtJS4 Dev Tools of a Pro, where I mentioned a FireFox plugin called Illuminations. Since then I've switched to Chrome as my dev platform where I missed my cherished Illuminations plugin.
I believe only last week the creators of FF's plugin have released a version for Chrome: https://chrome.google.com/webstore/detail/illuminations/hbhnkfhblakpfhcpepeoogmakimflibk
It doesn't feel like a full port, but it does have the one feature I care most about: similar to how you can right-click on a page and "Inspect Element" to bring up dev tools and pinpoint the target in the DOM tree, you can now right-click and "Illuminate:"
At which point you will pinpoint the target in the Ext component tree:
Combined with Sencha Inspector for Chrome, the Chrome browser is now a powerhouse for ExtJS/Sencha Touch development!