Quick on the draw

In addition to ensuring that the way our application interacts with the server is always done in a timely fashion, we also need to be concerned with the speed at which the user interface renders and how quickly the browser draws the UI. There are a number of common pitfalls with Ext JS in this regard:

Overuse of panels

Panels have several features such as a header containing tool icons, the ability to be draggable, collapsible, and have docked items. In many situations, these features just aren't required. In this situation, a container is a much better choice. It's more lightweight in memory and the markup it generates.

Overnesting

Overnesting of containers and panels, particularly those implementing border layouts, are a very common source of performance issues, particularly if the user needs to move between various screens containing over-nested components. Ext JS needs to perform lots of calculations to build a viewport and the layout process is particularly...