ステートの保存

アプリケーションが役立つためには、ステートを保存する必要があります。そうでない場合は、単なる静的なページになります。

Qwikがアプリケーションの状態を追跡する理由は2つあります。

アプリケーションがサーバーで一時停止したときにデータをシリアル化し、クライアントでアプリケーションが再開するときにデシリアル化するため。
Qwikがどのコンポーネントを再レンダリングするかを把握できるように、ストアにサブスクリプションを作成するため。Qwikがサブスクリプションを追跡しない場合、アプリケーション全体を再レンダリングする必要があり、これは遅延読み込みの目的を無効にします。

右側のコンポーネントは、まだ機能しません。なぜならcounterはサブスクリプションのないただのプレーンなオブジェクトだからです。その結果、Qwikはcounter.countがいつ変更されたかを知らず、したがって<App>コンポーネントを再レンダリングする必要があることを知りません。

あなたのタスク: 依存関係の追跡と自動再レンダリングを有効にするために、useStore()でcounterをラップしてください。

シリアライズ

HTMLタブを開いて、サーバーによってシリアル化される情報を確認してください。シリアル化情報については、<script type="qwik/json">ブロックを確認してください。以下に気づくでしょう。

{count: 0}がシリアライズされた状態にあります。
シリアライズされた状態の最後にはsubsがあり、これには"count"が含まれています。これらのサブスクリプションは、ステートが変化したときにどのコンポーネントを再レンダリングするかをQwikに指示します。

Qwikのステートは、それを生成したコンポーネントに決して結び付けられていません。ステートはアプリケーション内の任意のコンポーネントに渡すことができ、Qwikは必要なサブスクリプションを作成し、影響を受けるコンポーネントのみを再レンダリングします。