Dynamic Branding Checkout

Proof of concept comparing SPA vs SSR branding application

SPA Approach

Single Page Application that fetches branding configuration from the API on the client side. Shows a loading skeleton during fetch.

✓Client-side data fetching
✓Loading state with skeleton UI
✓Dynamic branding application

SSR Approach

Server-Side Rendering that applies branding configuration on the server. Page is rendered with branding already applied.

✓Server-side data fetching
✓No loading state needed
✓Pre-rendered with branding

Implementation Details

The branding configuration includes colors, logo, background image (>1MB), and company name. The SPA version fetches this data client-side with a loading transition, while the SSR version pre-renders the page with the configuration already applied on the server.