Roundup SenchaCon 2015 Roadshow Karlsruhe

It has been quiet around here for quite some time. We were busy upgrading our frameworks, build processes and deployment tools to ExtJs 5. An awesome experience: much cleaner code, a faster UI, and tons more.

But what I want to talk about today is already ExtJs 6 — my impressions from the SenchaCon 2015 Roadshow in Karlsruhe, from which I have just arrived home.

Sencha has announced that they have merged ExtJs and SenchaTouch into a single framework. Something the community has been waiting for for a long time — but hard to solve from a developer and UX/UI perspective. If you have ever tried to run a single application on different platforms with different behavior, you know what I am talking about.

Sencha seems to be going a route similar to Apple's iOS universal strategy: shared source for models and controllers, and platform-dependent views. At first glance a good idea. But Apple uses this for similar platforms, and there are only two of them: phone and tablet. Sencha has to manage this for a third one: desktops. Others may also think about TVs as a fourth option, or even the new wearables like the Apple Watch, sports bands, and so on.

In my opinion, Sencha does not solve this particularly well. They have moved the old ExtJs views out into a new folder structure now called classic. It is also intended to address issues with legacy browsers as a short- to mid-term solution until everybody supports Html5 well. The duplicated view structure under modern represents the views that used to be the SenchaTouch part (or rather the new Html5 stuff). These are built entirely with Html5/Css3 features.

Sencha now supports building hybrid apps in such a way that you can decide which build configuration uses the classic toolkit (ExtJs view style) and which one uses the modern toolkit (SenchaTouch view style). The core is mostly based on ExtJs5. I assume touch events are now much better supported, at least. Migration may be a bigger pain for SenchaTouch apps than it looks to be for ExtJs5 apps, I suspect.

A closer look at the build and file structure shows that hybrid means you can only build two platform variants. Anything beyond that has to be solved via responsiveConfig and platform configs. There is no way to really build different app behavior for desktop, tablet and phone (only two of them can be truly different). You can already achieve that yourself today in a SenchaCmd5 workspace with ExtJs5 and SenchaTouch 2.3. One of the speakers said: "you have to cleanly decouple your code for that anyway". So if you have already wisely decided to decouple your business logic into separate packages, you can easily provide this today. Of course, ExtJs6 will also bring other new cool things you won't want to miss.

Some other cool things were shown there as well. There will be a nice plugin for JetBrains IDEs like PHPStorm, WebIDE, and others to properly manage ExtJs sources: nice code completion, SenchaCmd integration, and more. Other IDEs should follow.

Fashion is a from-scratch Sass compiler written in pure JavaScript by Sencha. It replaces the need for Ruby, which seems to be a big pain on Windows (I don't know, I have never developed on such a thing). Because it is pure JavaScript, it compiles in a phantomjs backend and also brings instant updates during development. So you can change a value in scss files and within seconds the css is magically replaced on your open page. Really nice for theme building. BUT it adds another proprietary piece to the puzzle. Of course you can view and inspect the JavaScript source within SenchaCmd, but whether they will release it as open source is not clear yet. Nor is how compatible it will remain with standard Sass. Compass is not part of it either. They add some of its functionality, but not all. The coolest thing is that you can now easily add functionality yourself, written in JavaScript instead of Ruby — at least you should know that language better. Keep in mind that the instant css update only works if you develop with and use the web server started internally by SenchaCmd. It is really damn fast. If you need slicing, it no longer requires a second run for slicing either.

They also provide a new standalone inspector. This one works well with all browsers. Instead of having it as yet another browser-slowing-down plugin, it is a standalone application communicating with open browsers. It nicely presents what you have on your page, with live changes/updates possible. They are even thinking about updating your source based on changes made in it, or hopefully at least producing a changelog. So you can play around, and after some trial and error you will know which changes to make in your code.

All in all, it looks like another cool improvement — worth spending some time on and migrating to as quickly as possible. The beta should be available from today. So go ahead, start playing and have fun.