Skip to content

@astrojs/vercel@11.0.0

Choose a tag to compare

@astrobot-houston astrobot-houston released this 22 Jun 10:10
f55ba4c

Major Changes

Minor Changes

  • #16335 9a53f77 Thanks @ascorbic! - Adds a CDN cache provider for Astro route caching on Vercel

    Setup

    Import cacheVercel() from @astrojs/vercel/cache and set it as your cache provider:

    import { defineConfig } from 'astro/config';
    import vercel from '@astrojs/vercel';
    import { cacheVercel } from '@astrojs/vercel/cache';
    
    export default defineConfig({
      adapter: vercel(),
      cache: {
        provider: cacheVercel(),
      },
    });

    Caching responses

    Use Astro.cache.set() in your pages and API routes to cache responses on Vercel's edge network. The provider sets Vercel-CDN-Cache-Control and Vercel-Cache-Tag headers on responses.

    ---
    Astro.cache.set({ maxAge: 300, tags: ['products'] });
    const data = await fetchProducts();
    ---
    
    <ProductList items={data} />

    You can also set cache rules for groups of routes in your config:

    cache: { provider: cacheVercel() },
    routeRules: {
      '/products/[...slug]': { maxAge: 3600, tags: ['products'] },
      '/api/[...path]': { maxAge: 60, swr: 600 },
    },

    Invalidation

    Purge cached responses by tag or path from any API route or server endpoint:

    // src/pages/api/purge.ts
    export async function POST({ request, cache }) {
      await cache.invalidate({ tags: ['products'] });
      return new Response('Purged');
    }
    
    // Path-based invalidation
    await cache.invalidate({ path: '/products/123' });

    Both tag-based and path-based invalidation are supported. Tag invalidation is a soft invalidation, marking cached responses as stale so they can be revalidated in the background via stale-while-revalidate.

Patch Changes