コメント
「コードサンプルは結構凝っていますね、とりあえず入れたら計測できるという感じではなさそう」
「ドキュメントを読んで、少なくともTrace, Transaction, Spanを理解しておく必要がありそうでした」
「ある程度調べたい箇所が検討ついてて、深掘りしたい時に使えそうですね」

Recoil 0.2.0 Release

recoiljs.org

Better Async Selectors

Selectors を再実装して、これまで対応できなかった以下のようなケースにも対応したとのこと

Selectors can now add dependencies at any point in their async execution.

Selectors now start over if their dependencies change while they're awaiting something.

Diamond dependency patterns now re-execute only the necessary selectors.

Recoil で async selectors を使用する際に、正しくない動作をする可能性が低くなったらしい

Scaling to Large Numbers of Atoms

パフォーマンスが改善した
Atom が 10,000 個以上あった場合、数百倍も速度が早くなったとのこと

Breaking Changes

waitForAny の挙動が変わった
今までは引数に渡した処理がエラーを返すとエラーになっていた
0.2.0 から waitForNone と同様にそれぞれに引数に対応した Loadable が返るようになった
実装してみて理解できたので、参考にでもどうぞ↓

codesandbox.io

Logo

ようやく Recoil にもロゴができました
個人的に気になっていたので、ちょっと嬉しかった

f:id:yamataku3831:20210414184719p:plain

コメント
「細かいエラーハンドリングができるようになったということですかね」
「Atom が 10,000 個以上ってかなり大規模なWebやアプリだけど、YouTubeにある公式の紹介動画をみるとFigmaのようなアプリケーションを想定しているみたい」
「Zennって確かRecoilを使っているんでしたっけ」

zenn.dev

Reactのベストプラクティスの提案をまとめた記事、Tao of React

alexkondov.com

全部だと長いので自分が気になったところをとってきました

基礎的だけど大事なアドバイス
- Function Component, Hooksを積極的に使うこと
- ライブラリはラップして使用する
- 絶対パスを使用する
<ErrorBoundary> コンポーネントを使う
- 自身の子コンポーネントで発生した JavaScript エラーをキャッチ
- クラッシュしたコンポーネントツリーの代わりにフォールバック用の UI を表示できる
- 配下のツリー全体のレンダリング中、ライフサイクルメソッド内、およびコンストラクタ内で発生したエラーをキャッチできる

ja.reactjs.org

所感

シンプルさは正義
React, React Nativeはベストプラクティスが完全には固まっていないのでこういう記事はありがたい
意見を表明することは議論にもつながる
React Native Japan でもディスカッションとかしたいですね

コメント
「<ErrorBoundary> コンポーネントは使ったことないので勉強になった」
「react-native-error-boundaryというライブラリもありました」
「ErrorBoundary, 一応Rootコンポーネントに配置して使ってました (エラーキャッチしたらexpo-updatesのUpdates.reloadAsync()で再起動的な実装してました」
「Reactのベストプラクティス、2年前と今ではベストプラクティスが全然違うだろうし定期的にアップデートの必要がありますね」
「HooksのようなGame Changerも登場したしね」

www.npmjs.com

スター精密(株)がプリンター制御用SDKをRN向けに提供開始

www.nikkei.com

スター精密株式会社は東証一部上場企業で工作機械などのメーカー
React Nativeに対応したソフトウェア開発キット『StarXpand SDK for React Native』を、レシートプリンター業界において初めて作成した
SDKはGitHub上で公開されている

github.com

所感

ネイティブ開発でよくあるデリゲートプロトコルをJS (TS)で実装しているなど、SDKのコードを読んでみると興味深そう
JS層はネイティブの関数・メソッドを叩くラッパーに徹する、という設計だろうか

github.com

コメント
「アプリからプリンタを操作したりプリンタの情報を見たりできるということですね」
「モバイルPOS市場やフードデリバリー市場の動きを見ているのでUber Eatsなどの動きを見ている」
「クラッシュした時にエラーハンドリングしてエラー画面をプリンタで出力できそう」
「位置情報と連動して、ある座標に到達したら宝の地図が印刷されるとかできますね」

今月の React Native ライブラリ紹介

blog.bitsrc.io

明日から使えそうなライブラリ

enesozturk.github.io

f:id:yamataku3831:20210414183002g:plain

コメント
「iOSでテキストなどを長押ししたときに出てくるメニューのライブラリですね」
「Androidで似たような機能はあるのだろうか」
「React Native Reanimated v2 と Typescriptで書かれているんですね！しかもexpoで使えるのか」「モダンなライブラリですね」
「独自実装しているっぽいのでiOS 13以前でも使えそうですね（ネイティブだとiOS 14で実装されたアクションですね）」

react-native-paper

マテリアルデザイン標準のコンポーネントを提供するオープンソースライブラリ
クロスプラットフォームであり、完全なテーマサポートが可能
デフォルトのテーマにはダークテーマもあり、2つのテーマをシームレスに切り替えることができる
テーマをカスタマイズした場合は、ReactNativeのAppearanceAPI を使用して、デバイスの設定に応じてテーマの切り替えを実装できる

reactnative.dev github.com

React Native Snap Carousel

React Nativeのスワイパー、カルーセルコンポーネントであり、プレビュー、複数のレイアウト、視差画像、かなりの数のアイテムのパフォーマンス処理などを備えている
AndroidとiOSの両方に対応している
ライブラリは十分に文書化されており、パフォーマンスの最適化やその他の多くの機能に関するヒントやコツが含まれている

github.com

コメント
「どちらのライブラリもREADMEが充実していていいですね」
「react-native-snap-carousel, 前に使っていました！」