Managediframe - Ext Component and Panel classes dedicated to the task of managing IFRAMEs. Ever try to use an Iframe element as a '''writable''' body to Ext.Panel? Perhaps to render your own content in isolation from the rest of the host page, or just load another website in a tab panel. Getting an IFRAME into the right place in the DOM isn't too difficult, but updating its contents with Ext.Elements' update method is a challenge.
Ext.Element assumes the element it's managing has a innerHTML property. Well, IFRAMEs don't! So to make ''writable'' IFRAMEs easier to use within Ext framework, this extension overrides the default update method of Ext.Element(for the designated IFRAME) to provide exactly that sort of thing. Now, you can use: IFrameEl.update("<div>New content</div>"); meaning -- you can write any string content (replacing the entire document) directly to embedded document model of an IFrame. Features available UpdateManager.update and load support (to IFrames document). advanced scripting support. loadMask support. MIF.select('img',true).setOpacity(.5); or. Performance Comparison between Ext.isEmpty() vs plain JS.
Top 10 Practices to Avoid. Guest Blog Post At CNX, although most of our development work in the Ext JS space entails creating new apps from scratch, occasionally our clients ask us to look at some of their existing internal work to address performance issues, bugs and structural problems. Having worked in this capacity as “cleaners” for quite some time now, we’ve noticed a common set of ill-advised coding practices that tend to pop up rather often in the apps we’re investigating. Based on a review of our work over the last few years, we came up with this list of the top 10 development practices we recommend you avoid in your Ext JS apps. 1. Excessive or unnecessary nesting of component structures One of the most common mistakes developers make is nesting components for no reason. Example 1A. Example 1B. 2. Many developers wonder why their apps get slower and slower the longer they are used.
Example 2A. Example 2B. Example 2C. 3. Some developers like to break out controllers by view. Example 3A. Example 3B. 4. 5.
Sencha Touch coding guidelines you should follow: Part 1 - Innofied. I started working with Sencha in 2009. It was ExtJS back then and was only for web development. Once started, I immediately fell in love with the library because of its structure and beautiful widgets. However, the learning curve was very steep and only a handful of developers were actively working on it that time. There was hardly any good example or tutorial available on the web except Sencha’s examples and Saki’s blog. I remember posting in Sencha forum whenever I was stuck and used to get solutions and advises almost immediately from some great ExtJS developers like Animal (that is still his nickname in sencha forum), Saki, Jay Garcia (Author of ExtJS in Action, Sencha Touch in Action) and Ed Spencer.
Today the scenario is much different and Sencha is a large community now with a huge user base. 1. It is recommended to always maintain a Utility file in your application. Utility.js 2. Api method 3. Templates inside index.html Sample tpl 4. ShowActiveItem method. Leveraging PhoneGap within Sencha Touch. Leveraging PhoneGap within Sencha Touch by Ross Gerbasi | 20 Nov 2013 | PhoneGap Blog, Guest post Introduction With the release of Sencha Touch 2.3 and Sencha CMD 4 creating your cross platform hybrid applications has never been easier. PhoneGap is now a first class citizen in the Sencha Touch mobile workflow integrating seamlessly into the newly released, NodeJS based, PhoneGap command line interface.
For a in-depth look at creating an application with Sencha Touch and PhoneGap, or Cordova, check out the Sencha & PhoneGap Video Tutorial. Creating Your Application Once you have downloaded the Sencha Touch 2.3 framework and installed Sencha CMD you can quickly generate an application with the following command. //sencha generate app [path/to/app] [AppName] $ sencha generate app ~/Desktop/MyApp MyApp To add PhoneGap support to any application, that is Sencha CMD 4 ready, you run the following command with the optional APP_ID and APP_NAME arguments. Folder Structure Custom Configuration Development.