Thread by @noelcetaSEO

Everyone talks about crawl budget.

Nobody talks about rendering budget.

Google has limited resources to render JavaScript.

If your site requires too much rendering:

- Google doesn't render it fully
- Content stays invisible
- Rankings tank

Client's React site looked perfect. Google saw 30% of it: 🧵👇

1/ What is rendering budget

Google crawls your page → gets HTML.

If HTML has JavaScript:

- Google must render it (execute JS)
- Rendering takes resources
- Google has finite rendering capacity
- Complex sites may not render fully

The problem:
Your site uses React/Vue/Angular.
Every page needs rendering.
Google can't render millions of pages.
Your pages get partial rendering or none.

2/ How to check if you have rendering issues

Test 1: GSC URL Inspection

- Inspect any URL
- Compare "Crawled" vs "Rendered" HTML
- Different = rendering issues

Test 2: Disable JavaScript

- Chrome DevTools → Settings
- Disable JavaScript
- Reload page
- Can you see content?
- No = Google might not see it

Test 3: View Page Source

- Right-click → View Page Source
- Search for your content
- Not there = needs rendering

Client test results:

- Crawled HTML: Empty

- Rendered HTML: Full content
- Google rendering success rate: 70%
- 30% of pages not fully rendered

3/ The server-side rendering solution

Render HTML on server before sending to browser.

Next.js example:

javascript

`*// Server-side rendered*
export async function getServerSideProps() {
const data = await fetchData();
return { props: { data } };
}

function ProductPage({ data }) {
return

{data.title}

;
}`

HTML includes content.
Google doesn't need to render.
Instant indexing.

4/ The static generation alternative

Pre-render pages at build time.

Next.js static generation:

javascript

`export async function getStaticProps() {
const data = await fetchData();
return { props: { data } };
}

// Generates HTML at build time`

Best for:

- Product catalogs
- Blog posts
- Marketing pages

Client switched from CSR to SSG.
Google indexed 100% of pages.
Rankings improved across board.

5/ The dynamic rendering compromise

Serve different HTML to bots vs users.

User: Gets React SPA
Bot: Gets pre-rendered HTML

javascript

`const isBot = /googlebot|bingbot/i.test(userAgent);

if (isBot) {
return prerenderedHTML;
} else {
return reactApp;
}`

Google's stance: Acceptable if same content.

Tools:

- Prerender.io
- Rendertron
- Puppeteer (DIY)

Not ideal, but works.

6/ Optimizing for rendering budget

If you must use client-side rendering:

✅ Reduce JavaScript bundle size
✅ Code splitting (load only needed JS)
✅ Lazy load non-critical components
✅ Use static HTML for critical content
✅ Minimize third-party scripts
✅ Optimize Core Web Vitals

Check rendering in GSC:
Mobile Usability → Page experience
Monitor "Rendered" vs "Crawled" differences.

Rendering budget checklist:

✅ Content visible in page source (no JS needed)
✅ Critical content server-side rendered
✅ JavaScript bundle under 200KB
✅ Test with JS disabled
✅ Monitor GSC "Rendered" HTML
✅ No rendering errors in GSC
✅ Core Web Vitals pass

Client before optimization:

- 70% rendering success
- Slow indexing
- Poor rankings

After SSR implementation:

- 100% rendering success
- Fast indexing
- Rankings jumped

Don't let rendering kill your SEO.