useVisibleTask$()
コンポーネントが再開された後にコードを実行するには、useVisibleTask$() を使用します。これは、アプリケーションが再開されたときにクライアント上でタイマーやストリームを設定する場合に役立ちます。
track() と useVisibleTask$()
useVisibleTask$() は useTask$() と同様に track() 関数を受け取ります。ストアが更新されたときに効果をトリガーするには、track() 関数を使用します。詳細については、リアクティビティを参照してください。
コンポーネントのライフサイクルとSSR
Qwik は再開可能です。再開可能とは、アプリケーションがサーバーで開始され、その後クライアントに転送されることを意味します。クライアントでは、アプリケーションは中断した場所から実行を続けます。一般的なユースケースは、サーバーでコンポーネントを作成し、一時停止してからクライアントで再開することです。コンポーネントを完全に機能させるには、タイマーやストリームを設定するために、クライアントでコードを先に実行する必要がある場合があります。
useVisibleTask$() はクライアント専用の方法です。（サーバーには同等のものはありません。）
注記 クライアントとサーバーの両方で実行する必要がある動作については、
useTask$()を参照してください。
useVisibleTask$() はいつ実行されますか？
クライアント効果コードは、コンポーネントが再開された後に実行されます。useVisibleTask$() メソッドは、効果が実行されるタイミングを制御する追加の引数（{strategy:'intersection-observer|document-ready|document-idle'}）を取ります。3つのオプションがあります。
intersection-observer（デフォルト）：タスクは、ビューポート内で要素が表示されたときに最初に実行されます。内部的には、IntersectionObserver API を使用しています。document-ready：タスクは、ドキュメントの準備が整ったときに最初に実行されます。内部的には、document load イベントを使用しています。document-idle：タスクは、ドキュメントがアイドル状態になったときに最初に実行されます。内部的には、requestIdleCallback API を使用しています。
例
この例では、画面の下部にレンダリングされる時計コンポーネントを示しています。クライアントで動作させるには、useVisibleTask$() を使用して、時計が毎秒現在時刻を更新するようにします。実装を支援するために、ユーティリティ関数 updateClock を用意しました。
useVisibleTask$() は、setInterval タイマーを解放するクリーンアップ関数を返す必要があることに注意してください。これにより、コンポーネントがアンマウント/破棄されたときにタイマーを適切にクリーンアップできます。