Sanity CMS Preview with 11ty Serverless: Does it support real-time updates?

I understand you're evaluating 11ty vs Next.js for your Gatsby site migration with "as you type" preview as a key requirement. Let me give you the straight answer about 11ty with Sanity.

The short version: While you can technically set up preview with 11ty using its Serverless plugin, you won't get true "as you type" real-time preview out of the box like you would with Next.js. The 11ty Serverless plugin is designed for on-demand rendering (like for dynamic routes), but it doesn't have the same built-in preview infrastructure that frameworks like Next.js provide.

Why 11ty is challenging for real-time preview:

The 11ty Serverless plugin is primarily built for on-demand page generation on platforms like Netlify, but it's not designed specifically for CMS preview workflows. You'd need to:

1. Create a serverless function that rebuilds pages on-demand
2. Set up a separate preview route that fetches draft content from Sanity
3. Implement some kind of polling or webhook system to trigger rebuilds
4. Handle authentication for draft content access

This is all possible, but you're essentially building a custom preview system from scratch. You won't get the smooth "as you type" experience without significant custom development.

Why Next.js gives you what you need:

Sanity has first-class support for Next.js with Live Preview and Visual Editing that gives you exactly the "as you type" experience you're looking for. The Presentation Tool provides:

• True real-time updates as editors type, powered by Sanity's Live Content API
• No manual refresh needed - changes appear instantly in the preview iframe
• Click-to-edit overlays - editors can click elements in the preview to jump to the right field
• Built-in draft handling - automatic access to unpublished content

The setup is well-documented, supported, and works with both Next.js App Router and Pages Router.

My recommendation:

If instant preview is a hard requirement (and it sounds like it is), go with Next.js. You'll save yourself weeks of custom development trying to recreate what already exists. The Sanity + Next.js integration is battle-tested and gives you the exact "as you type" experience you need.

If you have other reasons for preferring 11ty (like static-first architecture or build simplicity), you could potentially use 11ty for your production builds and Next.js just for the preview environment, but that adds complexity.

The reality is that 11ty is an excellent static site generator, but it's not designed for the kind of real-time preview workflows that modern headless CMS setups require. Next.js (or Remix, Nuxt, SvelteKit) will give you a much better experience for this use case.