Why SSR?
Search engines need full HTML to index pages. A pure SPA serves empty HTML with JavaScript that renders client-side — invisible to crawlers.
Flowork's SSR strategy: Cloudflare Functions render complete HTML for bots, while Vue takes over for interactive users.
The Pattern
Every SSR function follows the same 3-step pattern:
Step 1: Extract Vue Assets
const indexRes = await env.ASSETS.fetch(new Request(${baseUrl}/index.html));
const rawHtml = await indexRes.text();
const jsMatches = rawHtml.match(/<\/script>/gi);
Step 2: Fetch Data
const article = await env.FLOWORK_KB.get(kb:${slug}, { type: "json" });
Step 3: Return Complete HTML
The function returns HTML with:- Full content visible in the DOM
- SEO meta tags (title, description, OG, Twitter)
- Schema.org structured data
- Vue JS/CSS scripts (so SPA takes over after load)
Edge Caching
SSR responses are cached at Cloudflare edge with 5-10 minute TTL. Cache is automatically purged when articles are updated via the publish API.