⚡AgentSkills
🎨 Frontend Engineering · Rendering Strategy

Select rendering modes per route deliberately

Static/ISR/SSR/streaming/client mapped to freshness needs, personalization, and TTFB budgets.

advanced~40 minFrontend EngineersFull-Stack DevelopersDesign Engineers

Steps

  1. 1Classify routes: content volatility × personalization × interactivity
  2. 2Default static/ISR for public volatile-slow content with tag revalidation
  3. 3Reserve SSR for truly per-request data; stream shells for perceived speed
  4. 4Never client-fetch server-known data out of habit — that's a waterfall
  5. 5Document choice per route table; mixed strategies confuse debugging
  6. 6Measure TTFB+LCP per mode on real routes after each framework upgrade

Common Pitfalls

  • ▲Whole-app SPA conversion losing SEO overnight
  • ▲ISR windows serving stale prices beyond business tolerance

Commands

Install with skills CLI
$ npx skills add aniruddhaadak80/skills --skill rendering-strategy-rendering-mode-selection
Install globally
$ npx skills add aniruddhaadak80/skills --skill rendering-strategy-rendering-mode-selection -g

Tags

#ssr#isr#streaming#architecture#frontend-engineering#rendering-strategy

Related skills

Move heavy work off the main thread properlyadvanced

Worker pool sizing, transferable payloads, and Comlink-style RPC keeping UI at 60fps.

🎨 Frontend Engineering·~45m
Open →