구조·마크업 · 공식 문서
자바스크립트 SEO, 구글·네이버 렌더링 단계 정리
둘 다 실행합니다. 구글은 크롤링 뒤 렌더링 대기열을 거쳐 헤드리스 Chromium 으로 렌더링한 HTML을 색인하고, 네이버는 브라우저처럼 렌더링하되 자바스크립트를 아직 수집하지 못했으면 정적 HTML을 먼저 색인합니다.
구글과 네이버 모두 자바스크립트를 실행해 페이지를 읽습니다. 다만 HTML을 받는 즉시가 아니라, 크롤링과 색인 사이에 렌더링 단계를 따로 둡니다.
그래서 「읽느냐」보다 「언제, 어떤 조건에서 읽느냐」가 실무 질문입니다. 두 검색엔진의 공식 문서를 단계별로 나란히 놓았습니다.
발견 01
구글과 네이버 모두 자바스크립트를 실행하고, 크롤링·렌더링·색인 3단계를 따로 거칩니다
While Google Search runs JavaScript with an evergreen version of Chromium, there are a few things that you can optimize.
구글 검색은 늘 최신으로 유지되는 Chromium 으로 자바스크립트를 실행하지만, 최적화할 점이 몇 가지 있다.
| 단계 | 구글 원문 | 네이버 원문 |
|---|---|---|
| 크롤링 | When Googlebot fetches a URL from the crawling queue by making an HTTP request, it first checks if you allow crawling. Google Search won't render JavaScript from blocked files or on blocked pages.Googlebot 은 크롤링 대기열에서 URL을 가져와 요청할 때 먼저 크롤링이 허용됐는지 확인한다. 차단된 파일이나 페이지의 자바스크립트는 렌더링하지 않는다. | 간혹 일부 사이트가 웹 페이지는 수집을 허용하고 있음에도 불구하고, 자바스크립트 및 CSS 와 같은 리소스 URL은 비허용으로 설정되는 경우가 있습니다. |
| 렌더링 | The page may stay on this queue for a few seconds, but it can take longer than that. Once Google's resources allow, a headless Chromium renders the page and executes the JavaScript.페이지는 렌더링 대기열에 몇 초 머물 수 있지만 더 오래 걸릴 수도 있다. 구글의 자원이 허락하면 헤드리스 Chromium 이 페이지를 렌더링하고 자바스크립트를 실행한다. | 네이버 검색로봇은 수집 허용된 HTML 문서를 정확하게 해석하기 위해 여러분이 사용하는 일반 웹브라우저와 동일하게 언급된 리소스 파일을 추가해 내부적으로 랜더링 및 분석합니다. 자바스크립트가 수집되어 있지 않으면 정적인 HTML의 내용을 먼저 수집/분석하여 색인 처리합니다. |
| 색인 | Google also uses the rendered HTML to index the page.구글은 렌더링된 HTML로 페이지를 색인한다. | 렌더링 결과 페이지의 주요 콘텐츠 내용이 변경되어 있는지를 파악한 후 색인을 업데이트 여부를 결정합니다. |
구글은 렌더링을 기다리는 대기열이 있고, 몇 초에서 그 이상 걸릴 수 있다고 적었습니다. 첫 HTML에 있는 내용은 이 대기를 거치지 않고 크롤링 단계에서 바로 읽힙니다.
네이버는 SPA 사이트의 수집과 색인을 지원한다고 적으면서, 자바스크립트 해석에 전통적인 HTML보다 몇 배의 리소스가 든다고 덧붙였습니다.
이러한 일련의 과정은 전통적인 HTML 페이지의 해석보다 몇 배 이상의 리소스가 필요한 작업입니다.
발견 02
네이버는 자바스크립트 리소스를 따로 수집하고, 아직 없으면 정적 HTML을 먼저 색인합니다
| 순서 | 네이버 원문 |
|---|---|
| 1 | HTML에 포함되어 있는 자바스크립트 리소스는 별도의 수집 과정을 거쳐서 렌더링 서버에 일정 기간 저장됩니다. |
| 2 | 자바스크립트가 수집되어 있지 않으면 정적인 HTML의 내용을 먼저 수집/분석하여 색인 처리합니다. |
| 3 | 검색로봇이 해당 페이지를 재 방문할 때 확보된 자바 스크립트가 있다면 해당 스크립트를 포함하여 HTML을 렌더링해 보다 정확하게 내용을 분석하려고 시도합니다. |
| 4 | 렌더링 결과 페이지의 주요 콘텐츠 내용이 변경되어 있는지를 파악한 후 색인을 업데이트 여부를 결정합니다. |
처음 방문에서 자바스크립트가 없으면 첫 HTML만으로 색인되고, 다시 방문할 때 렌더링 결과로 고칩니다. 첫 HTML이 비어 있으면 그 사이 색인에 남는 내용도 비어 있습니다.
캐시 처리에서는 두 문서의 표현이 다릅니다. 구글은 파일 이름에 콘텐츠 지문을 넣으라고 적었고, 네이버는 URL에 timestamp·hash 를 넣어 최신성을 강제하는 방식을 권장하지 않는다고 적었습니다.
| 주제 | 구글 원문 | 네이버 원문 |
|---|---|---|
| 자바스크립트 파일 캐시 | Content fingerprinting avoids this problem by making a fingerprint of the content part of the filename, like main.2bb85551.js.파일 이름에 콘텐츠 지문을 넣으면(예: main.2bb85551.js) 오래된 리소스를 쓰는 캐시 문제를 피할 수 있다. | 간혹 자바스크립트 url에 timestamp 혹은 hash 값을 넣어서 리소스의 최신성을 강제로 처리하는 경우가 발견되고 있습니다. 이 경우 수집 과정에서 페이지의 콘텐츠 해석에 문제가 발생할 수 있으므로 권장하지 않습니다. |
발견 03
렌더링을 건너뛰거나 자바스크립트 콘텐츠를 못 보는 조건은 6가지입니다
| 조건 | 해당 | 공식 문서 원문 |
|---|---|---|
| robots.txt 가 페이지나 자바스크립트 파일을 차단 | 구글·네이버 | Google Search won't render JavaScript from blocked files or on blocked pages.차단된 파일이나 차단된 페이지의 자바스크립트는 렌더링하지 않는다. |
| 첫 HTML에 noindex 가 있음 | 구글 | When Google encounters the noindex tag, it may skip rendering and JavaScript execution, which means using JavaScript to change or remove the robots meta tag from noindex may not work as expected.noindex 태그를 만나면 렌더링과 자바스크립트 실행을 건너뛸 수 있다. 그래서 자바스크립트로 noindex 를 바꾸거나 지우는 방식은 기대대로 동작하지 않을 수 있다. |
| 상태 코드가 200이 아님 | 구글 | If the HTTP status code is non-200 (for example, on error pages with 404 status code), rendering might be skipped.상태 코드가 200이 아니면(예: 404 오류 페이지) 렌더링을 건너뛸 수 있다. |
| 스크롤·클릭해야 콘텐츠를 불러옴 | 구글 | The methods mentioned don't rely on user actions, such as scrolling or clicking, to load content, which is important as Google Search does not interact with your page.위 방식들은 스크롤·클릭 같은 사용자 동작 없이 콘텐츠를 불러옵니다. 구글 검색은 페이지와 상호작용하지 않으므로 이 점이 중요합니다. |
| 자바스크립트 리소스를 아직 수집하지 못함 | 네이버 | 자바스크립트가 수집되어 있지 않으면 정적인 HTML의 내용을 먼저 수집/분석하여 색인 처리합니다. |
| 자바스크립트를 실행하지 않는 크롤러 | 다른 검색엔진 | Other search engines may choose to ignore JavaScript and won't see JavaScript-generated content.다른 검색엔진은 자바스크립트를 무시하고 자바스크립트로 만든 콘텐츠를 보지 않을 수 있다. |
Keep in mind that server-side or pre-rendering is still a great idea because it makes your website faster for users and crawlers, and not all bots can run JavaScript.
서버 렌더링이나 사전 렌더링은 여전히 좋은 방법이다. 사용자와 크롤러 모두에게 사이트가 빨라지고, 모든 크롤러가 자바스크립트를 실행하지는 못한다.
noindex 를 첫 HTML에 두고 자바스크립트로 지우는 구조는 구글이 렌더링 자체를 건너뛸 수 있어 기대대로 동작하지 않습니다. 색인할 페이지는 첫 HTML에서부터 noindex 를 뺍니다.
구글과 네이버가 아닌 크롤러는 자바스크립트를 실행하지 않을 수 있습니다. 본문과 링크를 첫 HTML에 담으면 모든 크롤러가 같은 내용을 읽습니다.
발견 04
같은 자바스크립트 사이트라도 B2B·B2C·B2G 는 먼저 확인할 단계가 다릅니다
예시 ① 제품 소개를 앱처럼 만든 B2B 솔루션 사이트
첫 HTML에 회사 이름과 빈 틀만 있고, 기능 설명은 자바스크립트가 불러옵니다. 구글과 네이버는 렌더링 단계를 거친 뒤에야 기능 설명을 읽습니다.
소개 페이지만이라도 첫 HTML에 본문을 담는 방식으로 바꿉니다. 고르는 기준은 「SSR CSR SSG SEO 차이」 편에 적었습니다.
예시 ② 상품 목록을 무한 스크롤로 불러오는 쇼핑몰(B2C)
구글은 페이지와 상호작용하지 않으므로, 스크롤해야 나오는 상품은 렌더링된 HTML에도 없습니다. 목록 페이지에 번호가 있는 고유 URL을 둡니다.
robots.txt 가 상품 데이터를 불러오는 API 경로를 차단하고 있지 않은지도 함께 봅니다.
예시 ③ 통계 조회 화면을 자바스크립트로 그리는 공공기관 누리집(B2G)
조회 결과가 버튼을 눌러야 나오는 화면이면 크롤러는 결과를 보지 못합니다. 자주 찾는 통계는 고유 URL이 있는 요약 페이지로 따로 둡니다.
네이버도 대상이므로 요약 페이지는 첫 HTML에 표와 설명을 담습니다.
그럼 우리 사이트가 자바스크립트로 그리는지 어떻게 확인하나요?
- 브라우저 주소창에 view-source: 를 붙여 페이지를 열고, 본문 문장과 링크가 첫 HTML에 있는지 찾습니다.
- 서치 콘솔 URL 검사로 페이지를 테스트하고 렌더링된 HTML에 같은 문장이 있는지 봅니다.
- robots.txt 가 자바스크립트·CSS 파일과 데이터 API 경로를 차단하지 않는지 봅니다.
- 색인할 페이지의 첫 HTML에 noindex 가 없는지, 상태 코드가 200인지 확인합니다.
- SPA 사이트라면 점검 순서는 「리액트 SPA SEO」 편을 따릅니다.
조사 방법
- Google Search Central 「Understand the JavaScript SEO basics」 (문서 수정일 2026-03-04) · 최종 확인일 2026-10-25 · https://developers.google.com/search/docs/crawling-indexing/javascript/javascript-seo-basics
- Google Search Central 「Fix Search-related JavaScript problems」 (문서 수정일 2025-12-18) · 최종 확인일 2026-10-25 · https://developers.google.com/search/docs/crawling-indexing/javascript/fix-search-javascript
- Google Search Central 「Fix lazy-loaded content」 (문서 수정일 2025-12-10) · 최종 확인일 2026-10-25 · https://developers.google.com/search/docs/crawling-indexing/javascript/lazy-loading
- Google Search Central 「Dynamic rendering as a workaround」 (문서 수정일 2025-12-10) · 최종 확인일 2026-10-25 · https://developers.google.com/search/docs/crawling-indexing/javascript/dynamic-rendering
- 네이버 서치어드바이저 「자바스크립트 검색 최적화」 · 최종 확인일 2026-10-25 · https://searchadvisor.naver.com/guide/seo-advanced-javascript
- 3단계 표와 조건 6가지는 위 문서들의 문장을 단계와 조건으로 묶은 것입니다. 묶는 방식과 「해당」 칸은 편집 판단입니다.
- 예시 ①②③은 이해를 돕기 위해 만든 가상 상황이며, 실제 기업·기관의 사례가 아닙니다.
- 원문은 영어판(hl=en)이고, 도구·보고서 이름은 같은 문서 한국어판(hl=ko) 표기를 따랐습니다.