ssr-ssg
Deep workflow for SSR, SSG, ISR, and hybrid rendering—choosing modes per route, data freshness, caching, streaming, hydration, SEO, and operational trade-offs (Next.js, Nuxt, Remix, etc.). Use when tuning web apps for performance, correctness, and crawlability.
Why use this skill?
Master rendering architectures for your web apps. Use our deep workflow to optimize SSR, SSG, and ISR for performance, SEO, and cache efficiency.
Install via CLI (Recommended)
clawhub install openclaw/skills/skills/codekungfu/ssr-ssgWhat This Skill Does
The ssr-ssg skill provides a rigorous architectural framework for developers and architects tasked with designing web application rendering strategies. It moves beyond simple framework settings (Next.js, Nuxt, Remix) to treat rendering as a critical business and performance decision. The skill guides you through mapping routes against data freshness requirements, personalization needs, and infrastructure cost. By applying this six-stage workflow, you minimize common pitfalls like hydration mismatches, excessive server overhead, and suboptimal SEO, ensuring your application delivers content exactly as fast and as fresh as the business logic dictates.
Installation
To integrate this skill into your environment, run the following command via your terminal:
clawhub install openclaw/skills/skills/codekungfu/ssr-ssg
Use Cases
- Migrating Legacy Apps: Assessing which legacy pages should move from CSR to SSG or ISR.
- Performance Tuning: Resolving high TTFB in SSR-only applications by identifying candidate routes for static generation or streaming.
- SEO Optimization: Debugging why search engines are indexing stale content or failing to render dynamic client-side components.
- Complexity Management: Creating a clear, documented strategy for hybrid rendering architectures where some sections require absolute freshness while others demand sub-50ms load times.
Example Prompts
- "I'm building a dashboard where the header is static but the main inventory table updates every 30 seconds. Help me design a hybrid SSR-SSG strategy using the six-stage framework."
- "My Next.js site has a hydration error on the product page. Walk me through the data classification stage to see if I'm mixing server-only data with client-side state incorrectly."
- "Compare the cost and performance trade-offs of switching our marketing site from SSR to ISR. What invalidation logic should I implement for our CMS content?"
Tips & Limitations
- Documentation is Key: The output of this skill is a plan. Ensure your team maintains the generated matrix as the source of truth for routing decisions.
- Framework Awareness: While the skill applies to any framework, you must specify your stack (Next.js, Nuxt, etc.) to get context-specific syntax for caching and revalidation.
- Infrastructure Dependencies: Be mindful that some rendering modes require specific hosting capabilities (e.g., edge compute vs. Node.js servers). Always validate that your hosting environment supports the chosen strategy before committing to code.
Metadata
Not sure this is the right skill?
Describe what you want to build — we'll match you to the best skill from 16,000+ options.
Find the right skillPaste this into your clawhub.json to enable this plugin.
{
"plugins": {
"official-codekungfu-ssr-ssg": {
"enabled": true,
"auto_update": true
}
}
}