rendering-strategies
Selecting the right rendering method directly impacts your site's SEO performance and user experience. This skill guides you through the tradeoffs between static site generation, server-side rendering, client-side rendering, and incremental static regeneration—helping you match each approach to your specific content requirements and business goals.
rendering-strategies helps you select the optimal rendering method—SSG, SSR, CSR, or ISR—based on your content type and SEO goals. Static site generation works best for content that changes infrequently; server-side rendering suits dynamic content that needs fresh HTML on every request; client-side rendering works for interactive apps but risks crawler visibility; incremental static regeneration balances freshness and performance. Match your choice to your content's update frequency and indexability requirements.
AI-generated summary based on this skill's SKILL.md
Install
kostja94/marketing-skills/rendering-strategies
git clone https://github.com/kostja94/marketing-skills
cp -r marketing-skills/skills/seo/technical/rendering-strategies ~/.claude/skills/rendering-strategiesFrequently asked questions
AI-generated answers based on this skill's SKILL.md and metadata
How to optimize rendering strategy for search engines?
rendering-strategies helps you select the optimal rendering method—SSG, SSR, CSR, or ISR—based on your content type and SEO goals. Static site generation works best for content that changes infrequently; server-side rendering suits dynamic content that needs fresh HTML on every request; client-side rendering works for interactive apps but risks crawler visibility; incremental static regeneration balances freshness and performance. Match your choice to your content's update frequency and indexability requirements.
What are the client-side rendering SEO problems?
rendering-strategies addresses CSR's core SEO challenge: critical content rendered by JavaScript may not appear in the initial HTML that crawlers receive. Google and AI bots can execute JavaScript, but delays and resource constraints mean some content gets missed. CSR also complicates crawling of dynamic routes and AJAX-loaded content. For SEO-critical pages, SSR or SSG ensures content is in initial HTML, making it immediately visible to all crawlers without relying on JavaScript execution.
How does Googlebot handle JavaScript and rendering?
rendering-strategies explains that Googlebot can render JavaScript, but with important caveats. It executes JS after fetching the page, yet resource limits, timeouts, and third-party script failures can prevent full rendering. Content that depends on client-side rendering may be delayed or missed entirely. For reliable crawler visibility, place critical content in initial HTML via SSR or SSG. This ensures Googlebot and other crawlers index your content on first fetch, without waiting for JavaScript execution.
What is incremental static regeneration (ISR) and when should you use it?
rendering-strategies defines ISR as a hybrid approach that pre-generates static pages at build time, then regenerates them on-demand when content updates. ISR combines SSG's performance and SEO benefits with the freshness of dynamic rendering. Use ISR for frequently-updated content where you need both fast page loads and current data—blogs with comments, product catalogs, or news sites. ISR reduces server load compared to SSR while keeping pages fresher than pure SSG.
How can you ensure critical content appears in initial HTML for crawler visibility?
rendering-strategies emphasizes placing all SEO-critical content—headings, body text, metadata—directly in the initial HTML response, not behind JavaScript. Use server-side rendering or static site generation to render content on the server before sending it to the browser. Audit component-level rendering: tabs, carousels, and navigation menus should either render their primary content upfront or use progressive enhancement. Avoid lazy-loading above-the-fold content, and test with Google's Mobile-Friendly Test to verify crawlers see your content.
Should you use dynamic rendering or prerendering as a fallback for SPA migration?
rendering-strategies recommends dynamic rendering or prerendering when migrating a single-page app to improve SEO without a full rewrite. Dynamic rendering detects crawlers and serves pre-rendered HTML while users get the interactive SPA. Prerendering services generate static snapshots of your pages ahead of time. Both are fallback strategies: they work but add complexity and cost. For long-term SEO, consider moving critical pages to SSR or SSG. These approaches are best as temporary solutions during migration, not permanent architecture.
SKILL.md
rendered from the published skill — quoted content, verbatim
SEO Technical: Rendering Strategies
Guides rendering strategy selection and optimization for search engine and AI crawler visibility. Golden rule: Page data and metadata must be available on page load without JavaScript execution for optimal SEO.
When invoking: On first use, if helpful, open with 1–2 sentences on what this skill covers and why it matters, then provide the main output. On subsequent use or when the user asks to skip, go directly to the main output.
Scope (Technical SEO)
- Static vs dynamic: SSG, SSR, ISR, CSR; when to use each
- Crawler behavior: Googlebot renders JS (with delays); AI crawlers do not
- Component-level: Content in initial HTML; tabs, carousels, nav
- Dynamic rendering:
(truncated - see the full file via the links below)
Read as markdown · JSON record · Browse the source repository
File tree — 1 file
skills/seo/technical/rendering-strategies/SKILL.md