SSR and SSG in Olum: The Complete Guide

Olum supports three rendering modes out of the box: client-side rendering (CSR), server-side rendering (SSR), and static site generation (SSG). You can mix modes per-route — no separate framework needed.

Server-side rendering

SSR renders your components to HTML on the server on each request. This gives you fast first paint and full SEO indexability. Olum's SSR is streaming by default — HTML starts arriving in the browser before all data has loaded.

// pages/product/[id].olum
export async function load({ params }) {
  const product = await db.products.findById(params.id)
  if (!product) throw new NotFoundError()
  return { product }
}

export default function ProductPage({ product }) {
  return (
    <article>
      <h1>{product.name}</h1>
      <Price value={product.price} />
    </article>
  )
}

Static site generation

Export a paths() function from a page to pre-render it at build time. The output is plain HTML + JS — no server required. CDN-deployable in one command.

Incremental static regeneration

For pages that are static most of the time but need occasional updates, use ISR. Set a revalidate interval and Olum will regenerate the page in the background when it becomes stale — serving the cached version until the new one is ready.

• SSR: per-request rendering with streaming
• SSG: build-time pre-rendering, zero server cost
• ISR: stale-while-revalidate for dynamic-ish content
• Hybrid: mix modes freely per route