はじめに
キッチハイクのエンジニアメンバーでReact Nativeの気になるニュースを持ち寄ってみました!
- はじめに
- iOS14リリース
- Shopify が実践しているソフトウェア品質担保 Tophatting (トップハッティング)とは
- RNコミュニティ公式のReact Nativeライブラリ検索ページ React Native Directory
- React Nativeのメンテナーによるパフォーマンス改善のリンク集
- Enable Hermes to work on iOS
- react native vs flutter
- iOSDC Japan 2020 が開催された
- さいごに
- We're Hiring
iOS14リリース
【React Native】 Xcode12でビルドするとiOS14で画像が表示されない問題に対処する - Qiita
コメント
「今回のiOS14リリースとそれにまつわるXcodeガチャといわれる問題は大変でした...」
「React Nativeを使っていてもiOSのリリースを気にする必要は当然ある」
「Webでいうとimage
タグが使えなくなるのと同じですもんね」
「React Native Communityではすでに問題を解決している人がいて頼もしかったです」
Shopify が実践しているソフトウェア品質担保 Tophatting (トップハッティング)とは
A vital part of the software quality process at Shopify is a practise called tophatting. Tophatting is manually testing your coworker’s changes and making sure everything is working properly before approving their pull request (PR).
Shopify での Software quality process での重要な部分は、Tophatting (トップハッティング)と呼ばれるプラクティスです。Tophatting とは、同僚の変更を手動でテストし、すべてが正しく動作していることを確認してから、彼らのプルリクエスト(PR)を承認することです。
要約
- Tophatting をスムーズに実践するために、開発者が数秒以内に仲間の作品を素早くロードできるようにするツールを作った
- もともと、ネイティブアプリの Tophatting 支援ツールは2年前に開発していた
- アプリのビルドをクラウドストレージに保存して、開発者はアプリを任意のタイミングでダウンロードできる
- React Native ではネイティブコード以外の変更はJSバンドルをロードすることで反映できることを利用した
- 新しくビルドされた JavaScript バンドルを保存するツールを開発し、React Native アプリが任意のバンドルを取得して、ほぼ即座に変更をロードできるようにした
- 新しいPRやコミットをトリガーに、CIでJavaScript バンドルをビルド。その後、ダウンロードできるQRコードを発行する
- 今回のRNアプリ Tophatting 支援ツールでは、認証とクラウドストレージとしてサードパーティのバンクエンドサービスを使った
コメント
「Shopifyのような大きなところも手動で動作確認しているんだな〜」
「E2Eや自動テストだけではないんですね、重要なところは手動なのか」
「WebでもHerokuを使えばHeroku Review App
という機能がありますね」
「アプリはビルドに時間がかかるので、即座に変更をダウンロードできるのは大きい」
「ネイティブ開発だと、忙しいときは裏技としてマシンを複数台使ったりしてました」
「エンジニアが100人いたら、動作確認準備が2分短縮されるだけでも200分ですもんね」
RNコミュニティ公式のReact Nativeライブラリ検索ページ React Native Directory
- TSの使用の有無や対応OSなどで検索ができる
- APIやJSONデータも公開している
- 検索結果の順番やデータが納得いかない場合はPRを送ってね!とオープンな姿勢 https://github.com/react-native-community/directory#i-dont-like-your-website-can-i-hit-an-api-instead-and-build-my-own-better-stuff
コメント
「calculate-score.js
,面白いね!issueがたくさん開いていると検索スコアが下がるのか」
「licenseがなかったりGPLでも検索スコアが下がるようになっているのは面白い」
「 .directory
っていうgTLDがあるんですね...」
React Nativeのメンテナーによるパフォーマンス改善のリンク集
The React Native Performance Compendium
- メンテナーのLorenzoさん( a.k.a. @kelset )が作成したパフォーマンス改善のリンク集
Library of Links
に以下がまとまっている- DevTools(ライブラリ、Gistのまとめ)
- Twitter's Post(Twitterの投稿)
- Documentation(公式ドキュメント集)
- Blog Posts(ブログ記事)
- 定期的にメンテナンスする予定なのでブックマークしておくとよさそう
- https://github.com/kelset/kelset/issues/1
- Githubレポジトリでコメントも募っている
コメント
「数が膨大!ツリー形式で見たいね」
「パフォーマンス改善については情報が多い、みんな気になっているんだ」
「ブログ記事はMediumの記事が多いですね」
「RNの流れが早いからパフォーマンス関連の知識も古びるのが早そう」
Enable Hermes to work on iOS
- React NativeのiOSでJS EngineにHermesを使えるようにするPRが出ている
コメント
「すごいね!ついにiOSのJS Engineが変更できるようになるってこと?」
「React NativeのRe-architectureが進んでいるっていうことなのか」
「Javascript Engineは名前が面白いのが多い、IEのJS EngineでChakraっていうのがお気に入り」
「インターフェースさえあれば好きなJS Engineが使えるっていうのはアツいですね」
react native vs flutter
そんな気はしてた pic.twitter.com/yGwb6MiGQp
— Issei Naruta (@mirakui) 2020年8月26日
コメント
「最近Flutter人気なんですね〜」
「Google Trend上だと、他のフレームワークを加えてみるとionic
がずっと優勢みたいです」
iOSDC Japan 2020 が開催された
- SwiftUI の導入事例の話や、SwiftUI 時代のアーキテクチャとフレームワークの話があった
- WEB, PWA, ネイティブアプリ, App Clips の使い所や組み合わせに関する話があった
- Flutter のトークが2つあった
リンク
- SwiftUI時代の Functional iOS Architecture by 稲見 泰宏 | トーク | iOSDC Japan 2020 - fortee.jp
- iOSアプリ開発のための"The Composable Architecture"がすごく良いので紹介したい by 今城 善矩 | トーク | iOSDC Japan 2020 - fortee.jp
- Webとネイティブアプリの付き合い方を改めて考える by kiwi | トーク | iOSDC Japan 2020 - fortee.jp
- Flutter移行の苦労と、乗り越えた先に得られたもの by 桐山圭祐 | トーク | iOSDC Japan 2020 - fortee.jp
- SwiftUIとFlutter by tamappe | トーク | iOSDC Japan 2020 - fortee.jp
コメント
「SwiftUIが少しずつ広まってきていて、注目されている」
「宣言的UIとアーキテクチャについてのスライド」
「ネイティブアプリ開発の話ですが、Reduxの名前が挙がっていますね」
さいごに
これからも社内で持ち寄った技術ネタを共有します!
We're Hiring
キッチハイクでは、React Native アプリエンジニアを募集中です!