I’am modernizing a legacy web application, with its frontend based on ExtJS 3.x.
Currently, user interface depends on large file of several thousand lines, with too many nested anonymous functions, encapsulated in an global `Ext.onReady()̀ per file. It’s ugly, unreadable and not maintenable.
To maintain code and modernize it, I want gradually refactorize it by :
- using namespaces
- exploding big files : one class per file (grid, store, form …)
- organizing class files in a good directory structure (app/module/grid|store|…)
- loading dynamically class files, when required (maybe with Ext.Loader.load() ?)
- optimizing loading by using minifier, as assetic, if possible (in a next step).
All these problematics seems natively solved in ExtJS 4, with its class Loader, its dependency system (
Application Singleton and its structure folder conventions…
In ExtJS 3, it seems more confused. So :
- What are the best practices in extjs 3 to organize code “like” in extjs 4 ?
- Do you have clear examples illustrating these problematics ?