Jotai v1.3.4をリリースしました・Recoilのユースケースをカバーする機能追加・React状態管理ライブラリ


(何箇所かでloadableをlodableとtypoしてしまいました)

主に2つの機能が入りました。

loadable utilの追加

Jotaiのasync atomsはSuspenseの利用を前提としていますが、Suspenseを汎用利用するAPIはまだリリースされておらず厳密にはexperimental扱いです。そのため、Suspenseを使わずにJotaiを使いたいという要望は以前からありました。これまでもいくつかの対処法を示してはいたのですが、今回 loadable というユーティリティ関数を追加することで本格的に対処した形になります。この機能はコントリビュータの方の助けによって実装されました。これまでRecoilからJotaiへの移行をする場合の課題となっていたようです。

debugLabel を自動付与するBabelプラグインの追加

JotaiはRecoilと違ってstring keyを持ちません。これは、Recoilで、

const countState = atom({
  key: 'count',
  defaultValue: 0,
});

と書くところを、Jotaiでは、

const countAtom = atom(0);

と書けることになります。countAtomは参照で区別されるため、string keyは必須ではないのですが、DevToolsなどで表示する場合に、開発者が区別しにくいという問題がありました。

当初より、これを解決するために debugLabel というプロパティが存在して、

const countAtom = atom(0);
countAtom.debugLabel = 'countAtom';

と書くことで、付加的に文字列をつけることが可能でした。ちなみに、NODE_ENVなどを使えばプロダクションコードには含めないようにもできます。また、debugLabelはstring keyとは違い一意性も必要としません。

しかし、毎回debugLabelを書くのは面倒なもので、そもそも当初の便利さが減ってしまいます。そこで、Babelプラグインで自動的にdebugLabelを付加するような機能を実装しました。これは、まだexperimentalですが、基本的なケースでは動作することが確認できています。おそらくうまく動かないケースもあるとは思いますが、今後の改善に期待です。

一つ残念なのは、Create React AppではBabelプラグインを追加できないため、それ以外の環境で開発することになります。ParcelとNext.jsでの動作は確認しました。

おわりに

実はどちらの機能もまだドキュメント化が進んでおらず、今試そうとすると、PR等を読む必要が出てきます。早急にドキュメントも整備したいところです。

ところで、どなたか、OSSコントリビューションに興味ある方などいらっしゃいませんかね。