# 開発日記-2023-10-17 / Vercelのキャッシュについて

## Vercelのキャッシュについて

```typescript:page.tsx
export const dynamic = 'force-static'
export const revalidate = 60
```

```typescript
function makeClient() {
  return createClient({
    url: 'https://localhost/graphql',
    exchanges: [cacheExchange, fetchExchange],
    fetchOptions: {
      next: {
        revalidate: 60,
      },
    },
  })
}
```

Server ComponentでAPIから取得したデータを表示するようなページで、取得データの変更を反映させつつキャッシュを有効化するための方法を試行錯誤していたのが、なんとか形になった。

`revalidate` を指定することで、APIで取得できる内容が変わってもキャッシュが残るために表示が変更されないという問題を解決。

なぜかキャッシュされないページは `dynamic = 'force-static'` とすることで、キャッシュされるようになった。なぜキャッシュされないのか理由はわからないまま。`/path/[slug]` のようなページだったからなのだろうか。

## ブログのリンクをリンクカードをにする

- [Microlink](https://microlink.io/)
- [embed.ly](https://embed.ly/)
- [Iframely](https://iframely.com/)

リンクをリンクカードにしたり、動画などを埋め込むためのサービスを調べたのでメモしておく。embed.lyは無料では使えないみたい。

## favicon

このサイトのfaviconを作らないと。