Three Tiers of Data Freshness in a SvelteKit Static Site
Ahnii! Static sites are fast and cheap to host, but your data goes stale the moment you deploy. This post shows how a SvelteKit portfolio site serves live data from five external sources while stil...

Source: DEV Community
Ahnii! Static sites are fast and cheap to host, but your data goes stale the moment you deploy. This post shows how a SvelteKit portfolio site serves live data from five external sources while still deploying as static HTML to GitHub Pages. The Setup The site uses SvelteKit with adapter-static, which prerenders every page to HTML at build time. The output is a directory of .html files deployed to GitHub Pages. No server, no edge functions, no serverless runtime. // svelte.config.js import adapter from '@sveltejs/adapter-static'; const config = { kit: { adapter: adapter({ fallback: '404.html', strict: false }) } }; The fallback: '404.html' line is the key. GitHub Pages serves this file for any URL that doesn't match a prerendered page, which lets SvelteKit's client-side router take over. Three Tiers of Freshness Not all data needs to be live. The site uses three strategies depending on how fresh the data needs to be. Tier 1: Prerendered at Deploy The homepage fetches articles from the N