hamburger-tech-nits

主にプログラミングのNITSな話

Vue3で推奨される状態管理ライブラリはPinia

Vue3における状態管理はPiniaが推奨された。

Vue2ではVuexが推奨されていたので、Vue3移行に伴いツールを移行している。

pinia.vuejs.org

💡 直感的
ストアはコンポーネントと同じくらい身近なものです。適切に整理されたストアを作成できるように設計された API。

🔑 タイプセーフ
型は推論されます。つまり、ストアでは JavaScript でもオートコンプリートが提供されます。

⚙️開発ツールのサポート
Pinia は Vue devtools に接続して、Vue 2 と Vue 3 の両方で強化された開発エクスペリエンスを提供します。

🔌 拡張可能
ストアの変更に反応して、トランザクションやローカル ストレージの同期などで Pinia を拡張します。

🏗 モジュラー設計
複数のストアを構築し、バンドラー コードでそれらを自動的に分割します。

📦 非常に軽い
ピニアの重さは約 1.5kb で、その存在を忘れてしまうほどです。

とのこと。

Flutter(というかモバイルアプリ界隈)では、状態管理アーキテクチャがあってそれの実現のためにライブラリを使うという感じだった気がする。RiverpodしかりProviderしかりBlocしかり、単方向データフローを実現するツールとしてライブラリを利用しているイメージ。Riverpodはライブラリ先行の毛色が強めかも知れないけど。どっちにしろ、メジャーバージョンの変更とともにアーキテクチャ変更するのはあまりない。

Webの文化なのか所属企業の文化なのかは分からないが、Webはライブラリがアーキテクチャを提唱していて、ライブラリ導入によって設計の実現にこぎつけている印象があって慣れない。Vueをアップデートして、ライブラリを変更して、設計を変更して、Nuxtをアップデートして、というプロセスをしているうちに次のメジャーバージョンが視野に入ってきてそう。

なんにせよ同僚が忙しそう。