테크니컬 SEO / AEO

JavaScript 렌더링 SEO 위험 검사기

페이지의 전체 HTML 소스(View Page Source / Ctrl+U 결과)를 붙여넣어, JavaScript를 실행하지 않는 크롤러 — 모든 AI 답변 엔진 크롤러 포함 — 가 실제로 보는 내용과 프레임워크가 hydration을 마친 후에야 나타나는 내용을 비교해 보세요.

DevTools의 Elements 패널이 아니라 "View Page Source"(Ctrl+U)를 사용하세요 — Elements는 JavaScript가 이미 실행된 후의 DOM을 보여주므로 이 검사의 취지가 무색해집니다. 붙여넣은 내용은 이 1회성 분석을 위해 저희 서버로 한 번만 전송되며, 다른 곳으로는 전송되지 않습니다.

이 도구가 확인하는 것

Googlebot은 결국 JavaScript를 실행하지만, 이는 리소스 예산이 제한된 두 번째 렌더링 파동에서만 이루어지며 며칠 지연되거나 크롤 예산이 낮은 사이트에서는 아예 건너뛰어질 수 있습니다. 오늘날 중요한 대부분의 다른 크롤러 — 축소된 규모의 Bingbot, 그리고 거의 모든 AI 크롤러(GPTBot, ClaudeBot, PerplexityBot, CCBot)와 소셜 미리보기 봇(Twitterbot, facebookexternalhit, LinkedInBot) — 은 JavaScript를 전혀 실행하지 않습니다. 이 도구는 붙여넣은 정적 HTML을 실제 DOM 파서로 분석하여, title, meta description, canonical 태그, H1, 구조화 데이터, 실제 본문 콘텐츠가 해당 정적 마크업에 존재하는지, 아니면 JS 프레임워크가 페이지를 hydration한 후에만 나타나는지 보고합니다.

분석 작동 방식

붙여넣은 HTML은 (단순한 정규식 스캔이 아니라) 실제 DOM으로 파싱된 후, 렌더링하지 않는 크롤러가 페이지를 이해하고 색인하는 데 사용하는 정확한 신호와 대조하여 검사됩니다.

정적 SEO 태그 존재 여부

Title, meta description, rel="canonical"은 파싱된 마크업에서 직접 읽어옵니다. 이것들을 JavaScript로 주입하는 프레임워크(일반적인 React/Vue 라우터 패턴)는 여기서 누락으로 표시됩니다 — 렌더링하지 않는 크롤러가 실제로 보는 그대로입니다.

본문 콘텐츠 대 문서 크기

script, style, noscript 콘텐츠를 제거한 후 남은 가시 텍스트를 전체 문서 크기와 비교해 측정합니다. 거의 빈 body를 감싸는 <script> 번들이 대부분인 페이지는 클라이언트사이드 렌더링(CSR)의 전형적인 특징입니다.

프레임워크 루트 컨테이너 감지

일반적인 SPA 마운트 지점 — #root, #app, #__next, #__nuxt, #___gatsby, #svelte, Angular의 ng-version, React의 data-reactroot — 을 찾아 그 내부 텍스트를 측정합니다. 빈 루트 컨테이너와 거의 빈 body가 함께 발견되면, 페이지 전체가 로드 후 클라이언트에서 구성된다는 강력한 증거입니다.

noscript 대체 콘텐츠 품질

<noscript> 블록에 일반적인 "JavaScript를 활성화하세요" 메시지가 아니라 실제 대체 콘텐츠가 포함되어 있는지 확인합니다. 이 블록은 JS를 실행하지 않는 방문자나 크롤러가 원본 HTML 외에 볼 수 있는 유일한 것이기 때문입니다.

실제로 JavaScript를 실행하는 크롤러는 어디인가

이것이 바로 2026년에도 정적이고 서버에서 보이는 SEO 신호가 여전히 중요한 진짜 이유입니다 — AI 답변 인용과 소셜 미리보기를 결정하는 대부분의 크롤러는 스크립트를 전혀 실행하지 않습니다.

Googlebot 지연 실행 JavaScript를 실행하지만 리소스 예산이 제한된 두 번째 렌더링 파동에서만 실행합니다 — JS에만 의존하는 콘텐츠의 색인은 며칠 지연되거나 크롤 예산이 제한된 사이트에서는 건너뛰어질 수 있습니다.
Bingbot 제한적 Google보다 더 작은 규모와 더 빠듯한 예산으로 JavaScript를 렌더링합니다. 정적 콘텐츠가 더 안전한 선택입니다.
GPTBot / ChatGPT-User (OpenAI) 실행 안 함 원본 HTML만 가져옵니다. JavaScript 실행 후에만 나타나는 콘텐츠는 보이지 않습니다 — ChatGPT가 귀하의 페이지를 인용할 수 있는지에 직접 영향을 미칩니다.
ClaudeBot (Anthropic) 실행 안 함 원본 HTML만 가져오며, 다른 AI 크롤러와 동일한 제약이 있습니다 — Claude가 귀하의 페이지를 인용할 수 있는지에 직접 영향을 미칩니다.
PerplexityBot 실행 안 함 원본 HTML만 가져옵니다 — 이는 Perplexity에서 AI 답변 인용 자격에 직접 영향을 미칩니다.
CCBot (Common Crawl) 실행 안 함 수많은 AI 학습 데이터셋에 데이터를 공급하며, 원본 HTML만 크롤링하고 JavaScript는 실행하지 않습니다.
facebookexternalhit / Twitterbot / LinkedInBot 실행 안 함 소셜 링크 미리보기(Facebook, Twitter/X, LinkedIn)는 JavaScript 실행 없이 가져온 정적 meta 태그만으로 구성됩니다.
Most SEO / backlink crawlers 실행 안 함 대부분의 SEO/백링크 크롤러(Ahrefs, Semrush 등)는 속도와 비용 문제로 원본 HTML만 파싱합니다.

자주 묻는 질문

제 사이트는 서버사이드 렌더링을 사용하는 Next.js/Nuxt인데, 이 도구가 위험하다고 표시할까요?

아닙니다. 서버사이드 렌더링(SSR)과 정적 생성(SSG)은 title, meta 태그, H1, 본문 콘텐츠를 HTML 응답에 직접 출력하므로, 이 도구는 이를 "존재함"으로 읽고 프레임워크 루트 컨테이너에도 빈 껍데기 대신 실제 텍스트가 들어 있을 것입니다. 이 도구가 특별히 표시하는 것은 순수 클라이언트사이드 렌더링(CSR)뿐인 경우로, 초기 HTML 응답이 거의 빈 껍데기이고 JavaScript 번들이 다운로드되어 실행된 후에만 내용이 채워지는 경우입니다.

왜 여기서 "View Page Source"가 DevTools의 Elements 패널보다 더 중요한가요?

Elements 패널은 브라우저가 이미 모든 스크립트를 실행한 후의 실시간 DOM을 보여줍니다 — 그래서 순수 CSR 사이트에서도 항상 완전해 보입니다. 브라우저가 방금 렌더링했기 때문입니다. "View Page Source"(또는 단순한 curl/wget 가져오기)는 렌더링하지 않는 크롤러가 JavaScript가 실행되기 전에 실제로 받는 바이트를 그대로 보여줍니다. 이것이 GPTBot, ClaudeBot, Twitterbot, 그리고 대부분의 SEO 크롤러가 실제로 보는 것과 일치하는 유일한 시각입니다.

Google이 정말로 제 JavaScript 렌더링 콘텐츠를 제대로 못 보나요?

Googlebot은 일반적으로 JavaScript를 렌더링하긴 하지만, 지연된 별도의 렌더링 파동에서 실제 리소스 예산 제약을 받으며 처리합니다 — Google 자체도 JS가 많은 페이지에서의 색인 지연과 간헐적인 렌더링 실패를 문서화한 바 있습니다. 신뢰성 있고 빠르게 색인되어야 하는 콘텐츠, 그리고 JavaScript를 전혀 렌더링하지 않는 모든 AI 답변 또는 소셜 미리보기 크롤러에게는, 정적 HTML의 존재가 실제로 가시성을 보장하는 요소입니다.

이 도구는 붙여넣은 HTML을 저장하거나 공유하나요?

붙여넣은 HTML은 이 1회성 파싱 및 분석을 실행하기 위해 HTTPS를 통해 저희 서버로 한 번만 전송되며(DOM 파싱 로직의 일관성을 유지하고 복사 가능한 클라이언트 코드로 노출되지 않도록 하기 위해 필요합니다), 해당 요청 이후에는 저장되지 않습니다.