[{"data":1,"prerenderedAt":120},["ShallowReactive",2],{"hub:tools-vercel":3},{"path":4,"key":5,"title":6,"h1":7,"description":8,"crumbs":9,"blocks":17},"\u002Ftools\u002Fvercel\u002F","tools-vercel","Vercel for Static Sites: Guides","Vercel","Guides for static sites on Vercel: Hugo and Eleventy configuration, the Build Output API, ISR against rebuilding, and caching.",[10,13,16],[11,12],"Home","\u002F",[14,15],"Tools","\u002Ftools\u002F",[7,4],[18,21,24,33,35,42,87,89],{"k":19,"text":20},"p","Vercel is built around Next.js, and much of its documentation assumes it. For other generators it is a capable static host with previews, rollbacks and edge functions, provided the configuration is explicit. The guides below cover that: configuring Hugo and Eleventy projects, taking full control with the Build Output API, keeping build caches for generators the platform does not recognise, and deciding when incremental static regeneration is worth its complexity compared with rebuilding.",{"k":22,"html":23},"fig","\u003Cfigure>\n\u003Csvg viewBox=\"0 0 760 246\" role=\"img\" aria-labelledby=\"hub-vercel-hero-title hub-vercel-hero-desc\" xmlns=\"http:\u002F\u002Fwww.w3.org\u002F2000\u002Fsvg\">\n  \u003Ctitle id=\"hub-vercel-hero-title\">Choosing a Vercel deployment approach\u003C\u002Ftitle>\n  \u003Cdesc id=\"hub-vercel-hero-desc\">The root asks which generator the site uses. Next.js uses the framework preset. A supported generator such as Hugo or Eleventy uses a configured preset with explicit commands. Anything custom writes the Build Output API directory and deploys it prebuilt.\u003C\u002Fdesc>\n  \u003Crect x=\"0\" y=\"0\" width=\"760\" height=\"246\" fill=\"#ffffff\"\u002F>\n  \u003Cg style=\"font-family:system-ui, sans-serif;font-size:12px\">\n    \u003Crect x=\"242.2\" y=\"60.0\" width=\"275.6\" height=\"50.0\" rx=\"8\" fill=\"#6a4c93\" opacity=\"0.14\" stroke=\"#6a4c93\" style=\"stroke-width:1.5px\"\u002F>\n    \u003Cpath d=\"M380.0 111.0 L380.0 132.0\" fill=\"none\" stroke=\"#556071\" style=\"stroke-width:2px\"\u002F>\n    \u003Cpath d=\"M134.0 132.0 L626.0 132.0\" fill=\"none\" stroke=\"#556071\" style=\"stroke-width:2px\"\u002F>\n    \u003Cpath d=\"M134.0 132.0 L134.0 150.0\" fill=\"none\" stroke=\"#556071\" style=\"stroke-width:2px;marker-end:url(#hub-vercel-hero-arrow)\"\u002F>\n    \u003Crect x=\"20.0\" y=\"154.0\" width=\"228.0\" height=\"75.5\" rx=\"8\" fill=\"#1982c4\" opacity=\"0.14\" stroke=\"#1982c4\" style=\"stroke-width:1.5px\"\u002F>\n    \u003Cpath d=\"M380.0 132.0 L380.0 150.0\" fill=\"none\" stroke=\"#556071\" style=\"stroke-width:2px;marker-end:url(#hub-vercel-hero-arrow)\"\u002F>\n    \u003Crect x=\"266.0\" y=\"154.0\" width=\"228.0\" height=\"75.5\" rx=\"8\" fill=\"#ffca3a\" opacity=\"0.24\" stroke=\"#a97b00\" style=\"stroke-width:1.5px\"\u002F>\n    \u003Cpath d=\"M626.0 132.0 L626.0 150.0\" fill=\"none\" stroke=\"#556071\" style=\"stroke-width:2px;marker-end:url(#hub-vercel-hero-arrow)\"\u002F>\n    \u003Crect x=\"512.0\" y=\"154.0\" width=\"228.0\" height=\"75.5\" rx=\"8\" fill=\"#8ac926\" opacity=\"0.2\" stroke=\"#5a8a16\" style=\"stroke-width:1.5px\"\u002F>\n    \u003Ctext x=\"380.0\" y=\"30.0\" fill=\"#1f2937\" style=\"font-size:16px;text-anchor:middle;font-weight:700\">How to deploy a static site to Vercel\u003C\u002Ftext>\n    \u003Ctext x=\"380.0\" y=\"90.2\" fill=\"#1f2937\" style=\"font-size:13px;text-anchor:middle;font-weight:700\">Which generator builds the site?\u003C\u002Ftext>\n    \u003Ctext x=\"134.0\" y=\"170.0\" fill=\"#166a9e\" style=\"font-size:11px;text-anchor:middle;font-weight:700\">Next.js\u003C\u002Ftext>\n    \u003Ctext x=\"134.0\" y=\"190.3\" fill=\"#1f2937\" style=\"font-size:13px;text-anchor:middle;font-weight:700\">Framework preset\u003C\u002Ftext>\n    \u003Ctext x=\"134.0\" y=\"207.2\" fill=\"#556071\" style=\"font-size:11px;text-anchor:middle\">static export or ISR\u003C\u002Ftext>\n    \u003Ctext x=\"380.0\" y=\"170.0\" fill=\"#8a6d0f\" style=\"font-size:11px;text-anchor:middle;font-weight:700\">Hugo, Eleventy\u003C\u002Ftext>\n    \u003Ctext x=\"380.0\" y=\"190.3\" fill=\"#1f2937\" style=\"font-size:13px;text-anchor:middle;font-weight:700\">Configured preset\u003C\u002Ftext>\n    \u003Ctext x=\"380.0\" y=\"207.2\" fill=\"#556071\" style=\"font-size:11px;text-anchor:middle\">explicit commands and caches\u003C\u002Ftext>\n    \u003Ctext x=\"626.0\" y=\"170.0\" fill=\"#3f6410\" style=\"font-size:11px;text-anchor:middle;font-weight:700\">Anything custom\u003C\u002Ftext>\n    \u003Ctext x=\"626.0\" y=\"190.3\" fill=\"#1f2937\" style=\"font-size:13px;text-anchor:middle;font-weight:700\">Build Output API\u003C\u002Ftext>\n    \u003Ctext x=\"626.0\" y=\"207.2\" fill=\"#556071\" style=\"font-size:11px;text-anchor:middle\">prebuilt from your CI\u003C\u002Ftext>\n  \u003C\u002Fg>\n  \u003Cdefs>\n    \u003Cmarker id=\"hub-vercel-hero-arrow\" viewBox=\"0 0 10 10\" refX=\"8\" refY=\"5\" markerWidth=\"7\" markerHeight=\"7\" orient=\"auto-start-reverse\">\n      \u003Cpath d=\"M0 0 L10 5 L0 10 z\" fill=\"#556071\"\u002F>\n    \u003C\u002Fmarker>\n  \u003C\u002Fdefs>\n\u003C\u002Fsvg>\n\u003Cfigcaption>The third branch also suits teams that build in their own CI.\u003C\u002Ffigcaption>\n\u003C\u002Ffigure>",{"k":25,"h":26,"items":27},"group","Choosing the Right Static Site Generator for Production",[28],{"t":29,"u":30,"d":31,"y":32},"robots.txt and noindex for Preview and Staging","\u002Fchoosing-the-right-static-site-generator-for-production\u002Ftechnical-seo-for-static-sites\u002Frobots-txt-and-noindex-for-preview-and-staging\u002F","Keep preview, staging and platform-host copies of a static site out of search results with X-Robots-Tag headers on Netlify, Vercel and Cloudflare.","How-to",{"k":22,"html":34},"\u003Cfigure>\n\u003Csvg viewBox=\"0 0 760 295\" role=\"img\" aria-labelledby=\"hub-vercel-kinds-title hub-vercel-kinds-desc\" xmlns=\"http:\u002F\u002Fwww.w3.org\u002F2000\u002Fsvg\">\n  \u003Ctitle id=\"hub-vercel-kinds-title\">Number of Vercel guides of each kind\u003C\u002Ftitle>\n  \u003Cdesc id=\"hub-vercel-kinds-desc\">Vertical bars: How-tos 9, Fixes 1, Comparisons 2 and Concepts 0.\u003C\u002Fdesc>\n  \u003Crect x=\"0\" y=\"0\" width=\"760\" height=\"295\" fill=\"#ffffff\"\u002F>\n  \u003Cg style=\"font-family:system-ui, sans-serif;font-size:12px\">\n    \u003Crect x=\"80.0\" y=\"76.0\" width=\"90.0\" height=\"170.0\" rx=\"3\" fill=\"#1982c4\" opacity=\"0.3\" stroke=\"#1982c4\" style=\"stroke-width:1px\"\u002F>\n    \u003Crect x=\"250.0\" y=\"227.1\" width=\"90.0\" height=\"18.9\" rx=\"3\" fill=\"#ff595e\" opacity=\"0.3\" stroke=\"#d83b41\" style=\"stroke-width:1px\"\u002F>\n    \u003Crect x=\"420.0\" y=\"208.2\" width=\"90.0\" height=\"37.8\" rx=\"3\" fill=\"#ffca3a\" opacity=\"0.45\" stroke=\"#a97b00\" style=\"stroke-width:1px\"\u002F>\n    \u003Crect x=\"590.0\" y=\"243.0\" width=\"90.0\" height=\"3.0\" rx=\"3\" fill=\"#6a4c93\" opacity=\"0.3\" stroke=\"#6a4c93\" style=\"stroke-width:1px\"\u002F>\n    \u003Cpath d=\"M30.0 246.0 L730.0 246.0\" fill=\"none\" stroke=\"#556071\" style=\"stroke-width:1.5px\"\u002F>\n    \u003Ctext x=\"380.0\" y=\"30.0\" fill=\"#1f2937\" style=\"font-size:16px;text-anchor:middle;font-weight:700\">Vercel guides by kind\u003C\u002Ftext>\n    \u003Ctext x=\"125.0\" y=\"69.0\" fill=\"#1f2937\" style=\"font-size:12px;text-anchor:middle;font-weight:700\">9\u003C\u002Ftext>\n    \u003Ctext x=\"125.0\" y=\"264.0\" fill=\"#556071\" style=\"font-size:11.5px;text-anchor:middle\">How-tos\u003C\u002Ftext>\n    \u003Ctext x=\"295.0\" y=\"220.1\" fill=\"#b32b30\" style=\"font-size:12px;text-anchor:middle;font-weight:700\">1\u003C\u002Ftext>\n    \u003Ctext x=\"295.0\" y=\"264.0\" fill=\"#556071\" style=\"font-size:11.5px;text-anchor:middle\">Fixes\u003C\u002Ftext>\n    \u003Ctext x=\"465.0\" y=\"201.2\" fill=\"#1f2937\" style=\"font-size:12px;text-anchor:middle;font-weight:700\">2\u003C\u002Ftext>\n    \u003Ctext x=\"465.0\" y=\"264.0\" fill=\"#556071\" style=\"font-size:11.5px;text-anchor:middle\">Comparisons\u003C\u002Ftext>\n    \u003Ctext x=\"635.0\" y=\"236.0\" fill=\"#1f2937\" style=\"font-size:12px;text-anchor:middle;font-weight:700\">0\u003C\u002Ftext>\n    \u003Ctext x=\"635.0\" y=\"264.0\" fill=\"#556071\" style=\"font-size:11.5px;text-anchor:middle\">Concepts\u003C\u002Ftext>\n  \u003C\u002Fg>\n\u003C\u002Fsvg>\n\u003Cfigcaption>12 guides use Vercel in depth; each is listed below under the section it belongs to.\u003C\u002Ffigcaption>\n\u003C\u002Ffigure>",{"k":25,"h":36,"items":37},"Core Web Vitals Optimization for SSGs",[38],{"t":39,"u":40,"d":41,"y":32},"Cache-Control Headers on Vercel for Static Sites","\u002Fperformance-optimization-core-web-vitals-for-ssgs\u002Fcdn-caching-rules-for-ssgs\u002Fcache-control-headers-on-vercel-for-static-sites\u002F","How Vercel caches static output by default, when to override it in vercel.json, and how CDN-Cache-Control and immutable assets change repeat-visit performance.",{"k":25,"h":43,"items":44},"Production-Ready Deployment & CI\u002FCD for SSGs",[45,50,54,58,62,66,70,74,78,82],{"t":46,"u":47,"d":48,"y":49},"Static Site Bandwidth Pricing: Netlify, Vercel, Cloudflare","\u002Fproduction-ready-deployment-cicd-workflows\u002Fnetlify-vs-vercel-deployment-strategies\u002Fbandwidth-pricing-for-static-sites-across-netlify-vercel-and-cloudflare\u002F","Model monthly hosting cost for a static site on Netlify, Vercel and Cloudflare at four traffic levels, with the levers that cut bandwidth by half or more.","Comparison",{"t":51,"u":52,"d":53,"y":49},"Vercel ISR vs Static Generation for SSGs","\u002Fproduction-ready-deployment-cicd-workflows\u002Fnetlify-vs-vercel-deployment-strategies\u002Fvercel-isr-vs-static-generation-for-ssgs\u002F","ISR rebuilds pages on demand; static generation builds everything upfront. Astro, Eleventy, Hugo, and Jekyll have no ISR — they rebuild and purge at the CDN.",{"t":55,"u":56,"d":57,"y":32},"Build Caching on Netlify and Vercel","\u002Fproduction-ready-deployment-cicd-workflows\u002Fincremental-builds-and-build-caching-for-ssgs\u002Fbuild-caching-on-netlify-and-vercel\u002F","Make Netlify and Vercel reuse dependency, framework and image caches between static site builds, verify cache hits in logs, and measure the savings.",{"t":59,"u":60,"d":61,"y":32},"Configuring Redirects on Vercel for Static Sites","\u002Fproduction-ready-deployment-cicd-workflows\u002Fnetlify-vs-vercel-deployment-strategies\u002Fconfiguring-redirects-on-vercel-for-static-sites\u002F","Configure redirects for a static site on Vercel in vercel.json: patterns, status codes, trailing slashes, host redirects and limits, tested in CI.",{"t":63,"u":64,"d":65,"y":32},"Configuring Vercel for Hugo and Eleventy","\u002Fproduction-ready-deployment-cicd-workflows\u002Fnetlify-vs-vercel-deployment-strategies\u002Fconfiguring-vercel-for-hugo-and-eleventy\u002F","Deploy Hugo and Eleventy sites on Vercel with pinned versions, the right output directory, clean URLs, trailing slashes, headers and redirects in vercel.json.",{"t":67,"u":68,"d":69,"y":32},"Deploying Astro to Vercel as a Fully Static Site","\u002Fproduction-ready-deployment-cicd-workflows\u002Fnetlify-vs-vercel-deployment-strategies\u002Fdeploying-astro-to-vercel-as-a-fully-static-site\u002F","Deploy an Astro site to Vercel as pure static output with no functions: skipping the adapter, headers and redirects in vercel.json, and images.",{"t":71,"u":72,"d":73,"y":32},"Netlify Build Hooks for Content Updates","\u002Fproduction-ready-deployment-cicd-workflows\u002Fnetlify-vs-vercel-deployment-strategies\u002Fnetlify-build-hooks-for-content-updates\u002F","Trigger Netlify rebuilds from a headless CMS without a Git push. Create, secure, time, and debug Netlify build hooks for automated static site content updates.",{"t":75,"u":76,"d":77,"y":32},"Security Headers on Vercel for Static Sites","\u002Fproduction-ready-deployment-cicd-workflows\u002Fsecurity-headers-for-static-sites\u002Fsecurity-headers-on-vercel-for-static-sites\u002F","Add HSTS, CSP, framing, referrer and permissions headers to a static site on Vercel with vercel.json, relax them only on previews, and test each deploy.",{"t":79,"u":80,"d":81,"y":32},"Vercel Build Output API for Custom SSGs","\u002Fproduction-ready-deployment-cicd-workflows\u002Fnetlify-vs-vercel-deployment-strategies\u002Fvercel-build-output-api-for-custom-ssgs\u002F","Deploy any static site generator to Vercel with the Build Output API: static files, headers, redirects, cache rules and an optional edge function.",{"t":83,"u":84,"d":85,"y":86},"Fixing Vercel Builds That Run Out of Memory","\u002Fproduction-ready-deployment-cicd-workflows\u002Fnetlify-vs-vercel-deployment-strategies\u002Ffixing-vercel-builds-that-run-out-of-memory\u002F","Diagnose static site builds killed for memory on Vercel, from heap limits and image concurrency to huge data files, and fix them on the same machine.","Fix",{"k":22,"html":88},"\u003Cfigure>\n\u003Csvg viewBox=\"0 0 760 244\" role=\"img\" aria-labelledby=\"hub-vercel-topics-title hub-vercel-topics-desc\" xmlns=\"http:\u002F\u002Fwww.w3.org\u002F2000\u002Fsvg\">\n  \u003Ctitle id=\"hub-vercel-topics-title\">Topics with the most Vercel guides\u003C\u002Ftitle>\n  \u003Cdesc id=\"hub-vercel-topics-desc\">Horizontal bars, largest first: Netlify vs Vercel Deployment Strategies 8, Technical SEO for Static Sites 1, Incremental Builds and Build Caching for SSGs 1, CDN Caching Rules for SSGs 1 and Security Headers and Hardening for Static Sites 1.\u003C\u002Fdesc>\n  \u003Crect x=\"0\" y=\"0\" width=\"760\" height=\"244\" fill=\"#ffffff\"\u002F>\n  \u003Cg style=\"font-family:system-ui, sans-serif;font-size:12px\">\n    \u003Crect x=\"350.0\" y=\"65.0\" width=\"365.6\" height=\"20.0\" rx=\"3\" fill=\"#6a4c93\" opacity=\"0.3\" stroke=\"#6a4c93\" style=\"stroke-width:1px\"\u002F>\n    \u003Crect x=\"350.0\" y=\"99.0\" width=\"45.7\" height=\"20.0\" rx=\"3\" fill=\"#6a4c93\" opacity=\"0.3\" stroke=\"#6a4c93\" style=\"stroke-width:1px\"\u002F>\n    \u003Crect x=\"350.0\" y=\"133.0\" width=\"45.7\" height=\"20.0\" rx=\"3\" fill=\"#6a4c93\" opacity=\"0.3\" stroke=\"#6a4c93\" style=\"stroke-width:1px\"\u002F>\n    \u003Crect x=\"350.0\" y=\"167.0\" width=\"45.7\" height=\"20.0\" rx=\"3\" fill=\"#6a4c93\" opacity=\"0.3\" stroke=\"#6a4c93\" style=\"stroke-width:1px\"\u002F>\n    \u003Crect x=\"350.0\" y=\"201.0\" width=\"45.7\" height=\"20.0\" rx=\"3\" fill=\"#6a4c93\" opacity=\"0.3\" stroke=\"#6a4c93\" style=\"stroke-width:1px\"\u002F>\n    \u003Cpath d=\"M350.0 60.0 L350.0 226.0\" fill=\"none\" stroke=\"#556071\" style=\"stroke-width:1.5px\"\u002F>\n    \u003Ctext x=\"380.0\" y=\"30.0\" fill=\"#1f2937\" style=\"font-size:16px;text-anchor:middle;font-weight:700\">Where Vercel comes up\u003C\u002Ftext>\n    \u003Ctext x=\"20.0\" y=\"79.2\" fill=\"#1f2937\" style=\"font-size:12px;text-anchor:start\">Netlify vs Vercel Deployment Strategies\u003C\u002Ftext>\n    \u003Ctext x=\"723.6\" y=\"79.5\" fill=\"#1f2937\" style=\"font-size:12px;text-anchor:start;font-weight:700\">8\u003C\u002Ftext>\n    \u003Ctext x=\"20.0\" y=\"113.2\" fill=\"#1f2937\" style=\"font-size:12px;text-anchor:start\">Technical SEO\u003C\u002Ftext>\n    \u003Ctext x=\"403.7\" y=\"113.5\" fill=\"#1f2937\" style=\"font-size:12px;text-anchor:start;font-weight:700\">1\u003C\u002Ftext>\n    \u003Ctext x=\"20.0\" y=\"147.2\" fill=\"#1f2937\" style=\"font-size:12px;text-anchor:start\">Incremental Builds and Build Caching\u003C\u002Ftext>\n    \u003Ctext x=\"403.7\" y=\"147.5\" fill=\"#1f2937\" style=\"font-size:12px;text-anchor:start;font-weight:700\">1\u003C\u002Ftext>\n    \u003Ctext x=\"20.0\" y=\"181.2\" fill=\"#1f2937\" style=\"font-size:12px;text-anchor:start\">CDN Caching Rules\u003C\u002Ftext>\n    \u003Ctext x=\"403.7\" y=\"181.5\" fill=\"#1f2937\" style=\"font-size:12px;text-anchor:start;font-weight:700\">1\u003C\u002Ftext>\n    \u003Ctext x=\"20.0\" y=\"215.2\" fill=\"#1f2937\" style=\"font-size:12px;text-anchor:start\">Security Headers and Hardening\u003C\u002Ftext>\n    \u003Ctext x=\"403.7\" y=\"215.5\" fill=\"#1f2937\" style=\"font-size:12px;text-anchor:start;font-weight:700\">1\u003C\u002Ftext>\n  \u003C\u002Fg>\n\u003C\u002Fsvg>\n\u003Cfigcaption>Topic pages give the wider context for each group; the numbers count only guides that use this tool in depth.\u003C\u002Ffigcaption>\n\u003C\u002Ffigure>",{"k":25,"h":90,"items":91},"Often used with Vercel",[92,97,102,106,110,115],{"t":93,"u":94,"d":95,"y":96},"Netlify","\u002Ftools\u002Fnetlify\u002F","Headers, redirects, deploy previews and build caching.","6 shared guides",{"t":98,"u":99,"d":100,"y":101},"Astro","\u002Ftools\u002Fastro\u002F","Islands, content collections, astro:assets and deployment.","3 shared guides",{"t":103,"u":104,"d":105,"y":101},"Eleventy","\u002Ftools\u002Feleventy\u002F","Incremental builds, image pipelines and the data cascade.",{"t":107,"u":108,"d":109,"y":101},"Hugo","\u002Ftools\u002Fhugo\u002F","Build time at scale, image caches, modules and multilingual sites.",{"t":111,"u":112,"d":113,"y":114},"Cloudflare","\u002Ftools\u002Fcloudflare\u002F","Pages and Workers hosting, cache rules and edge functions.","2 shared guides",{"t":116,"u":117,"d":118,"y":119},"Jekyll","\u002Ftools\u002Fjekyll\u002F","Plugins, reproducible builds, upgrades and migration away.","1 shared guides",1790943190467]