Edited at

ReactNativeを使ってみて辛かったこと

More than 1 year has passed since last update.

ReactNativeとは、Reactの記法を使ってネイティブのiOS/Androidアプリを作ることができるSDKです。

https://facebook.github.io/react-native/

今回は、ReactNativeを初めてつかってアプリを作ってみて、主に「つらみ」の部分の感想です。(2016年9月時点)

ReactNativeを採用しようと考えている際の参考にでもしてください。


今回作ったアプリ

スクリーンショット 2016-09-11 17.21.37.png

弊社の「リピ店」という、近くの飲食店を検索できるアプリのAndroid版を作りました。iOS版がすでにリリースされているので、今回は勉強用にiOS版をReactNativeで作り変えしつつ、Androidをそのままマルチプラットフォームで作りました。ちなみに、リリースできるほど完成度が上がってない状態でつくりっぱなしになってます。

https://github.com/kitagawa/RepeatenReactNative


1. バージョンを合わせるのがつらい


  • ReactNativeのバージョンが頻繁にリリースされる

    ReactNativeは絶賛開発中なので、2週間ごとに新しいバージョンがリリースされています。最近はほとんどなくなりましたが、たまに破壊的な変更があるのが辛い。


  • 外部ライブラリがReactNativeのバージョンの更新に追いついていない

    ReactNativeのバージョン更新が早いので、外部ライブラリが使用中のReactNativeのバージョンに対応しているとは限らないです。とくに破壊的な変更があった前のバージョンで作られたライブラリだと最新バージョンだと使えないのが辛い。


バージョンが合っていないとこうなります。


  • ビルドするとエラーがでる

  • リリース版をビルドするとエラーがでる

  • iOS版はビルドできたけどAndroid版がビルドできない

外部ライブラリを追加するごとに悩まされたり、そのバージョン自体にバグがあって上げなければいけない、ということもあって辛かったです。

バージョンを固定して進めるか、定期的にバージョンをあげつつビルドが通ることを常に確認しておきましょう。


2. Android側の対応が弱くてつらい

基本的にiOS側の方がコンポーネントが充実しています。「~IOS」はあるけど「~Android」はないという場合がわりとあります。コンポーネントが両対応しているかよく確認しておきましょう。


  • ルーティングは「Navigator」

    「NavigatorIOS」はありますが、Android版はありません。両方対応する場合は「Navigator」を使うことになります。ちなみにNavigatorIOSの方がパフォーマンスはいいそうです。


  • 地図が使えない

    ドキュメントにありますが、MapViewのコンポーネントはiOS側しか対応していません。Androidで使うには外部ライブラリのreact-native-mapを使うのが推奨されています。このライブラリも癖があってちょっと手こずりました。。



さいごに

だいたい大きく辛かったのはこんなところです。また他にあったら追記します。

ReactNative開発の悪い点ばかりあげてますが、良い点も結構あったので感想を少し。


  • パフォーマンスがやはり良い

    WebViewではなくネイティブで動いているということで、やはり普通のネイティブアプリに負けないくらい違和感なく動きます。


  • iOS版とAndroid版で画面崩れが少ない

    iOS版を作ってから、そのままAndroid版を動かしてもわりとスタイルが崩れることもなく、ほぼそのままいけました。