新しいハイブリッドアプリケーションのフレームワーク「React Native」をFacebookが公開。React.jsの書き方でOSネイティブのUIを利用可能

「FacebookではReact Nativeを以前から本番環境で使ってきた」（We've been using React Native in production at Facebook for some time now）。Facebookは、モバイルアプリケーション向けのフレームワーク「React Native」をオープンソースで公開しました。

React Nativeは、JavaScriptおよび同社がすでにオープンソースとして公開している「React」でモバイルアプリケーションが開発できるフレームワーク。Web技術を用いつつもモバイルOSのネイティブなUIコンポーネントを利用できるのが最大の特長で、これによってWebViewをベースにしたハイブリッドアプリケーションよりも優れたユーザー体験を提供するモバイルアプリケーションが開発できるとしています。

iTunesに登録されているFacebookのモバイルアプリケーション「Facebook Groups」は、ネイティブコードとReact NativeのJavaScriptで構築されており、「Facebook Ads Manager」は完全にReact Nativeで構築されているとのことです。

learn once, write anywhere

Web技術を用いてモバイルアプリケーションを開発する方法としては、WebViewをラップするCordovaがよく知られています。しかしReact Nativeを開発した理由について、Facebookの記事「React Native: Bringing modern web techniques to mobile」で次のように説明されています。

Even though developing native mobile apps takes longer, there are many reasons why we can produce better experiences on the mobile platforms than we can on the web. For one thing, we have access to platform-specific UI components, like maps, date pickers, switches, and navigation stacks. It's possible to reimplement these components on the web, but our reimplementations never feel exactly like their native counterparts, and they also don't get updated automatically with changes to the platform.

ネイティブモバイルアプリケーションの開発には時間がかかるが、Webよりも優れたユーザー体験を実現できる多くの理由がある。1つ挙げるとすれば、マップやデータピッカ、スイッチなどのプラットフォーム固有のUIコンポーネントを利用できる。Webでもそれを再実装することはできるが、ネイティブコンポーネントとまったく同じにはならないし、プラットフォームのアップグレードによって自動的にアップデートされることもない。

React Nativeはこうした理由で、開発効率の良いWeb技術のJavaScriptと優れたUI構築のためのフレームワークであるReactを用いてネイティブアプリケーションを構築するを開発できるようにしたものだということです。

ただし、Web技術をベースにしたモバイルアプリケーションは、1つのアプリケーションがiOSにもAndroidにもWindowsにも展開できるクロスプラットフォーム対応を利点の1つとして挙げることが一般的ですが、React Nativeはそうではないと説明しています。

It's worth noting that we're not chasing “write once, run anywhere.” Different platforms have different looks, feels, and capabilities, and as such, we should still be developing discrete apps for each platform, but the same set of engineers should be able to build applications for whatever platform they choose, without needing to learn a fundamentally different set of technologies for each. We call this approach “learn once, write anywhere.”

“write once, run anywhere.”を追求しているわけではない、ということは強調しておきたい。異なるプラットフォームには異なる見かけ、フィーリング、機能といったものがある。私たちは、それぞれのプラットフォームごとに適したアプリケーションを、そうしたプラットフォームごとにそれぞれ大きく異なる技術をいちいち学ぶことなく開発しなければならない。私たちはこれを“learn once, write anywhere.”と呼んでいる。

いちどReactの書き方を学べば、ほぼ同じ方法でどのプラットフォームでもネイティブなUIコンポーネントを用いてモバイルアプリケーションのプログラミングができる、というのが、React NativeでFacebookが実現しようとしたことであり、これが従来のハイブリッドアプリケーションと位置づけが異なるところです。

参考

• reactjs - React Native ファーストインプレッション - Qiita
• React Nativeがスマホアプリのフロント開発を変えるのか - ワザノバ | wazanova