キャッシュ#

キャッシュを有効化することで、一定時間以内に再アクセスされた場合に新たにレスポンスを返さずに高速に応答することができるようになります。

で、ここは詳しくないのでよくわかっていないのですがクライアント側のキャッシュとサーバー側のキャッシュの二つがあるんじゃないかと思っています。

キャッシュの利点#

例えば大雑把にレスポンスの生成に9秒、レスポンスを返すのに1秒かかりデータの更新は一時間に一回あるシステムがあるとします。

模試このサーバーに一時間に3600回のリクエストがあれば、キャッシュを利用しない場合は全員がデータ取得に10秒かかり、合計で36000秒かかることになります。

もしここでキャッシュを利用すれば最初の一人だけはリクエスト時にキャッシュを更新する処理が走るので10秒かかりますが、それ以外の人はキャッシュを利用して1秒で取得できるので10+3599=3609秒しかかかりません。

なんとこれだけで10倍高速化できることになるわけです。

ただし、この方式で困るのは一時間に一回、キャッシュの恩恵を受けることができない人が少なくとも一人出てきてしまうということです。

これを解消するのがPost Cacheという仕組みです。

仕組み#

Cloudflare KVを利用してキャッシュの内容と有効期限の二つのプロパティを持つデータを定義します。

export type CacheMetadata = {
  expiresIn: string
}

export type CacheResult = {
  cache: string | null
  isExpired: boolean
}

Cloudflare KVにはそれ自体に有効期限が設定できるのですが、こちらを設定してしまうと有効期限が切れたタイミングでキャッシュ自体が削除されてしまいます。

よって、独自に有効期限のプロパティを持つデータを定義する必要があります。

export namespace KVCache {
  export const get = async (c: Context<{ Bindings: Bindings }>): Promise<CacheResult> => {
    // KEYは適当に設定する感じで
    // 私のプロジェクトではアクセスされたURLに対してキーを発行している
    const { value, metadata } = await c.env.Cache.getWithMetadata<CacheMetadata>('KEY')
    if (value === null || metadata === null) {
      return {
        cache: null,
        isExpired: true
      }
    }
    return {
      cache: value,
      // dayjsを利用してキャッシュの有効期限と現在時刻を比較する
      isExpired: dayjs(metadata.expiresIn).unix() < dayjs().unix()
    }
  }

  export const put = async (c: Context<{ Bindings: Bindings }>, value: any): Promise<void> => {
    // KEYは適当に設定する感じで
    // 私のプロジェクトではアクセスされたURLに対してキーを発行している
    await c.env.Cache.put('KEY', JSON.stringify(value), { metadata: { expiresIn: expiresIn } })
  }
}

KVCacheの利用方法#

// 重い処理
export const CACHE_CREATE = async (c: Context<{ Bindings: Bindings }>): Promise<DATA> => {
  const data = // 何らかのデータを作成する
  await KVCache.put(c, data)
  return data
}

app.get('/', async (c) => {
  const { cache, isExpired } = await KVCache.get(c)
  if (isExpired) {
    // キャッシュが有効期限切れの場合、バックグラウンドで更新する
    c.executionCtx.waitUntil(CACHE_CREATE())
  }
  if (cache !== null) {
    // キャッシュがあればその値を返す
    return c.json({ JSON.parse(cache) })
  }
  // 最初の一回だけ実行される
  // キャッシュがなければ作成して更新する
  return c.json({ JSON.parse(CACHE_CREATE()) })
})

なんだか条件はもう少しいい感じに書けそうな気がするのですが、これで常にキャッシュを返せるようになります。

ただ、このコードだけだと誰もアクセスしないといつまで経ってもキャッシュが更新されないのでCron Triggersを利用して定期的にキャッシュを更新するようにします。

Cron Triggers#

wrangler.tomlを編集して、

[triggers]
crons = ["*/15 * * * *"]

のような内容を書きます。

これは15分毎に実行されるを意味します。

以下は一例ですが、src/index.tsに下記の内容を追記します。

const UPDATE_CACHE = async (controller: ScheduledController, env: Env, ctx: ExecutionContext): Promise<void> => {
  // 実行されるコードを書きます
}

const scheduled = (event: ScheduledController, env: Env, ctx: ExecutionContext) => {
  // 定期実行したいコードを書く
  // 今回の場合はUPDATE_CACHEを実行したいわけなので
  ctx.waitUntil(UPDATE_CACHE())
}

export default {
  port: 3000,
  fetch: app.fetch,
  scheduled // 必須
}

こうすることで十五分に一回キャッシュが自動で更新され、誰がいつアクセスしても一瞬でレスポンスが返るようになります、便利ですね。

記事は以上。