Preparing for Ext 4.1 (Part 1)

Ext JS 4.0 has been out for almost a year now, if you can believe that (the 4.0.0 final release was April 26, 2011). There have been 7 minor releases since then, but most people have been waiting a while now for Ext 4.1, which will address a lot of the fundamental performance issues introduced in Ext 4 (primarily in older IE browsers), in addition to a few nifty new features as well. As of this writing, Ext is at 4.1 beta 3.

There is a lot of important information about the impending 4.1 release, and it’s spread across blog posts, forum posts, release notes, videos, etc. This not only includes information summarizing the major changes and new features in 4.1, but also detailing the breaking API changes.  Unfortunately, though minor releases should always retain backwards compatibility, the dramatic nature of the changes in 4.1 means that existing code will likely be impacted at some level.

I thought it might be useful to provide a roundup of the existing resources I know of for 4.1, but also to highlight some of the issues I ran into specifically while upgrading Calendar Pro to support 4.1.  Some of the issues I hit were probably atypical — as a custom component developer I tend to do a lot more private overriding than the average developer — but as such, it also makes for interesting discussion about dealing with more advanced edge cases and supporting multiple Ext versions.

Let’s start off by simply gathering together all of the best resources about 4.1 into one place. Hopefully this will be a valuable reference for anyone planning to upgrade from 4.0.

Blog Posts

  • Ext JS 4.1 Update: A few high-level summary statements about the performance issues, but mostly a mea culpa and marketing announcement. It’s there, but you can skip it :)
  • Ext JS 4.1 Performance Preview: The release announcement for the initial developer preview download, but also the first technical overview of the performance issues and 4.1′s strategy for dealing with them. Also includes the first preview of the new Neptune theme. Worth a quick look, but more detailed and useful performance posts soon followed…
  • What’s Coming in Ext JS 4.1: The first real meaty, in-depth overview of performance and new features for 4.1. In this post, chief performance guru Don Griffin outlines the new rendering pipeline and layout strategy, and if you do any nontrivial component development, you’ll want to really understand these sections.  He also introduces some of the major new features including new grid scrolling enhancements, new XTemplate features, BorderLayout improvements and the new syntax for overriding components. If you only read one post, read this one!
  • Optimizing Ext JS 4.1-based Applications: Don is back with this more advanced post on strategies that you, the developer, can take to mitigate performance issues in your own code. He also unveils the new Ext JS Page Analyzer and Grid Tuner utilities for taking performance into your own hands and really getting into the nitty gritty of analyzing your own app’s real performance across different browsers. Awesome stuff.


  • Ext JS 4.1 Performance Tips and Tricks: This is the recording of a screencast that Don and Animal did about application optimization and reviewing the new tuning tools outlined in the last blog post above. It’s a companion piece to that post, so you might choose one or the other depending on your preferred method for consuming info.
  • SenchaCon 2011: Ext JS 4.1: Layouts, Performance, and API updates: If you didn’t attend SenchaCon 2011, you may have missed this video. In it Don explains in great detail all of the major changes in 4.1. It covers similar ground to the blog posts, but I would highly recommend it still as Don does an excellent job explaining everything, and the interactive aspects of the slides really help to drive home the details about how the new rendering system works. The companion slide show is also online.


  • Ext 4.1 Forum: You may not have noticed that there’s an entire forum section dedicated solely to Ext 4.1 testing, bugs and feedback. It might be worth your time to scan through some of the threads there and see if anything jumps out at you.
  • 4.1 API Changes: This is a sticky thread in the 4.1 forum, but it might be easy to gloss over. In fact, it’s probably the single most important practical resource for every developer upgrading to 4.1, as it contains most of the landmines you’ll need to watch out for when upgrading.

If you know of any other official sources of information about 4.1 that aren’t listed here, please add them in the comments. Hopefully this is a pretty good start!

In part 2 I’ll discuss the issues I dealt with in upgrading the calendar to 4.1 and my strategies for effectively supporting multiple versions of the Ext API simultaneously in the same release (fun!).

See also: Part 2 | Part 3

This entry was posted in Ext JS and tagged , . Bookmark the permalink.

3 Responses to Preparing for Ext 4.1 (Part 1)

  1. The One says:

    Great one, Brian! I’m going to do a follow up post on this about how you can use the de-coupled DOM to your advantage when dealing with large ExtJS forms.

  2. Caleb says:

    “Unfortunately, though minor releases should always retain backwards compatibility, the dramatic nature of the changes in 4.1 means that existing code will likely be impacted at some level”

    Upgrading from 3.3 to 4.0 is a true nightmare because of these “breaking changes”. Lots of wasted time and money.

    Why do we have to endure this again in between 4.0 to 4.1, seriously?

  3. Brian says:

    Caleb, I appreciate your frustration. The 3.x -> 4.0 transition was definitely more disruptive than it needed to be. Although there have been some important changes between 4.0 and 4.1, they are mostly internal to the framework — the API and behavioral changes have been kept to the minimum required to address the serious performance issues that unfortunately exist in 4.0.x. The odds are good that you won’t be affected in any major way, but these blog posts are simply to point out that there are a few potential issues to watch out for.