React Query を使っていて気になった SWR とのいくつかの違い | DevelopersIO
MAD 事業部の高橋ゆうきです。 REST API である場合、プライベートでは SWR を使うことが多いのですが、昨年から案件では React Query を使っているのでいくつかの違いを感じることがありました。ここでは React Query のドキュメントにある表 から気になった違いをいくつかピックアップしてみます。 比較 Query Key Change Detection React Query - Deep Compare (Stable Serialization) SWR - Shallow Compare Deep Compare (Stable Serialization) 2021 年 2 月 20 日現在上記のように記載されていますが、SWR も 1.1.0 以降は ドキュメントにも記載されているように、stable serialization となっています。 Q
SWRとReact Queryどっち使おうか検討したメモ
const { isLoading, error, data } = useQuery('repoData', () => fetch('https://api.github.com/repos/tannerlinsley/react-query').then(res => res.json() ) ) 一見、ほとんど一緒じゃん、となるが、SWRは「キーをfetcheの実行するためのパラメータ」になっている。 一方、react-queryは「キーと実行APIは独立している」。これはイメージとしてReduxのActionなどのconstantのような印象を受ける APIの違い Core API RQ : https://react-query.tanstack.com/docs/api SWR https://swr.vercel.app/docs/options#parameters これ
useSWR で作る Form 画面の備忘録
管理画面のような CRUD 中心のプロダクトでは Form と CSR をよく利用します。SWR は開発体験に優れたライブラリですが、Form に利用する場合注意点があるので、備忘録として共有します（広義の SWR と紛わない様に、タイトルはuseSWRとしました） 視覚的安定性とキャッシュ はじめに、SWR や React Query を利用するモチベーションについて言及します。SWR は一意のキーに紐づいたキャッシュが無い場合、loading fallback を表示します。fallback 表示はたとえ一瞬であっても「チカっ」とした表示になるため「スムーズではない印象」を利用者に与えてしまいます。しかし SWR や React Query は有キャッシュ時は fallback を SKIP するため、ユーザー操作を妨げずに視覚的安定性を提供することができます。 このメリットは、反復画
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
SWRと状態管理
