rendering
Bagaimana Google's Web rendering Service berjalan Anda JavaScript untuk bangun halaman ini indeks — plus rendering options (CSR, SSR, SSG, hydration, ISR, edge, dynamic) dan mereka SEO trade-offs.
1 sinyal bukti di halaman ini
- Alat aktif terkaitRaw vs. Rendered HTML Checker
rendering adalah langkah di mana Google berjalan Anda JavaScript di sebuah evergreen, headless Chrome — Web rendering Service — untuk bangun DOM ini indeks. ini happens untuk essentially setiap halaman, biasanya di dalam seconds-untuk-minutes, so old 'dua waves dari pengindeksan' model adalah largely outdated dan ada Tidak per-halaman render budget. renderer adalah stateless, tidak interact dengan halaman, dan caches hard. Anda rendering option decides Anda SEO risk: SSR, static/prerendering, dan hydration adalah safe; penuh rendering sisi klien adalah risky satu; dynamic rendering adalah sebuah workaround.
TL;DR — rendering adalah langkah di mana sebuah mesin pencari berjalan Anda halaman’s code — including JavaScript — di sebuah browser untuk bangun finished halaman, so ini dapat see Anda konten dan tautan. Google melakukan ini untuk basically setiap halaman di -nya Web rendering Service, dan ini biasanya berfungsi. Bagaimana Anda situs produces -nya HTML (server, browser, atau di bangun time) decides bagaimana safe Anda adalah.
Apa rendering adalah
Ketika Anda open sebuah halaman, Anda browser downloads beberapa HTML, lalu berjalan CSS dan JavaScript untuk bangun halaman Anda sebenarnya see. mesin pencari melakukan yang sama hal. rendering adalah langkah di mana sebuah mesin pencari berjalan Anda halaman’s code untuk bangun akhir versi dari halaman, so ini dapat baca konten dan ikuti tautan cara Anda dapat.
ini sits di middle dari bagaimana Google menangani sebuah halaman:
- crawl — Google downloads mentah HTML dari Anda URL.
- Render — Google berjalan halaman’s JavaScript di sebuah browser untuk bangun finished halaman.
- indeks — Google membaca itu finished halaman dan files ini away.
jika Anda konten hanya menampilkan up setelah JavaScript berjalan, Google memiliki untuk render halaman successfully sebelum ini dapat see ini. So rendering adalah bridge antara fetching sebuah halaman dan understanding ini.
Google renders di sebuah nyata (tetapi unusual) browser
Google’s renderer adalah called Web rendering Service (WRS). ini adalah sebuah headless Chrome itu’s “evergreen,” (terjemahan) “evergreen,” meaning ini mempertahankan up dengan saat ini versi dari Chrome dan mendukung modern web fitur. So old fear — “Google tidak dapat jalankan JavaScript” (terjemahan) “Google dapat’t jalankan JavaScript” — tidak benar. ini dapat. Bukti untuk klaim ini Google Search runs JavaScript with an evergreen version of Chromium. Cakupan: Google's Web Rendering Service; browser support does not guarantee that every application-specific interaction or resource will work. Tingkat keyakinan: tinggi · Diverifikasi: Google Search Central: Fix Search-related JavaScript problems
ini adalah hanya sebuah unusual browser. ini tidak scroll atau click, ini forgets semuanya antara halaman (Tidak staying logged di), dan ini caches files hard. itu quirks adalah di mana sebagian besar surprises come dari, dan Advanced tab covers them.
big pilihan: di mana Anda HTML mendapatkan dibangun
single sebagian besar penting decision untuk SEO adalah di mana Anda halaman’s HTML adalah produced:
- di browser (rendering sisi klien) — server mengirim sebuah near-empty halaman dan JavaScript membangun semuanya. Riskiest untuk penelusuran.
- pada server (rendering sisi server) — server mengirim sebuah menyelesaikan halaman. Safe.
- di bangun time (static / prerendering) — halaman adalah dibangun setelah, ahead dari time. Safest dan fastest.
sebagian besar modern kerangka kerja mix ini. aturan dari thumb: jika Anda penting konten adalah di HTML sebelum apa pun JavaScript berjalan (atau arrives hampir immediately), Anda’re di baik shape.
ingin deeper versi — bagaimana Web rendering Service sebenarnya behaves, apakah “two waves of indexing” (terjemahan) “dua waves dari pengindeksan” adalah masih sebuah hal, dan sebuah penuh perbandingan dari setiap rendering option? Switch untuk Advanced tab. untuk practical JavaScript masalah dan memperbaiki, see JavaScript SEO.
TL;DR — Google renders Anda JS di sebuah evergreen, headless Chromium — Web rendering Service — untuk bangun DOM ini indeks. ini happens untuk essentially semua halaman, biasanya di dalam seconds-untuk-minutes, so “two waves of indexing” (terjemahan) “dua waves dari pengindeksan” adalah largely outdated dan ada Tidak per-halaman render budget. WRS adalah stateless, declines permission prompts, tidak interact dengan halaman, dan caches aggressively. Anda rendering option decides Anda SEO risk: SSR / static / prerendering / hydration adalah rendah-risk; penuh CSR adalah risky satu; dynamic rendering adalah sebuah workaround Google advises terhadap. untuk practical JS masalah ini membuat, see JavaScript SEO.
Di mana rendering sits
«Google is explicit that JavaScript apps move through three phases: “Google processes JavaScript web apps in three main phases: 1. Crawling 2. Rendering 3. Indexing.” Bukti untuk klaim ini Google documents crawling, rendering, and indexing as the three main phases for processing JavaScript web apps. Cakupan: Google Search processing of JavaScript web applications; the phases can overlap operationally. Tingkat keyakinan: tinggi · Diverifikasi: Google Search Central: Understand the JavaScript SEO basics Rendering is the bridge. Crawling fetches the raw HTML; rendering runs the JavaScript to build the finished DOM; indexing reads that rendered DOM, and any new links the renderer finds get fed back into crawling. In Google’s words: “During the crawl, Google renders the page and runs any JavaScript it finds using a recent version of Chrome, similar to how your browser renders pages you visit.” » (Terjemahan) (Ringkasan bahasa Indonesia untuk bagian dua puluh satu, bagian kecil satu: teks sumber dipertahankan agar dapat diperiksa dalam tinjauan penutur asli.)
Google melakukan crawl sebuah URL, renders -nya JavaScript untuk bangun DOM, dan indeks hasil. Four practical failure modes branch dari rendering: parity ketika dirender DOM differs dari expectations, interaction ketika konten memerlukan sebuah scroll atau click, state ketika konten relies pada cleared cookies atau storage, dan timing ketika konten adalah deferred behind slow JavaScript.
© Patrick Stox LLC · CC BY 4.0 ·
Web rendering Service
Google renders di Web rendering Service (WRS) — sebuah headless Chrome itu’s evergreen: “Sementara Google Search berjalan JavaScript dengan an evergreen version dari Chromium…” (terjemahan) “Sementara Google Search berjalan JavaScript dengan sebuah evergreen versi dari Chromium…” ini tracks saat ini Chrome, so modern JavaScript dan CSS fitur berfungsi.
catch adalah itu WRS adalah sebuah peculiar browser, dan -nya quirks penyebab sebagian besar nyata masalah:
«- It’s stateless. As I put it in my JavaScript SEO guide, “Google loads each page stateless like it’s a fresh load.” Google’s docs spell out the pieces: “Local Storage and Session Storage data are cleared across page loads” and “HTTP Cookies are cleared across page loads.” Don’t rely on anything persisted client-side to serve your content.
- It declines permissions. “Expect Googlebot to decline user permission requests.” Content gated behind a geolocation, notification, or camera prompt won’t render.
- It doesn’t interact. No scrolling, clicking, or hovering — so content that only loads on one of those events is invisible by default. (This is the root of most lazy-load and infinite-scroll bugs; the fixes live on the JavaScript SEO page.)
- It caches aggressively. “Googlebot caches aggressively in order to reduce
network requests and resource usage. WRS may ignore caching headers.” That means
Google can run an outdated version of your JS or CSS. Fix it with file
fingerprinting — version your filenames (
app.4f2a9c.js) so a content change forces a fresh fetch. » (Terjemahan) (Ringkasan bahasa Indonesia untuk bagian dua puluh enam, bagian kecil satu: teks sumber dipertahankan agar dapat diperiksa dalam tinjauan penutur asli.)
sebuah 2026 experiment: five seconds adalah tidak sebuah hard execution wall
sebuah ketiga-party WRS experiment reported di July 2026 tested delayed JavaScript dan network activity alih-alih assuming sebuah five-kedua timeout. observed renderer digunakan sebuah virtual clock dan selesai delayed permintaan itu took roughly 6–12 seconds dari nyata time. berguna hasil adalah sempit: ini contradicts umum audit aturan itu apa pun occurring setelah persis five seconds adalah secara otomatis invisible untuk Google. ini melakukan tidak prove itu setiap delayed dependency akan finish, itu Google menunggu indefinitely, atau itu slow client-side pengiriman adalah safe.
Baca experiment dan -nya methodology sebagai ketiga-party evidence alongside Google’s official statement itu render-queue timing memiliki Tidak published fixed delay. dalam praktik, test akhir DOM dan requested resources. sebuah missing API respons, interaction requirement, blocked script, atau state dependency tetap sebuah nyata rendering failure bahkan ketika sebuah stopwatch-based “five-kedua aturan” adalah tidak.
adalah “two waves of indexing” (terjemahan) “dua waves dari pengindeksan” masih sebuah hal?
untuk tahun mental model adalah “two waves of indexing” (terjemahan) “dua waves dari pengindeksan”: Google akan indeks mentah HTML pertama, lalu come back days atau weeks kemudian untuk render dan indeks JavaScript konten. itu model adalah now largely outdated. Martin Splitt memiliki mengatakan dua-waves idea plays lebih sedikit dan lebih sedikit dari sebuah role, itu banyak halaman go melalui render phase bahkan ketika mereka jangan rely pada JavaScript, dan itu crawling, rendering, dan pengindeksan adalah converging di atas time.
dalam praktik, rendering happens untuk essentially setiap halaman, dan ini adalah biasanya fast. Google’s saat ini documentation says sebuah di-crawl halaman “may stay on this queue for a few seconds, but it can take longer than that” (terjemahan) “dapat stay pada ini queue untuk sebuah sedikit seconds, tetapi ini dapat take lebih lama daripada itu” — ada Tidak published fixed delay atau timeout. Bukti untuk klaim ini Google says a crawled page may stay on the rendering queue for a few seconds, but it can take longer than that. Cakupan: Google's rendering queue for a page that returns a 200 status and is eligible for rendering. The source gives a variable duration, not a fixed timeout or service-level guarantee. Tingkat keyakinan: tinggi · Diverifikasi: Google Search Central: rendering-queue duration Mendukung: A page may remain on the rendering queue for a few seconds or longer. sebagai sebuah historical data poin, Google staf (Martin Splitt dan Tom Greenaway) setelah put figure di sebuah median dari tentang five seconds, dengan 90th percentile di minutes — tidak “weeks” (terjemahan) “weeks” old fear implied. I cite itu figure di my JavaScript SEO guide, tetapi treat ini sebagai sebuah dated conference data poin alih-alih sebuah saat ini published metric — Google hasn’t republished ini sebagai sebuah ongoing angka, dan queue-timing quote di atas adalah saat ini official framing.
dan ada Tidak render budget di cara orang imagine. Google tidak track sebuah per-halaman “bagaimana expensive adalah ini untuk render” (terjemahan) “bagaimana expensive adalah ini untuk render” score Anda perlu conserve. rendering adalah cheap di Google’s scale — mengoptimalkan untuk Anda pengguna dan performa, tidak sebuah phantom render budget.
rendering options
“Di mana adalah itu HTML built?” (terjemahan) “Di mana adalah HTML dibangun?” adalah pertanyaan itu decides Anda SEO risk. penuh menu:
Static generation produces HTML di bangun time. rendering sisi server produces ini per permintaan. rendering sisi klien relies pada browser JavaScript. Hydration attaches client perilaku untuk server atau static HTML. Dynamic rendering varies output oleh requester dan adalah treated sebagai sebuah workaround.
© Patrick Stox LLC · CC BY 4.0 ·
- rendering sisi klien (CSR). server mengirim sebuah near-empty shell; browser (atau WRS) berjalan JavaScript untuk bangun semuanya. ini adalah “itu paling problematic satu … penuh client-side rendering di mana all dari itu rendering happens di itu browser.” (terjemahan) “paling problematic satu … penuh rendering sisi klien di mana semua dari rendering happens di browser.” ini dapat berfungsi, tetapi Anda’re betting semuanya pada render succeeding, dan ini adalah slowest untuk mendapatkan terindeks.
- rendering sisi server (SSR). server membangun penuh HTML untuk setiap permintaan. konten adalah di mentah HTML, so ini adalah rendah-risk untuk penelusuran.
- Static situs generation (SSG) / prerendering. HTML adalah dibangun setelah di deploy time. Lowest risk — konten adalah di mentah HTML dan ini adalah fast.
- Hydration (isomorphic / universal). Anda SSR atau SSG pertama paint, lalu JavaScript “hydrates” (terjemahan) “hydrates” ini di browser untuk tambahkan interactivity. ini adalah apa sebagian besar modern kerangka kerja melakukan, dan ini adalah rendah-risk untuk konten — hanya watch untuk hydration mismatches itu blank out atau replace konten.
- Incremental Static Regeneration (ISR). Static halaman regenerated pada sebuah schedule atau pada demand. Like SSG, dengan fresher konten — baik untuk besar catalogs.
- Edge rendering. SSR jalankan di CDN edge nodes — sama rendah risk sebagai SSR, dengan lebih cepat time-untuk-pertama-byte untuk sebuah global audience.
- Streaming SSR. HTML streamed untuk browser di chunks sebagai ini adalah ready. rendah-risk, tetapi pastikan dapat diindeks konten tidak trapped hanya di sebuah late atau deferred chunk.
My bottom line dari my JavaScript SEO guide: “Any kind dari SSR, static rendering, dan prerendering setup adalah going untuk menjadi fine untuk penelusuran engines. Gatsby, Berikutnya, Nuxt, dan seterusnya., adalah all great.” (terjemahan) “apa pun jenis dari SSR, static rendering, dan prerendering setup adalah going untuk menjadi fine untuk mesin pencari. Gatsby, Berikutnya, Nuxt, dan seterusnya., adalah semua great.” kerangka kerja penting lebih sedikit daripada rendering mode Anda ship — yang sama Berikutnya.js app adalah safe atau risky depending pada apakah Anda sajikan SSR/SSG atau penuh CSR.
Dynamic rendering — sebuah workaround, tidak sebuah strategy
«Dynamic rendering means detecting bots and serving them a prerendered, JavaScript-free version while users get the client-side version. Google is now blunt about it: “Dynamic rendering was a workaround and not a long-term solution for problems with JavaScript-generated content in search engines,” and “Dynamic rendering is a workaround and not a recommended solution, because it creates additional complexities and resource requirements.” Bukti untuk klaim ini Google describes dynamic rendering as a workaround and does not recommend it as a long-term solution. Cakupan: Google Search guidance for JavaScript-generated content; server-side rendering, static rendering, or hydration are the recommended alternatives. Tingkat keyakinan: tinggi · Diverifikasi: Google Search Central: Dynamic rendering as a workaround I agree, and I always have — to be honest I never recommended it, and I’m glad Google now recommends against it too. It’s serving different content to bots and users, which is awfully close to cloaking. Reach for SSR, static, or hydration instead. » (Terjemahan) (Ringkasan bahasa Indonesia untuk bagian empat puluh, bagian kecil satu: teks sumber dipertahankan agar dapat diperiksa dalam tinjauan penutur asli.)
«One wrinkle: Bing still suggests dynamic rendering. Microsoft says “bingbot is generally able to render JavaScript” but that doing it at scale is hard, so “we recommend dynamic rendering as a great alternative for websites relying heavily on JavaScript.” The practical takeaway: SSR/SSG keeps both engines happy and sidesteps the whole debate. » (Terjemahan) (Ringkasan bahasa Indonesia untuk bagian empat puluh satu, bagian kecil satu: teks sumber dipertahankan agar dapat diperiksa dalam tinjauan penutur asli.)
Apa ini berarti untuk Anda konten
rendering decides apakah Google ever sees Anda JavaScript konten — tetapi seeing ini adalah
hanya half job. Setelah halaman adalah dirender, practical concerns adalah nyata <a href>
tautan, field-spesifik parity antara mentah dan dirender HTML, robots-directive stage order, lazy
konten, infinite scroll, dan soft-404s. itu semua langsung pada
JavaScript SEO halaman, dengan testing
workflow (pemeriksaan URL’s dirender HTML, screenshot, dan console).
ini adalah rendering stage dari penelusuran pipeline. untuk stages sekitar ini, see crawling (bagaimana halaman mendapatkan fetched) dan pengindeksan (apa happens untuk dirender halaman berikutnya), atau Bagaimana Penelusuran berfungsi hub untuk seluruh journey.
Satu audit aturan adalah worth mempertahankan di sini: dirender adalah sebuah state, tidak sebuah universal winner.
untuk body konten dan dapat di-crawl tautan, dirender DOM menampilkan apa successful JavaScript
ditambahkan atau dihapus. untuk judul dan deskripsi, ini menampilkan additional inputs, sementara Google
dapat masih generate sebuah judul tautan atau snippet dari lainnya sources. untuk robots directives, sebuah
mentah noindex dapat mencegah rendering, so JavaScript removal adalah asymmetric. untuk canonical,
Google advises menggunakan satu sumber atau satu JavaScript-set nilai alih-alih mengubah sebuah
existing nilai. dan JavaScript cannot perubahan respons HTTP status sudah diterima.
pertahankan itu columns terpisah di evidence dan gunakan Google’s saat ini JavaScript SEO
guidance
untuk field-spesifik perilaku.
AI summary
sebuah condensed take pada Advanced versi:
«- Rendering = the bridge from crawling to indexing. Google runs your JS in an evergreen, headless Chromium — the Web Rendering Service — to build the DOM it indexes. Three phases: crawl → render → index.
- “Two waves of indexing” is largely outdated (Splitt). Rendering happens for essentially all pages, usually fast. Google’s current docs say a page “may stay on this queue for a few seconds, but it can take longer than that” — no fixed delay is published. (A ~5s median/minutes-90th-percentile figure exists, but it’s a dated conference data point, not a current metric.) There is no per-page render budget.
- The WRS is a weird browser: stateless (localStorage/cookies cleared between loads), declines permission prompts, does not scroll/click/hover, and caches JS/CSS aggressively (may ignore cache headers) → fingerprint your filenames.
- Rendering options, by SEO risk: SSG/prerender (lowest) ≈ SSR ≈ hydration ≈ ISR ≈ edge/streaming (low) ≪ full CSR (highest). Patrick: “SSR, static rendering, and prerendering … are all great”; full CSR is “the most problematic one.”
- Dynamic rendering is a workaround, Google advises against it (close to cloaking). Bing still recommends it — but SSR/SSG satisfies both.
- The framework doesn’t decide risk — the rendering mode does. The same app is safe or risky depending on whether you ship SSR/SSG or full CSR. » (Terjemahan) (Ringkasan bahasa Indonesia untuk bagian lima puluh, bagian kecil satu: teks sumber dipertahankan agar dapat diperiksa dalam tinjauan penutur asli.) «- Rendering is half the job — the practical JS problems (links, parity, lazy content, infinite scroll, soft-404s, testing) are covered on the JavaScript SEO page. » (Terjemahan) (Ringkasan bahasa Indonesia untuk bagian lima puluh, bagian kecil dua: teks sumber dipertahankan agar dapat diperiksa dalam tinjauan penutur asli.)
Dokumentasi resmi
Utama-sumber documentation dari mesin pencari.
- memahami JavaScript SEO basics — three phases (crawl → render → indeks) dan evergreen Chromium renderer.
- Perbaiki Penelusuran-related JavaScript masalah — WRS constraints: stateless storage/cookies, declined permissions, aggressive caching.
- Dynamic rendering sebagai sebuah workaround — mengapa dynamic rendering adalah sebuah workaround, tidak sebuah recommended panjang-istilah solusi.
- di-Depth Guide untuk Bagaimana Google Search berfungsi — di mana rendering sits di crawl → indeks → sajikan.
Bing / Microsoft
- bingbot Series: JavaScript, Dynamic rendering, dan Cloaking. Oh My! — Bing’s stance itu ini dapat render JS tetapi recommends dynamic rendering di scale.
- baru evergreen Bingbot — Bingbot rendering pada Chromium-based Microsoft Edge.
Quotes dari sumber
pada—record statements dari Google dan Bing (plus sebuah sedikit dari my own writing). setiap penelusuran-mesin tautan adalah sebuah deep tautan itu jumps untuk quoted passage pada sumber halaman.
Google — render pipeline
«- “Google processes JavaScript web apps in three main phases: 1. Crawling 2. Rendering 3. Indexing.” Jump to quote
- “During the crawl, Google renders the page and runs any JavaScript it finds using a recent version of Chrome, similar to how your browser renders pages you visit.” Jump to quote
- “While Google Search runs JavaScript with an evergreen version of Chromium…” Jump to quote
- “The page may stay on this queue for a few seconds, but it can take longer than that.” — the current official framing on render-queue timing; no fixed delay is published. Jump to quote » (Terjemahan) (Ringkasan bahasa Indonesia untuk bagian enam puluh dua, bagian kecil satu: teks sumber dipertahankan agar dapat diperiksa dalam tinjauan penutur asli.)
Google — Web rendering Service
«- “Local Storage and Session Storage data are cleared across page loads.” Jump to quote
- “HTTP Cookies are cleared across page loads.” Jump to quote
- “Expect Googlebot to decline user permission requests.” Jump to quote
- “Googlebot caches aggressively in order to reduce network requests and resource usage. WRS may ignore caching headers.” Jump to quote » (Terjemahan) (Ringkasan bahasa Indonesia untuk bagian enam puluh empat, bagian kecil satu: teks sumber dipertahankan agar dapat diperiksa dalam tinjauan penutur asli.)
Google — dynamic rendering
«- “Dynamic rendering was a workaround and not a long-term solution for problems with JavaScript-generated content in search engines.” Jump to quote » (Terjemahan) (Ringkasan bahasa Indonesia untuk bagian enam puluh enam, bagian kecil satu: teks sumber dipertahankan agar dapat diperiksa dalam tinjauan penutur asli.) «- “Dynamic rendering is a workaround and not a recommended solution, because it creates additional complexities and resource requirements.” Jump to quote » (Terjemahan) (Ringkasan bahasa Indonesia untuk bagian enam puluh enam, bagian kecil dua: teks sumber dipertahankan agar dapat diperiksa dalam tinjauan penutur asli.)
Microsoft Bing
- “bingbot adalah generally able untuk render JavaScript…” (terjemahan) “bingbot adalah umumnya able untuk render JavaScript…” Jump untuk quote
- “we merekomendasikan dynamic rendering sebagai a great alternative untuk websites relying heavily pada JavaScript.” (terjemahan) “kami merekomendasikan dynamic rendering sebagai sebuah great alternative untuk situs web relying heavily pada JavaScript.” Jump untuk quote
Martin Splitt, Google (relayed melalui Onely’s transcript dari sebuah 2019 Webmaster Central hangout)
- pada dua-waves model: Splitt memiliki mengatakan ini plays lebih sedikit dan lebih sedikit dari sebuah role, itu banyak situs go melalui render phase bahkan tanpa JavaScript, dan itu crawling, rendering, dan pengindeksan adalah converging. Baca coverage
Patrick Stox (my own berfungsi — JavaScript SEO: sebuah Definitive Guide)
- “Google loads each page stateless like it’s a fresh load.” (terjemahan) “Google memuat setiap halaman stateless like ini adalah sebuah fresh muat.”
- “pages went to the renderer at a median time of five seconds” (terjemahan) “halaman went untuk renderer di sebuah median time dari five seconds” (90th percentile di minutes) — sebuah dated conference-era data poin, tidak sebuah saat ini published metric; see saat ini official queue-timing quote di atas.
- “The most problematic one is going to be full client-side rendering where all of the rendering happens in the browser.” (terjemahan) “paling problematic satu adalah going untuk menjadi penuh rendering sisi klien di mana semua dari rendering happens di browser.”
- “Any kind of SSR, static rendering, and prerendering setup is going to be fine for search engines. Gatsby, Next, Nuxt, etc., are all great.” (terjemahan) “apa pun jenis dari SSR, static rendering, dan prerendering setup adalah going untuk menjadi fine untuk mesin pencari. Gatsby, Berikutnya, Nuxt, dan seterusnya., adalah semua great.”
mental models
1. crawl → render → indeks. rendering adalah bridge. crawling fetches mentah HTML; rendering berjalan JS untuk bangun DOM; pengindeksan membaca itu DOM. Ketika JS konten goes missing, tanyakan yang langkah failed — adalah ini fetched? dirender? melakukan dirender DOM berisi konten?
2. renderer adalah sebuah nyata browser dengan amnesia. Evergreen Chrome, tetapi stateless (forgets cookies/storage antara halaman), Tidak interaction (tidak akan scroll atau click), dan cache-happy (dapat jalankan stale JS/CSS). Design sebagai jika setiap visit adalah sebuah fresh, untouched, pertama muat.
3. rendering mode decides Anda risk, tidak Anda kerangka kerja. SSR, static, prerender, dan hydration semua put konten di (atau quickly ke) DOM — rendah risk. Penuh CSR bets semuanya pada render — highest risk. yang sama Berikutnya.js app adalah safe atau risky depending pada yang mode Anda ship.
4. “Dua waves” (terjemahan) “Dua waves” adalah old map. jangan plan sekitar sebuah deferred kedua wave dari rendering days kemudian. rendering happens untuk essentially semua halaman, biasanya di dalam seconds-untuk-minutes — dan ada Tidak render budget untuk ration.
5. Dynamic rendering adalah sebuah smell, tidak sebuah strategy. Serving bot berbeda HTML daripada pengguna adalah sebuah workaround Google advises terhadap (dan adalah close untuk cloaking). jika Anda’re reaching untuk ini, nyata perbaiki adalah biasanya SSR/SSG.
6. Mendapatkan konten ke DOM, lalu verify. Pick sebuah mode itu puts konten di dirender DOM quickly, lalu konfirmasi dengan URL Inspection’s dirender HTML. Anda browser tidak Googlebot.
rendering options — SEO trade-offs
| Option | Di mana HTML adalah dibangun | SEO risk | Reach untuk ini ketika |
|---|---|---|---|
| CSR (client-side) | browser/WRS berjalan JS; server mengirim sebuah shell | Highest — bergantung pada render success; slowest untuk indeks | App-like, gated, atau rendah-SEO-nilai views |
| SSR (server-side) | server, per permintaan | rendah — konten di mentah HTML | Dynamic / personalized / fast-mengubah konten |
| SSG / static / prerender | di deploy time | Lowest — di mentah HTML dan fast | konten situs, docs, blogs, marketing |
| Hydration (isomorphic/universal) | SSR/SSG paint, lalu JS hydrates | rendah — watch hydration mismatches | sebagian besar modern kerangka kerja |
| ISR (incremental static regen) | Static, regenerated pada schedule/pada-demand | rendah — fresher SSG | besar catalogs needing periodic freshness |
| Edge rendering | SSR di CDN edge | rendah — lebih cepat TTFB | Global, latency-sensitive SSR |
| Streaming SSR | HTML streamed di chunks | rendah — pertahankan dapat diindeks konten out dari late chunks | performa-critical SSR apps |
| Dynamic rendering | bot mendapatkan prerender, pengguna mendapatkan CSR | Workaround hanya — Google advises terhadap | Terakhir resort untuk legacy CSR |
«## Web Rendering Service — quick facts » (Terjemahan) (Ringkasan bahasa Indonesia untuk bagian delapan puluh tujuh, bagian kecil satu: teks sumber dipertahankan agar dapat diperiksa dalam tinjauan penutur asli.)
| perilaku | Apa ini berarti untuk Anda |
|---|---|
| Evergreen headless Chromium | Modern JS/CSS berfungsi; Tidak perlu untuk transpile untuk sebuah old mesin |
| Stateless (storage + cookies cleared) | jangan rely pada persisted client state untuk sajikan konten |
| Declines permission prompts | konten behind geolocation/notifications/camera tidak akan render |
| tidak scroll, click, atau hover | muat konten pada viewport, tidak pada interaction |
| Caches JS/CSS aggressively | Fingerprint filenames (app.4f2a9c.js) so perubahan adalah picked up |
| Renders untuk ~semua halaman, biasanya di seconds-untuk-minutes | Tidak “dua waves,” (terjemahan) “dua waves,” Tidak render budget untuk ration |
Render-readiness audit checklist
sebuah lulus untuk konfirmasi Anda penting konten sebenarnya survives rendering:
- Utama konten dan main navigation tautan adalah present di mentah HTML respons (view sumber, tidak DevTools’ inspected DOM) — tidak injected hanya setelah JavaScript berjalan.
- setiap internal tautan sebuah reader perlu untuk ikuti adalah sebuah nyata
<a href="...">— tidak sebuah<div onclick>, sebuah hash-hanya route (#/page), atau sebuah button itu pushes state client-side dengan Tidak matching tautan. - Tidak critical JS atau CSS files adalah blocked di
robots.txt(sebuah blocked bundle dapat leave WRS unable untuk bangun halaman ini perlu untuk render). - konten itu memuat pada scroll, hover, atau click juga memiliki sebuah path itu renders tanpa apa pun interaction — WRS tidak scroll, click, atau hover.
- Tidak ada apa pun penting bergantung pada
localStorage,sessionStorage, atau cookies persisting antara permintaan — WRS adalah stateless dan clears semua dari itu antara halaman memuat. - Tidak ada apa pun penting sits behind sebuah geolocation, notification, atau camera permission prompt — WRS declines itu oleh default.
- JS/CSS filenames adalah fingerprinted (
app.4f2a9c.js) so sebuah konten perubahan forces sebuah fresh fetch alih-alih getting disajikan dari WRS’s aggressive cache. - pemeriksaan URL’s dirender HTML/screenshot di Google Search Console menampilkan yang sama konten dan tautan Anda see di Anda own browser.
- situs tidak menggunakan dynamic rendering sebagai -nya jawaban untuk sebuah CSR masalah — perbaiki adalah SSR, static rendering, atau hydration, tidak serving bot sebuah berbeda versi dari halaman.
rendering mistakes itu sebenarnya bite
Blocking JS atau CSS halaman perlu untuk render, di robots.txt.
jika WRS dapat’t fetch sebuah script atau stylesheet halaman bergantung pada, ini dapat’t
bangun sebuah accurate dirender DOM — Anda mendapatkan sebuah rusak atau empty render alih-alih
halaman Anda yang dimaksud. melakukan alih-alih: izinkan crawling dari Anda JS/CSS assets;
robots.txt seharusnya pertahankan bot out dari rendah-nilai spaces, tidak resources Anda
own halaman perlu.
Shipping konten-critical halaman sebagai penuh rendering sisi klien (CSR) dengan Tidak fallback. CSR adalah “the most problematic one … full client-side rendering where all of the rendering happens in the browser” (terjemahan) “paling problematic satu … penuh rendering sisi klien di mana semua dari rendering happens di browser” — ini bets Anda entire halaman pada render succeeding, dan ini adalah slowest option untuk mendapatkan terindeks. melakukan alih-alih: reach untuk SSR, static generation/prerendering, atau hydration so konten adalah di (atau very quickly ke) mentah HTML.
Relying pada hash-based routes (#/product/123) sebagai Anda hanya navigation.
WRS mengikuti nyata <a href> tautan; sebuah hash fragment itu hanya perubahan
client-side state, dengan Tidak server-dirender equivalent URL, memberikan renderer
tidak ada apa pun untuk crawl onward untuk. melakukan alih-alih: gunakan nyata paths server dapat respond
untuk secara langsung (/product/123), bahkan di sebuah client-berat app.
Lazy-memuat konten dengan Tidak non-interactive path untuk ini. Karena WRS “doesn’t scroll, click, or hover,” (terjemahan) “tidak scroll, click, atau hover,” konten itu hanya muncul setelah satu dari itu events adalah invisible untuk ini oleh default. melakukan alih-alih: muat di atas—fold dan reasonably-near-viewport konten tanpa requiring sebuah interaction, dan reserve benar lazy-memuat untuk konten genuinely di bawah fold dengan sebuah proper non-JS fallback.
Treating dynamic rendering sebagai sebuah panjang-istilah perbaiki alih-alih sebuah workaround. Google adalah jelas itu “dynamic rendering is a workaround and not a recommended solution, because it creates additional complexities and resource requirements” (terjemahan) “dynamic rendering adalah sebuah workaround dan tidak sebuah recommended solusi, karena ini membuat additional complexities dan resource requirements” — dan serving bot berbeda konten daripada pengguna sits uncomfortably close untuk cloaking. melakukan alih-alih: perbaiki rendering mode itself (SSR/static/hydration) alih-alih membangun sebuah bot-detection layer sekitar sebuah CSR masalah.
Validation tests
Lulus/fail memeriksa untuk konfirmasi sebuah rendering perbaiki sebenarnya took effect — jalankan ini setelah Anda ship perubahan, tidak sebagai sebuah ongoing health metric.
Test: konten now muncul di dirender DOM
- Test untuk jalankan — Submit URL untuk Google Search Console’s URL Inspection alat dan gunakan “Test Langsung URL,” (terjemahan) “Test Langsung URL,” lalu open dirender HTML tab (atau jalankan halaman melalui Render Kesenjangan alat untuk diff mentah vs. dirender HTML secara langsung).
- Yang diharapkan hasil — konten Anda ditambahkan atau fixed muncul di dirender HTML/DOM view, tidak hanya di Anda own browser’s dev alat.
- Failure interpretation — jika ini adalah masih missing dari dirender HTML tetapi present ketika Anda view halaman biasanya, WRS masih dapat’t bangun ini — periksa untuk sebuah blocked JS/CSS resource, sebuah interaction-hanya muat, atau sebuah client-storage dependency sebelum assuming perbaiki worked.
- Monitoring window — Immediate; pemeriksaan URL’s pengujian langsung reflects saat ini state dari URL right away.
- Rollback trigger — dirender HTML masih tidak berisi konten setelah perbaiki, atau pengujian langsung throws sebuah baru crawl/render error ini tidak throw sebelum.
Test: penting tautan survive render
- Test untuk jalankan — periksa dirender HTML (pemeriksaan URL atau Render Kesenjangan)
untuk nyata
<a href>tags sekitar setiap tautan sebuah reader perlu untuk ikuti, tidak hanya terlihat clickable elements. - Yang diharapkan hasil — setiap tautan di dirender DOM memiliki sebuah resolvable
hrefpointing di sebuah nyata, dapat di-crawl URL. - Failure interpretation — sebuah missing atau empty
hrefpada apa looks like sebuah berfungsi tautan biasanya berarti ini adalah sebuah<div>/<button>dengan sebuah client-side click handler dan Tidak server-renderable path — WRS dapat’t ikuti ini. - Monitoring window — Immediate.
- Rollback trigger — tautan itu mattered sebelum perubahan adalah missing
hrefattributes atau poin di sebuah hash-hanya fragment di dirender output.
Test: perbaiki tidak diam-diam regress pada berikutnya deploy
- Test untuk jalankan — Re-jalankan dirender-HTML periksa (pemeriksaan URL pengujian langsung atau Render Kesenjangan) setelah Anda berikutnya deploy itu touches ini halaman’s templates atau bangun pipeline.
- Yang diharapkan hasil — yang sama konten dan tautan adalah masih present di dirender DOM sebagai ketika Anda pertama confirmed perbaiki.
- Failure interpretation — jika konten itu adalah present disappears again, sebuah kemudian perubahan mungkin reintroduced sebuah client-hanya dependency atau broke sebuah server-dirender path.
- Monitoring window — Re-periksa setelah setiap deploy itu touches affected templates; tidak sebuah satu-time periksa.
- Rollback trigger — konten atau tautan itu adalah confirmed present drop out dari dirender DOM again.
Resources worth Anda time
My related writing
- JavaScript SEO: sebuah Definitive Guide — my penuh guide untuk rendering, rendering modes, DOM parity, infinite scroll, dan dua-halaman-sebagai-satu masalah.
- Beginner’s Guide untuk SEO teknis — di mana rendering fits antara crawling dan pengindeksan.
My speaking
- Bagaimana Penelusuran berfungsi (SlideShare) — my walkthrough dari crawling, rendering ( WRS, stateless memuat, Tidak interaction), pengindeksan, dan peringkat. (My standing disclaimer applies: “Ini adalah my understanding dari sistem… tidak going untuk menjadi 100% menyelesaikan atau accurate.” (terjemahan) “ini adalah my understanding dari sistem… tidak going untuk menjadi 100% menyelesaikan atau accurate.”)
dari others
- web.dev — rendering pada Web — canonical explainer dari CSR / SSR / SSG / hydration trade-offs dari Chrome team.
- Onely — Google’s Dua Waves dari pengindeksan — transcript-based coverage dari Martin Splitt’s office-hours session explaining mengapa dua-waves model adalah fading; cited di artikel body.
- mesin pencari Roundtable — Google: Tidak Per-halaman Penelusuran Cost — Google rep clarifying tidak ada per-halaman crawl/render/indeks cost untuk ration.
- mesin pencari Journal — JavaScript SEO — industry coverage dari JS SEO best practices, testing workflows, dan kerangka kerja considerations.
- Vercel — rendering Strategies — Berikutnya.js/edge rendering docs; berguna ketika choosing antara CSR, SSR, SSG, ISR, dan streaming SSR untuk sebuah nyata project.
- r/TechSEO — community untuk debugging render/indeks masalah.
Videos
- Google Search Central (YouTube) — Martin Splitt’s JavaScript SEO series dan rendering explainers adalah best official video walkthroughs dari bagaimana Web rendering Service menangani Anda JS. Channel
Stats worth citing
«- Current official framing: no fixed delay. Google’s documentation says a crawled page “may stay on this queue for a few seconds, but it can take longer than that” — there’s no published fixed delay or timeout for the render queue.
- Historical data point (dated) — ~5 second median render delay. In earlier conference remarks, Google staff (Martin Splitt and Tom Greenaway) put pages reaching the renderer at a median of ~5 seconds, with the 90th percentile in minutes — not the “weeks” the old two-waves fear implied. I cite this in my JavaScript SEO guide, but treat it as a historical data point, not a current published metric — Google hasn’t republished it as an ongoing figure.
- Two waves of indexing is fading. Per Martin Splitt, the two-waves model plays less and less of a role as crawling, rendering, and indexing converge — rendering now happens for essentially all pages. Coverage
- No per-page render budget. Google has indicated it doesn’t track how expensive an individual page is to crawl, render, index, or serve — so there’s no “render budget” to conserve the way crawl budget gets discussed. Coverage » (Terjemahan) (Ringkasan bahasa Indonesia untuk bagian seratus dua puluh lima, bagian kecil satu: teks sumber dipertahankan agar dapat diperiksa dalam tinjauan penutur asli.)
Uji pemahaman Anda: rendering
Five quick pertanyaan pada bagaimana Google renders halaman. Pick sebuah jawaban untuk setiap, lalu periksa.
Log perubahan
Diperbarui 28 Jul 2026.
Ringkasan editorial dan detail perubahan yang tercatat.Detail perubahan
-
Catatan perubahan terperinci saat ini tersedia dalam bahasa Inggris.
Perbandingan lengkap tidak tersedia — tidak ada cuplikan sebelumnya yang diarsipkan untuk revisi ini.
Diperbarui 18 Jul 2026.
Ringkasan editorial dan detail perubahan yang tercatat.Detail perubahan
-
Catatan perubahan terperinci saat ini tersedia dalam bahasa Inggris.
Perbandingan lengkap tidak tersedia — tidak ada cuplikan sebelumnya yang diarsipkan untuk revisi ini.
Diperbarui 17 Jul 2026.
Ringkasan editorial dan detail perubahan yang tercatat.Detail perubahan
-
Catatan perubahan terperinci saat ini tersedia dalam bahasa Inggris.
Perbandingan lengkap tidak tersedia — tidak ada cuplikan sebelumnya yang diarsipkan untuk revisi ini.