What Is ExtJS ExtJS 4+ Extensions Examples Tutorials

31Jul/140

shrinkWrap in ExtJS 4 and 5 Containers

ExtJS Containers and Panels are typically sized by their parent container's layout. Traveling up the layout chain typically leads to a Viewport, which occupies the available screen space; i.e. (view in Sencha Fiddle):

sample viewport

Now what about those times when you want to use these beautiful panels as the actual content, rather than as holders of other content? In other words, how can we make the Panels size based on their content (rather than as dictated by their parent's layout)? The end result might look something like this:

sample panel shrinkWrap

Read on to find out how its done and what caveats exist...

VN:F [1.9.22_1171]
Rating: 9.3/10 (6 votes cast)
21Apr/140

ExtJS5 has 3 different scrolling systems?

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?

  1. For traditional "mouse-only" desktops - using the native browser overflow: scroll
  2. For mobile "touch-only" devices - using Sencha Touch's kinetic "momentum" JS scrolling
  3. 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...

VN:F [1.9.22_1171]
Rating: 8.4/10 (5 votes cast)
Tagged as: , , No Comments
18Apr/140

ExtJS5 vs ExtJS4 Config System

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.

ExtJS5 config

VN:F [1.9.22_1171]
Rating: 9.7/10 (3 votes cast)
21Mar/140

Full Async Stack Trace when Debugging

vs

I've been wishing for this for a long time and the fine folks at Google delivered. Imagine being able to see the full stack trace when debugging, i.e. when tracing against an AJAX or a setTimeout()! You can do this in Chrome Canary already; read on for how to set it up:

VN:F [1.9.22_1171]
Rating: 10.0/10 (4 votes cast)
27Feb/141

ExtJS vs. AngularJS

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?

  1. If an important objective is fast page load times (i.e. landing page), I would go with a lean stack on top of AngularJS
  2. However, if I'm building an enterprise portal with a ton of UI and functionality, I would probably go with ExtJS
  3. 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.
VN:F [1.9.22_1171]
Rating: 10.0/10 (10 votes cast)
Tagged as: , , , 1 Comment
Page 4 of 14« First...23456...10...Last »