Static vs Dynamic Websites: What's the Difference?

Hosting providers ask "is it a static site?" Framework docs talk about "static generation" and "server-side rendering." AI tools produce apps that are one or the other — or a mix. The difference decides where your app can be hosted, how fast it is, how search engines see it, and what it costs.

Static: the same files for everyone

A static website is a set of finished files — HTML, CSS, JavaScript, images — sitting on a server. When someone visits, the server just hands them the files. Every visitor gets exactly the same thing.

It's like a printed brochure: produced once, handed out as-is.

Good for: marketing sites, blogs, documentation, portfolios.

Strengths:

Very fast — no work to do per request, and files can be served from a CDN near every user. (What Is a CDN?.)
Cheap or free to host.
Very secure — there's no server code to attack.
Handles huge traffic easily.

Limits: no logins, no personal data, no saving things — not without help from somewhere else.

Dynamic: pages built per request

A dynamic website runs code on a server for each request. It might check who you are, fetch your data from a database, and build a page just for you.

It's like a restaurant kitchen: each order is cooked when it's placed.

Good for: anything with accounts, dashboards, carts, or data that changes.

Strengths: personalised, up-to-date content; can keep secrets and enforce permissions on the server. (Frontend vs Backend.)

Costs: needs a server running your code, and a database; more to maintain and secure; each request does work.

The in-between: single-page apps

Many AI-built apps — especially from Lovable, Bolt, and plain React setups with Vite — are single-page apps (SPAs). The files themselves are static: one HTML page and a bundle of JavaScript. But once loaded, the JavaScript builds the interface in the browser and fetches data from an API or a service like Supabase.

So an SPA can be hosted like a static site, while still behaving dynamically — because the dynamic part lives in someone else's backend.

Two common SPA problems:

Refreshing a page gives a 404. The server only knows about index.html; /dashboard isn't a real file. The host must be configured to serve index.html for all routes (often called a "rewrite" or "SPA fallback").
Search engines and link previews may see a blank page, because the content only appears after JavaScript runs. (SEO Basics for Your App and Social Preview Images.)

Mixing both: modern frameworks

Frameworks like Next.js, Nuxt, SvelteKit, Remix, and Astro let you choose per page:

Static generation — the page is built once, at deploy time. Your blog posts and pricing page.
Server-side rendering — built on each request. Your dashboard.
Client-side rendering — built in the browser. Highly interactive parts.

This is usually the best of both: fast, search-friendly public pages and personalised app pages in the same project. (What Is Next.js?.)

How to tell what you've got

npm run build produces a dist/ or build/ folder of files, and there's no server code? Static or SPA.
Does package.json have a start script that runs a server (next start, node server.js)? Dynamic, or at least partly.
Is there an api/ folder, server actions, or a backend directory? Dynamic parts.
View the page source (Ctrl/Cmd + U) in the browser. Real content in the HTML? Rendered on a server or at build time. Just an empty <div id="root">? Client-rendered SPA.

Why it matters

Question	Static / SPA	Dynamic
Where can I host it?	Almost anywhere, often free	Somewhere that runs your server code
Where do secrets go?	Not in the app — they'd be public. A backend or service is needed.	On the server
SEO	Great if pre-rendered; weaker for client-only SPAs	Good
Speed	Very fast	Depends on server and database
Cost	Very low	Server plus database

The most important line is the second one. A static site or SPA sends everything to the browser. Any API key in it is visible to everyone. When an app needs secrets — payment keys, AI API keys — it needs a backend. (How to Keep API Keys Out of an AI-Built App.)

EasySpawn runs both: static and single-page front ends, and the always-on backend that dynamic features and secrets need — on your own domain with SSL. See how it works for AI-built apps or join the waitlist.