Next.jsを使用した単純なRedisキャッシュの実装

 ほとんどのウェブサイトでは、変化する部分は実際にはそれほど頻繁には変化しません。その不変性により、データベース、Webサービス、またはサードパーティのエンドポイントからコンテンツをフェッチするためのラウンドトリップを回避するために、一流の候補がキャッシュされます。

あなたが書いたブログ記事を考えてみましょう。たとえば、古い情報を調整したり、読者が提案した修正を追加したりするために、この記事が時間の経過とともに1回または2回以上変更される可能性はほとんどありません。ただし、通常のシナリオでは、訪問者がそのブログページにアクセスするたびに、データベースにもアクセスが発生します。ページに100,000人の訪問者がいる場合は、その数のデータベース読み取りが行われます。そして、当然のことながら、読み取りは一般的に安価ですが、高性能、高可用性のシナリオでは、ミリ秒ごとにカウントされます。

さらに、データがサードパーティのソリューション（リモートWebサービスなど）からのものである場合、必要な情報にアクセスするための各ラウンドトリップは、ネットワーク帯域幅、リモートサーバーが処理できる同時接続の数、さらにはすぐにデバッグまたは修正できないシステム上のエラーを処理するだけです。

インメモリキャッシュデータベースがあると、最適化、予期しないデータストアの動作、一貫性に間違いなく役立ち、さらには数ドル節約できます。

インメモリキャッシュを実装する前に覚えておくべき落とし穴

この時点で、Redis、Memcache、またはその他のインメモリデータベースの代替手段をフルスロットルにする前に、知っておく必要のあるいくつかの落とし穴があることに注意する必要があります。次の潜在的な落とし穴のリストを確認してください。

注意してください、キャッシュの無効化は＃1です

キャッシュの無効化は、今日でも、コンピューターエンジニアリングで最も困難なタスクの1つです。 CodingHorrorのJeffAtwoodとStackOverflow.comの創設者によると、他の2つは、名前の付け方と1つずつのエラーです。本当に、それはあなたが野生のガチョウの追跡で時間を失う可能性があります。このために、強力なゲームプラン（キャッシュコヒーレンスプロトコル）、キャッシュ有効期限戦略を用意し、不要なデータ（揮発性情報など）でキャッシュを肥大化させないようにし、最後に定期的なキャッシュ検証ツールを適切な方法で調整することをお勧めしますあなたの製品とトラフィックのために。

非常に貪欲なキャッシングに注意してください。これは、前のアイテムと次のアイテムにいくらか関連しています。本質的には、キャッシュするチャンクと、そのキャッシュを保存する期間を100％制御する必要があります。先週起こったスポーツイベントは永遠に同じスコアを持ち、変わらないでしょう。したがって、自信を持って保存し、キャッシュすることができます。ただし、ゲームがライブで現在行われている場合は、スコアを頻繁に、目立たないように、おそらくキャッシュせずに更新できる必要があります。

すべてのプロジェクトがキャッシュに適しているわけではありません。理想的には、サイトのどのセクションをキャッシュするかについて、非常に注意深く戦略的にする必要があります。記事をキャッシュすることは完全に理にかなっていますが、コメントセクション、パスワードやクレジットカードなどの個人ユーザー情報をキャッシュすることは非常に悪い考えです。前述のように、キャッシュの無効化はそのままでは難しいので、ページが適切に更新されない理由を理解しようとしてうさぎの穴を掘り下げたくはありません。

複雑な構造物の保管は避けてください。 Redisは、リスト、セット、ハッシュ、さらにはストリーム（とりわけ）を保存する能力を超えていますが、KISSの原則に従うことをお勧めします。データ構造内により複雑なものを導入すると、インメモリデータベースから超高速の既製のデータを取得するという目的を果たせなくなります。キーバリュー構築でそれを維持することは、一般的に私たちが望むものに対して報われるでしょう。

メンテナンス。これは、インストールしてパブリックインターネットの荒野に住まわせるほとんどすべてのソフトウェアに当てはまります。システムの実装と保守の方法について、かなりのレベルの専門知識を持った人が必要になります。それでも、Redisは非常によく文書化されており、単一ノードのメモリ内キャッシュデータベースの作成は一般的に簡単です。

上記のように、HealthCare.govオープンAPIに接続する非常に単純なNext.jsアプリケーションを作成してみましょう。

ステップ1：簡単なNext.jsアプリケーションを作成する

Next.jsをエンジンとして使用してAPIに接続することは、非常に賢明な決断です。サーバー側のレンダリングを利用して結果をフェッチし、完全にハイドレイトされたページを提供できるからです。

空の標準プロジェクトから始めましょう。

npm init -y

次に、Next.jsとReactの依存関係を取得します。

npm i-S次の反応react-dom

プロジェクトがTypescriptで実行されている場合は、必要なすべてのライブラリとタイプもここにインストールしてください。簡単にするために、Typescript以外にしますが、例は簡単に変換できます。

最低限のNext.jsプロジェクトを実行するには、インデックスページが必要です。 src / pages /index.jsxの下にindex.jsxファイルを作成します。

手始めに、このコードをこのインデックスファイルにドロップしましょう：

非常にシンプルなインデックスページ。

次に、ページの進行状況を追跡するために、calにスクリプトを追加する必要があります。