👏

Riverpodの主要なrefメソッドを改めてまとめる

に公開

簡単に説明

状態管理といえば Riverpod が有名ですが、Cursor を始め生成AIでコードを書いてもらうスタイルでやっていると、何となく Riverpod を使ってるという人も多いのではないでしょうか。
私もそうです。

「これはこういう感じのやつです〜」と軽く説明は出来ても、
「もっと説明してくれ。さぁどうぞ!」など言われると尻込みしてしまう感じです。

生成AIに頼りすぎの弊害ですね。
というわけで、一旦初心に戻りまして、Riverpod の主要なrefメソッドを改めてまとめてみました。

ref.watch - 状態を監視して変更されたら再構築

watch はプロバイダーの値を監視して、その値が変更されたら widget をを再構築してくれます。
いわば「ここの数字を見続けて、変わったら教えてね〜」と指示するようなものです。
UI の表示内容がプロバイダーの状態に依存する場合に最も基本的に使用するメソッドです。

使用シーン

  • UI に表示するデータを監視する場合
  • 他のプロバイダー内で依存関係を監視する場合
  • プロバイダーの状態変化に基づいて UI を更新したい場合

ref.read - 一度だけ読み取り

read はプロバイダーの現在の値を一度だけ読み取ります。
このメソッドは継続的な監視を行わないため、値が変更されても widget は再構築されません。

使用シーン

  • イベントハンドラ内でアクションを実行する場合
  • 初期化時に一度だけ値が必要な場合

ref.listen - 変更を監視して副作用を実行

listen はプロバイダーの変更を監視し、変更があった場合にコールバック関数を実行します。
watch と異なり、widget の再構築は行わず、代わりに副作用(スナックバーの表示、ナビゲーション、ログ記録など)を実行します。
私はあんまり使ったことがないかも。

使用シーン

  • 状態変化に応じてスナックバーやダイアログを表示する場合
  • ナビゲーション操作を行う場合
  • ログ記録やアナリティクスの送信を行う場合
  • 前の値と新しい値を比較して特定の条件で処理を行う場合

ref.refresh - プロバイダーを強制的に更新

refresh はプロバイダーの状態を強制的に更新するためのメソッドです。
要はキャッシュをクリアしてくれて、プロバイダーを更新してくれます。
Chrome でいう cmd(ctl) + shift + r の強制リロードだと思ってます。
頻繁に使用するとパフォーマンスに影響するっぽいので、そこまで頻繁には使ってません。

使用シーン

  • キャッシュをクリアしてデータを強制的に更新したい場合

ref.invalidate - プロバイダーを無効化

invalidate はプロバイダーを無効化し、次回アクセスした時に強制的に更新します。
refresh と似ていますが、即座には再計算せず、次回プロバイダーにアクセスしたときに初めて再計算されます。

「今すぐではなく、次に必要になったときに更新して」と指示するようなものです。リソースを効率的に使いたい場合に便利です。
複数のプロバイダーを一度に無効化したいときにも役立ちます。

使用シーン

  • 複数のプロバイダーを一度に無効化したい場合
  • 即時の再計算が不要で、次回アクセス時に新しい値を取得したい場合
  • リソースを効率的に使用したい場合

ref.onDispose - リソースのクリーンアップ

onDispose はプロバイダーが破棄されるときにリソースを解放してくれるメソッドです。
「このプロバイダーが不要になったらこの処理を実行して」と指示するようなもので、メモリリークを防ぐために使います。

使用シーン

  • リソースを解放する場合
  • キャッシュをクリアする場合

refメソッド比較表

メソッド 主な用途 使用シーン
ref.watch 状態変化を監視してUIを再構築 • UI表示データの監視
• プロバイダー間の依存関係監視
• 状態変化に基づくUI更新
ref.read 一度だけ値を読み取り • イベントハンドラ内でのアクション実行
• 初期化時の一度だけの取得
ref.listen 状態変化を監視して副作用を実行 • スナックバー/ダイアログ表示
• ナビゲーション操作
• ログ記録/アナリティクス送信
ref.refresh プロバイダーを強制的に再計算 • キャッシュクリアと強制更新
• ユーザー操作によるデータリロード
ref.invalidate プロバイダーを無効化し次回アクセス時に再計算 • 複数プロバイダーの一括無効化
• 即時再計算不要の場合
• リソース効率を重視する場合
ref.onDispose ウィジェットまたはプロバイダーが破棄されるときのクリーンアップ • リソース解放
• メモリリーク防止
• 一時的なリスナーの削除

Discussion