Open9
React - 最近のhooksライブラリのメンテナンス状況
Tatsushi KiryuReactで以下のことをハンドリングしたいけど
- debounce
- clipboard
- localstorage
- keypress
スクラッチで実装するのも面倒なので、オールインワンなhooksライブラリを導入したい。
Tatsushi KiryuChatGPT にも聞いてみた。期待しないものが混じっているが、これはプロンプト力のなさ。。
以下は、2023年9月現在、Reactのhooksライブラリで有名なもののトップ10リストです：
-
React Hooks Form
- 説明: React Hooks for form state management and validation (Web + React Native)。不要な再レンダリングを削除しながら、書く必要があるコードの量を削減します。
- Github Docs
-
React Use
- 説明: React useは、デバイスセンサー、UIコントロール、アニメーション、サイドエフェクト、ライフサイクル、ステートなどの管理のための基本的なReact Hooksのコレクションを持っています。
- Github Docs
-
React Query
- 説明: Reactでの非同期データの取得、キャッシング、更新のためのHooks。常に最新の自動管理されたクエリと変更を持っています。
- Github Docs
-
useDebounce
- 説明: 値とコールバックのデバウンスのためのReactフック。
- Github
-
useHooks-ts
- 説明: アプリケーションのライフサイクルの多くのユースケースのための多くのフックを持っています。
- Github Docs
-
Constate
- 説明: React Hooksを使用してローカルステートを作成し、必要に応じて最小の労力でReact Contextとして使用します。
- Github
-
useHttp
- 説明: Fetch APIの代替として使用される素晴らしいパッケージ。
- Github Docs
-
useMedia
- 説明: CSSメディアクエリの状態を追跡するReactセンサーフック。
- Github
-
rehooks/local-storage
- 説明: ローカルストレージとの同期を有効にするReactフック。
- Github Docs
-
React Hanger
- 説明: 特定のいくつかのプリミティブタイプのステート変更ヘルパーのための役立つフックのセット。
- Github
これらのライブラリは、Reactの開発者にとって非常に役立つものであり、多くのプロジェクトで広く使用されています。
Tatsushi KiryuChatGPTから出てきたライブラリも、最初の記事に上がってるものに含まれている。もっと探せばさまざま出てくるんだろうけど、ひとまずこれらでピン留めして、それぞれの状況を確認していく。
- react-hooks-lib
- react-hanger
- react-hookedup
- react-use
- react-recipes
- usehooks-ts
Tatsushi Kiryu| Library | GitHub Link | Last Release | Star数 | 備考 |
|---|---|---|---|---|
| react-hooks-lib | Link | 0.5.0 (2021-01-24) | 542 | |
| react-hanger | Link | v2.4.5 (2022-10-2) | 1.9k | |
| react-hookedup | Link | 2019-10-13(last commit) | 87 | |
| react-use | Link | 17.4.0 (2022-05-20) | 38k | メンテナンスが不安 - https://github.com/streamich/react-use/issues/2360 |
| react-recipes | Link | 1.4.0 (2021-09-17) | 974 | |
| usehooks-ts | Link | usehooks-ts@2.9.1 (2022-10-14) | 4.3k | メンテナンスが不安 - https://github.com/juliencrn/usehooks-ts/issues/373 |
どれも、アクティブに開発しているとはいえない。react-use や usehooks-ts などは、メンテナンスが不安視されていてIssueが立っているほど。
Tatsushi Kiryu
このコメントによると、react-use のalternativeとして @react-hookz/web が あるとのこと。
ただし、現状全てのhooksが実装されきっているわけではなさそう（clipboardくらいなら自作したってよいくらいではあるけれど）。
まあ、時間の問題。
Tatsushi Kiryuまた、「react hooks library」でGoogle検索するとトップに @uidotdev/usehooksが出てくる。
Tatsushi Kiryuまとめ
-
react-useをはじめとする老舗 hooks library は、実はメンテナンスリスクにさらされていることが分かった。- 今後 hooks library を選定するときはその点に気を付けるべし。
-
@react-hookz/webや@uidotdev/usehooksなど後発の hooks library にしておこう。- 今の所、自分の要件を全て満たすのは
@uidotdev/usehooksだけど、@react-hookz/webのほうがバラエティに富んでいるので、やりたいこと次第では乗り換えよう。
- 今の所、自分の要件を全て満たすのは