# Chapter 3

## Caching

### Control when social card images refresh
OpenGraph+ reads HTTP cache headers from your responses to decide when to re-render social card images. Next.js gives you several ways to control these headers.  
This page covers the Next.js side. For how OpenGraph+ handles caching at the HTTP level, see the [HTTP Caching](/content/docs/html-css/caching/index.html) guide.

## Route segment config
Set `revalidate` in a page or layout to control how long content is cached:

```javascript
// app/blog/[slug]/page.tsx

// Revalidate every hour
export const revalidate = 3600
```

This tells Next.js (and OpenGraph+) that the content is valid for one hour before revalidation.

## Custom headers in next.config.js
Set `Cache-Control` headers across routes:

```javascript
// next.config.js
module.exports = {
  async headers() {
    return [\
      {\
        source: '/blog/:path*',\
        headers: [\
          { key: 'Cache-Control', value: 'public, max-age=86400' },\
        ],\
      },\
      {\
        source: '/',\
        headers: [\
          { key: 'Cache-Control', value: 'public, max-age=3600' },\
        ],\
      },\
    ]
  },
}
```

## Route handlers
For API routes or route handlers that generate responses:

```javascript
// app/api/og/route.ts
export async function GET() {
  return new Response('...', {
    headers: {
      'Cache-Control': 'public, max-age=3600',
    },
  })
}
```

## Meta tag overrides
If you can’t control HTTP headers (e.g., static hosting that strips custom headers), use meta tags instead:

```javascript
export const metadata: Metadata = {
  other: {
    'og:plus:cache:max_age': '86400',
    'og:plus:cache:etag': 'v1-about-page',
  },
}
```

See the [HTTP Caching guide](/content/docs/html-css/caching/index.html) for the full list of meta tag overrides.

## Purging cached images
When you need to force a refresh immediately, go to your website dashboard, find the page, and click purge. This clears the cached image and triggers a re-render on the next request.

## Recommendations
| Page type                       | Strategy                                            |
| ------------------------------- | --------------------------------------------------- |
| Static pages (about, contact)  | `Cache-Control: public, max-age=604800` (1 week)  |
| Blog posts                     | `Cache-Control: public, max-age=86400` (1 day)    |
| Index / listing pages          | `Cache-Control: public, max-age=3600` (1 hour)    |
| Dynamic / user content         | No caching or short TTL                             |