こんにちは、療養中の @martini3oz です。

Sencha から Ext JS 6 の GA が発表になってから、しばらく経ちますが、 このブログでは、まだ Ext JS 6 の話題を扱えていませんでした。

Ext JS 6 の目玉はいくつかあるのですが、最も大きな点は、Ext JS と Sencha Touch が「マージされた」ということでしょう。 以前から Sencha フレームワークをお使いの方は、「マージ」ってどういう風に？と思われることでしょう。 大まかに言うと次のようになります。

• Ext JS と Touch のクラスシステムの微妙な違いを統一した
• core パッケージという、共通部分を担うパッケージができた
• classic と modern という二つの「ツールキット」を用意した
• Sencha Cmd で、それぞれのツールキットを切り替えられるようにした
• microloader で実行するビルドを切り替えられるようにした

クラスシステムの微妙な違いはこまりものでした。UI に関係のない Model の定義ですら違いがあったので、Ext JS と Touch の両方で使うクラスを書くことはほぼ不可能でした。クラスシステムの統一と core パッケージによって、これが解消されたのは非常に大きな事です。

そして、Ext JS 5 は classic というツールキットに、Touch は modern というツールキットになりました。 ツールキットは、ビジュアルクラス部分で、それぞれデスクトップ用、モバイル用と分類されますが、別な視点で言うと、レガシー用、HTML5用とも言えます。 Ext JS 6 の現在のバージョンでは、modern の方は Touch をそのまま移植した程度のコンポーネントになっていて、classic にはあるけど modern にはないコンポーネントが多数ありますが、これも徐々に増えていくそうです。

この「マージ」によって、一つのソースコードでデスクトップからスマートフォンまですべてに対応したアプリケーションを作ることが可能になったのでしょうか。 現状で言うと、「限りなくそれに近い」という答えになります。 classic と modern は別個のツールキットなので、一つの製品のなかに両者を混在することはできません。 しかし、両者の共通部分は一つのソースコードで記述できます。 また、classic と modern という二つのビルドはできるのですが、microloader の働きで、アクセスしてきたデバイスに応じて、読み込むビルドを自動的に選択してくれます。

レガシーブラウザからスマートフォンまで、すべてのデバイスで動作する、ユニバーサルアプリケーションを作る方法について、以下、Sencha のガイド Developing for Multiple Environments and Screens を翻訳しましたので参考にしてください。(翻訳ミスなどみつけたら教えてください) 続きを読む →