What’s New in Ext JS 6
Merged Framework – You can now use a single framework for creating applications that run across all types of devices, from phones to tablets to desktops.
Triton Theme – This is our newest theme, which provides comprehensive support for font icons. Using Triton, you can easily control the size and color of your icons and images without needing to rework on them in image editors.
App Templates – This is our newest approach to provide you higher level abstractions around building web applications. You now have full-blown real-world application templates that you can use out-of-the-box, instead of assembling individual UI components.
Sencha Pivot Grid – It was introduced just a few months ago, and has been upgraded to work with Ext JS 6. We’ve also made major enhancements to its configurator plugin.
Accessibility Improvements – We have integrated the ARIA functionality directly into the component lifecycle, which means you will no longer need a special “aria” package to make your applications accessible.
Sencha Cmd – We are also rolling out Sencha Cmd 6 to support Ext JS 6 development. Sencha Cmd 6 has undergone a major overhaul to eliminate dependencies and improve the installation experience. The Sencha Cmd installers now carry appropriate versions of JRE with it, so you don’t have to download and install it separately.
JetBrains IDE Plugin – We are releasing a plugin that creates confluence between Sencha frameworks and JetBrains IDEs. The plugin enables code completion, inspection, and navigation, and much more, while seamlessly enabling JetBrains features for the Sencha frameworks.
Sencha Inspector – We are also providing Early Access to Sencha Inspector, a debugging tool that provides direct access to components, classes, objects, and more for apps built using Sencha frameworks in a debug environment.
See It In Action!
View the Sencha Ext JS 6 examples on any device
Download the free 30-day trial of Sencha Ext JS 6
Learn more about Sencha Ext JS 6 with our guides and documentation
Check out the new Sencha Ext JS 6 pricing and packaging
Sign up for Sencha Ext JS 6 Training
Deep Dive into Sencha Ext JS 6
You can create applications that run across all types of devices, from desktops to tablets to smartphones. Ext JS 6 allows you to blend the best of both worlds (desktop and mobile) to produce optimal user experiences for your target devices and share maximum amount of code at the same time.
The process of merging Ext JS and Sencha Touch has come a long way. In Ext JS 5, we created a core that combined the classes, loaders, DOM, data package, MVC/MVVM, and many utilities into a common package. The final step of merging the Sencha Touch UI components required a home for the distinct aspects of the two frameworks. To differentiate the UI component families from each other, in Ext JS 6, we are calling them “toolkit”. The UI components of Ext JS are now contained in the “classic toolkit” of Ext JS 6, while the UI components of Sencha Touch are contained in the “modern toolkit”. You can now create universal applications that utilize both the toolkits and create a single application that targets mobile devices like smartphones and/or tablets (using the modern toolkit) and desktops/laptops running IE8 and/or tablets (using the classic toolkit).
The new Triton theme is our first Ext JS theme to provide comprehensive support for font icons. Many of the icons used in Triton are from Font Awesome with some useful additions to complete the ensemble.
By using the Triton theme, developers can easily control the size and color of icons in their apps because they are based on scalable vector fonts. With font icons, you don’t lose quality when they are scaled up or down. Also, because you don’t have to make multiple http requests for each image, it improves network load times. And best of all, you no longer need to rework your images using image editors.
We are also introducing higher level abstractions of our framework components into what we call App Templates. These are full-blown application examples that you can use out-of-the-box, instead of assembling individual UI components. They are designed to reflect real-world use cases of how your applications might look, and give you a much better starting point.
We have included several pages in our Admin Dashboard template that include a dashboard page, profile page, widgets page, charts page, standard login page, registration pages, and more. By using these templates, you get highly-optimized code with the best architecture and coding practices that we recommend to our developers.
App Templates not only provide a better starting point, but also demonstrate the infinite possibilities for styling your Sencha applications with very little effort and creating compelling user experiences.
Sencha Pivot Grid
As part of Ext JS Premium, the Sencha Pivot Grid component enables rapid summarization of large sets of data often presented in Ext JS grids. It provides a simple way to condense many records into summary reports, either in the form of canned reports (produced using code), or via the configurator plugin that users can utilize to slice and dice their Ext JS grid data.
We have not only updated the namespace and created a single pivot grid package, but also enhanced the configurator plugin to provide a more intuitive interface for the end users to analyze their Ext JS grid data. Sencha Pivot Grid also comes with a drilldown plugin that allows the users to drill into the raw records that form any resulting aggregations. Pivot Grid is also integrated with Sencha Charts, so you can create intuitive data visualizations within your reports. With the Sencha Pivot Grid, we have also included an excel export plugin package that allows users to export the results into Microsoft Excel spreadsheet.
For the first time since we added the accessibility support to the framework, Ext JS 6 integrates the ARIA functionality directly into the component lifecycle. You no longer need a special ARIA package to get the proper accessibility support. Ext JS 6 applications support screen readers such as JAWS, and NVDA by default.
A new ‘actionable mode’ is available for the Ext JS grid, which allows keyboard navigation for all kinds of grids, including the contents of a grid cell. An added benefit of bringing this functionality down into the core of the framework is that users, who do not have specific accessibility needs, get more power to navigate any parts of a grid via the keyboard.
Sencha Ext JS 6 includes a standards-based implementation of Promises that conforms to the Promises/A spec and tests suite. A big thanks to the DeftJS team for contributing their field tested implementation of promises to the core of Ext JS 6. We have started with incorporating promises in the Ext.Ajax.request() within Ext JS 6, and in future releases we will incorporate promises support in many other areas of the framework.
Sencha Cmd 6 comes with Ext JS 6, and we have enhanced the installers to include the Java Runtime Environment (JRE). You no longer need to download and install Java separately. We have also removed the Ruby dependency, so there are literally no prerequisites for installing Sencha Cmd, beyond the operating system.
Further, to facilitate code sharing with packages, Sencha Cmd 6 introduces different folders for packages you generate vs. the packages you require. The location for packages can now be configured with the introduction of the ‘workspace.json’ file. With Sencha Cmd 6, the Microloader (application loader) has undergone major updates, and even provides support for localStorage caching.
JetBrains IDE Plugin
We are also launching an entirely new plugin that creates a confluence between Sencha frameworks and JetBrains IDEs. The plugin integrates the Sencha frameworks with the JetBrains IDEs seamlessly in the form of code completion, code inspection, code navigation, template creation, refactoring, and many features, while cooperating with native JetBrains IDE functionalities.
If you are a Sencha framework expert, you will love the ease with which changes are refactored using the JetBrains plugin and how simple it is to trace your code to the source. For new users, it provides completion suggestions while encouraging best-practice code structure and syntax. Sencha JetBrains Plugin works with commercial versions of IntelliJ 14.1+, WebStorm 10+, and PHPStorm 9+. And best of all, the Sencha JetBrains Plugin enables all of the above for not only Sencha Ext JS 6, but even earlier versions of our frameworks from Ext JS 4+ and Sencha Touch version 2+.
With this release, we are also providing Early Access to Sencha Inspector, which is an entirely new debugging tool that provides direct access to components, classes, objects, and more for apps built using Sencha frameworks. It also lets you analyze your application code for issues, such as overnesting of components, and helps improve your application performance.
Sencha Inspector even let’s you theme your applications by inspecting and modifying the Sencha Sass-like code in near real-time. Sencha Inspector will be a component of Ext JS Pro and Premium.
Guides and Documentation
As always, with Sencha Ext JS 6, we have included over a dozen updated guides for new features, enhancements, upgrades, and more. We mentioned above some of the most significant updates in Ext JS 6, but there’s a lot more to talk about. You can explore the other new features, enhancements, and improvements in our What’s New in Ext JS 6 guide.
Pricing & Packaging
We are introducing new product packages to ensure you have choices available for your specific needs. We recommend you check out the new pricing and packaging, as well as the transition plan for existing customers.
We wish to extend our heartfelt thanks to our community. Your constant feedback on a single framework and bug reports during the Early Access and Beta programs have made it possible for us to achieve this huge milestone. We hope you enjoy building universal apps with Ext JS 6, and upgrade your existing Ext JS and Sencha Touch apps to this single unified version and make them universal.