SSR Banner
The SSR Banner pre-renders your consent banner on the server, so it appears on the very first paint — no JavaScript required for initial display. This eliminates Cumulative Layout Shift (CLS) and dramatically reduces Interaction to Next Paint (INP).
Why SSR matters for consent banners
Traditional consent management platforms inject banners via JavaScript. The browser has to download, parse, and execute the script before any banner HTML appears. This causes:
- Layout shift — content moves around when the banner pops in late
- Slow interaction — users see the page but can’t interact with the banner until JS loads
- Large initial JS payloads — most CMPs load 50-130KB of JavaScript before anything is visible
CookieBoss SSR solves all of these by rendering the banner HTML on the server before it reaches the browser.
Performance comparison
| Metric | Traditional CMP | CookieBoss SSR |
|---|---|---|
| CLS | 0.1 - 0.3 | 0 |
| INP | 200 - 500ms | < 50ms |
| Initial JS | 50 - 130KB | 3KB |
| Banner visible | 500ms+ | First paint |
The most impactful CMP performance optimization available
SSR Banner is the single biggest performance improvement you can make to your consent experience. If your site is on Cloudflare and you care about Core Web Vitals, this is a game-changer.
How it works
- SSR Worker intercepts HTML responses on your Cloudflare zone. When a visitor requests a page, the response passes through a CookieBoss Worker before reaching the browser.
- HTMLRewriter injects pre-rendered banner HTML into the page just before
</body>. The banner markup is fully formed — no JavaScript needed to create it. - A 3KB hydration script attaches click handlers to the server-rendered buttons. This tiny script makes the already-visible banner interactive.
- The full consent script loads asynchronously only after the user interacts with the banner. The ~25KB consent logic (preference management, cookie blocking, TCF, etc.) loads on demand.
The result: your visitors see the consent banner instantly, can interact with it almost immediately, and your page layout never shifts.
Requirements
- Your site must be on Cloudflare (using Cloudflare DNS with the orange cloud proxy enabled)
- Business plan or higher on CookieBoss
- CookieBoss team sets up the SSR Worker route on your Cloudflare zone
Setup
1. Verify your domain is on Cloudflare
Your domain must be proxied through Cloudflare (orange cloud icon in DNS settings). If you’re not on Cloudflare yet, you can migrate your DNS to Cloudflare without downtime.
2. Contact CookieBoss support
Reach out to support and request SSR Banner for your domain. Provide:
- Your CookieBoss site ID
- Your Cloudflare zone ID (found in the Cloudflare dashboard under Overview)
3. CookieBoss deploys the SSR Worker
Our team deploys the SSR Worker as a route on your Cloudflare zone. This typically takes less than 24 hours.
4. Publish your consent script
Publish your consent configuration as normal from the CookieBoss dashboard. The SSR output is generated automatically from your published configuration — same banner text, same styling, same categories.
5. Verify it’s working
Open your site and View Page Source (not Inspect Element). Search for cookieboss-ssr-root. If you find it in the HTML source, SSR is active.
You can also check in Chrome DevTools:
- Open the Network tab
- Reload the page
- Click on the main document request
- In the Response tab, search for
cookieboss-ssr-root
What SSR Banner does NOT do
- Does NOT require any code changes on your site. There’s nothing to install, no script tags to move, no build step to modify.
- Does NOT affect non-HTML resources. Images, CSS, JavaScript, fonts, and API calls pass through unchanged. Only HTML document responses are processed.
- Does NOT cache the rewritten HTML. Each response is personalized based on the visitor’s consent state. Returning visitors who already consented won’t see the banner in the server-rendered output.
- Does NOT replace your existing consent script. The SSR banner is a performance optimization layer on top of your normal CookieBoss setup. If SSR is ever disabled, the standard client-side banner takes over seamlessly.
How it interacts with your existing setup
If you already have the CookieBoss consent script installed on your site, SSR works alongside it:
- First visit: SSR injects the banner HTML server-side. The 3KB hydration script handles the initial interaction. The full consent script loads async when the user clicks.
- Return visit (consented): SSR detects the consent cookie and does not inject the banner. The full consent script still loads to enforce cookie blocking rules.
- Return visit (no cookie): Treated the same as a first visit — banner is injected server-side.
Remove the standard script tag after enabling SSR
Once SSR is active, you can optionally remove the standard CookieBoss <script> tag from your site. The SSR Worker handles script injection automatically. However, keeping both doesn’t cause any issues — the consent script detects when SSR is active and avoids rendering a duplicate banner.
Troubleshooting
Banner doesn’t appear in page source
- Verify your domain is proxied through Cloudflare (orange cloud)
- Check that the SSR Worker route is active in your Cloudflare dashboard under Workers Routes
- Ensure you’ve published your consent script at least once
Banner appears but isn’t interactive
- Check the browser console for JavaScript errors
- Verify the 3KB hydration script is loading (look for
cookieboss-hydratein the Network tab)
CLS is still showing in PageSpeed Insights
- Make sure you’re testing the live URL, not a cached version
- Clear Cloudflare’s cache after SSR is enabled: Caching > Configuration > Purge Everything
- Re-run the PageSpeed test after purging