Angular SSR Testing Dashboard

Testing the new server route features in Angular 20

🚀 Server-Side Rendering

Test SSR functionality with dynamic server-rendered content

RenderMode.ServerRendered on server, hydrated on client
Test SSR Route

âš¡ Client-Side Rendering

Test CSR functionality with client-only rendering

RenderMode.ClientRendered entirely on client
Test CSR Route

📄 Pre-rendered

Test static site generation with build-time rendering

RenderMode.PrerenderPre-rendered at build time
Test Prerender Route

Performance Comparison

Render ModeInitial LoadSEOInteractivityServer Load
SSRFastExcellentFullMedium
CSRSlowerPoorFullLow
PrerenderFastestExcellentLimitedLowest

How to Test

  1. Click on any of the test route buttons above
  2. Observe the load time and rendering information
  3. Check the browser's Network tab to see the differences
  4. Use browser dev tools to inspect the rendered HTML
  5. Compare the performance metrics between routes