What is a SPA?
A Single Page Application (SPA) is a web app that loads a single HTML page and dynamically updates content as the user interacts, without full page reloads. SPAs provide smooth, app-like user experiences through client-side routing, state management, and asynchronous data fetching.
Traditional SPAs can become heavy because all rendering logic runs on the client. Sigment solves this by allowing SPA-like behavior while also rendering HTML on the server for faster load times and better performance.
article about how to start with spa with sigment
Simple spa start from here
What is HTML-First Architecture?
HTML-First architecture means the server renders the base HTML of a page first, and client-side JavaScript enhances interactivity as needed. This improves initial load speed, SEO, and accessibility while still supporting dynamic client-side features.
Sigment lets you combine HTML-First rendering with SPA-like interactivity. Components are hydrated on the client only when necessary, giving you fast SSR and rich interactivity together.
Recommended reading: article about HTML-First Architecture
Check out an HTML-First example on GitHub to see it in action.
Mixing SSR and Client Components
With Sigment, you can mix server-rendered components and fully client-rendered components on the same page. This allows you to optimize performance while still providing dynamic, interactive experiences.
For example:
<div data-component="Hello" runAtServer></div>
This component is rendered on the server first and hydrated on the client as needed.
<div data-component="Counter"></div>
This component is fully rendered on the client and hydrated on the client as well.
This hybrid approach gives you flexibility: you can server-render critical content for SEO and fast first paint, while keeping interactive widgets fully client-side where necessary.