July 2025. SSR pages load slowly. 800ms for homepage. Unacceptable.
Vue SSR renders on every request. Database, templates, components - everything from scratch.
Idea
Render once, save HTML. Next request - serve ready file.
Implementation
Puppeteer. Opens page in headless Chrome, waits for load, saves HTML.
Works. Vue hydrates cached page. Fast.
Architecture
Request → Check cache
→ Cache hit: return HTML
→ Cache miss: Puppeteer renders, saves, returns
Separate container html-cache-generator. Heavy - Chrome weighs a lot. But works.
What it can do
- Generate HTML for any page
- Invalidate when content changes
- SEO - search engines see ready content
- Vue hydration picks up state
Result
Went from 800ms to 80ms for cached pages.
First version works. Some quirks with hydration - sometimes flickers when switching theme. Will figure it out.