Jamstack Site diagram template

Builds a new scene in your browser. Your existing scenes are not touched.

About this design

A Jamstack site does as much work as possible at build time, so a visitor receives plain files from the nearest CDN edge with no server in the request path. A build pipeline pulls content from a headless CMS, renders pages, and publishes them to object storage fronted by a CDN. Anything genuinely dynamic, such as form submissions, search or a pricing lookup, goes to small functions behind an API route. A webhook from the CMS triggers a rebuild when editors publish, so content updates reach production within a minute or two. The result is fast, cheap and hard to take down. Use it to discuss incremental rebuilds on very large sites, preview environments for editors, cache invalidation after a deploy, and when personalised or authenticated content makes a fully static approach the wrong choice.

Diagram as text

This is the source of the diagram, in the ArchBoard diagram DSL. Paste it into Tools, Diagram from text to rebuild or change it.

title "Jamstack site"
direction LR
user "Visitors" -> cdn cloudfront "CDN" -> storage s3 "Static site"
external "Headless CMS" -[webhook]-> ci github "Build pipeline" -> static-site
user -> function lambda "Forms and search API" -> db dynamodb "Submissions"