メインコンテンツにスキップ

Recoil 0.0.8

·読むのに4分

本日、Recoil 0.0.8をリリースします。バグ修正と新機能が含まれています。このリリースに貢献してくれたすべての人に感謝します!多くの人が貢献してくれたことは素晴らしいことです。

バグ修正

  • 自己参照構造を格納するアトムが無限ループを引き起こすバグを修正しました。(@n3tr in #153)
  • サーバーサイドレンダリングに影響するバグを修正しました。(@sbaudray in #53)
  • ビルドシステムとリポジトリの同期に関する問題を修正しました。多くの人がこれに貢献しました。特に@mondaychen、@claudiopro、@dustinsoftware、@jacques-blom、@jaredpalmer、@kentcdodds、@leushkin、@tony-goなどです。JestとFlowを内部とOSSで同じように動作させることが残っています。

機能

TypeScriptのサポート

TypeScriptの定義は、DefinitelyTypedリポジトリから入手できるようになりました。

atomFamilyselectorFamily

これらのユーティリティは、関連するアトムまたはセレクターのコレクションを、パラメータの値ごとに1つずつ作成するのに役立ちます。アトムまたはセレクターを返すメモ化関数を手動で作成する代わりに、atomFamilyselectorFamily を使用できます。将来的には、これらのユーティリティはメモリ管理にも役立ちます。

atomFamily 関数は、あるパラメータからアトムへの関数を返し、渡されたパラメータの値ごとに新しいアトムを作成します。たとえば、ID で識別されるコレクションの各メンバーの座標セット {x: number, y: number} を格納したいとします。その場合は、次のように記述できます。

const coordinatesForID = atomFamily<{x: number, y: number}, ID>({
key: 'coordinatesForID',
default: {x: 0, y: 0},
});

そして、その状態に次のようにアクセスします

function MyComponent({id}) {
const [coordinates, setCoordinates] = useRecoilState(
coordinatesForID(id)
);
...
}

coordinatesForID に渡された各 ID は、座標を含む独自の独立したアトムを取得します。これらのアトムはそれぞれ独自のサブスクリプションを持っているため、単一の ID の状態を使用するコンポーネントは、その1つの ID の変更のみにサブスクライブされます。

同様に、selectorFamily を使用すると、パラメータの値ごとに異なるセレクターを作成できます。たとえば、これらの座標をそれぞれ180度回転させたいとします。

const rotatedCoordinatesForID = selectorFamily<{x: number, y: number}, ID>({
key: 'rotatedCoordinatesForID',
get: id => ({get}) => {
const coordinates = get(coordinatesForID(id));
return {
x: -coordinates.x,
y: -coordinates.y,
};
}
});

セレクターファミリの get プロパティは、パラメータ(この場合はID)を受け取り、単一セレクターの get プロパティと同じシグネチャを持つ関数を返す関数であることに注意してください。一般に、これはアトムファミリとセレクターファミリのすべてのオプションの動作方法です。

並行処理ヘルパー

非同期セレクターの並行性を制御するためのセレクターファミリを導入しました

  • waitForAll:すべての依存関係を並行してリクエストし、すべてが利用可能になるまで待機します。
  • waitForAny:すべての依存関係を並行してリクエストし、いずれかが利用可能になるまで待機します。
  • waitForNone:すべての依存関係を並行してリクエストしますが、いずれも待機しません。
  • noWait は単一の依存関係をリクエストしますが、それが利用可能になるまで待機しません。

これらを使用して、複数の依存関係を並列で取得し、アップストリームの依存関係の状態に基づいて条件付きロジックを記述できます。たとえば、非同期プロセスが実行中の間に、読み込み状態をコンポーネントに伝播する代わりに、条件付きでデフォルト値を提供するセレクターを記述できます。

constSelectorerrorSelector

これらのセレクターファミリは、それぞれ単に定数値を返したり、常に特定のエラーをスローしたりします。

readOnlySelector

これは、読み取り/書き込み RecoilState を読み取り専用インターフェースでラップするだけです。

今後の予定

オブザーバーと永続性APIの改善、速度とメモリ管理の向上、Concurrent Modeのサポートに取り組んでいます。Recoilをお試しいただきありがとうございます。引き続きご期待ください!