Static Build or Dev Server: Choosing the Cheapest Option for Low‑Traffic Storybook

Answer the question first

For fewer than 100 page views per day, publishing a static Storybook build (storybook build) to a free static‑hosting tier is usually the cheapest option, often costing $0 per month. Running a lightweight storybook dev Node process incurs a small but non‑zero monthly compute charge (e.g., a $5‑$10 VPS or the equivalent serverless runtime) even when traffic is negligible.

Confirmed facts

• A static build produces only HTML, CSS and JavaScript assets that any static file host (GitHub Pages, Netlify free tier, Vercel hobby, Cloudflare Pages, etc.) can serve without running a server.
• At <100 views/day the bandwidth and request counts stay well within the free‑tier limits of most providers, so the marginal hosting cost is effectively zero.
• A storybook dev server is an always‑on Node.js process. Providers charge for uptime or allocated CPU/RAM, not per request, so even idle traffic generates a recurring bill.
• Static builds retain component previews, documentation pages, and any client‑side only addons. They lose live editing/HMR and any addon that requires a WebSocket connection to the Storybook server (e.g., certain controls, actions, or viewport addons that rely on server‑side state).
• Contributors can still run storybook dev locally for authoring; the hosted static version serves as a read‑only reference.

Likely explanation / trade‑offs

If the team does not need live editing or WebSocket‑dependent addons in the publicly hosted Storybook, the static build eliminates the compute cost entirely. The only remaining operational step is to rebuild and redeploy after each code change, which can be automated with a CI pipeline that runs on free CI minutes.

If live editing in the hosted instance is a hard requirement (e.g., remote designers need to tweak component props without pulling the repo), then a minimal dev server becomes necessary. In that case the cost is the price of the smallest always‑on instance that can run Node.js (often a $5/month VPS or the equivalent serverless allocation). The convenience of instant refresh must be weighed against that recurring expense.

Steps to verify the cheapest path for your project

1. Run storybook build locally and serve the output with a simple static server (e.g., npx serve -s storybook-static) to confirm that all required addons work without a Node server.
2. List the Storybook addons the team actually uses and test each in the static build; note any that fail or degrade.
3. Ask contributors: "Do you need to edit components or see live updates in the hosted Storybook, or is running Storybook locally sufficient for authoring?" This detail changes the recommendation.
4. If the answer is "no", publish the static build to a free static host and set up a CI step to rebuild on push.
5. If the answer is "yes", provision the smallest Node‑compatible instance (e.g., a $5/month VPS or a serverless function with sufficient runtime) and run storybook dev behind HTTPS with basic auth.