검색 엔진의 작동 원리 (크롤링, 인덱싱, 렌더링)
내 웹사이트가 구글 검색 1페이지에 뜨기 위해서, 검색 엔진 봇(로봇)이 내 사이트를 평가하는 3단계 과정을 완벽히 이해해야 합니다. 특히 구글 봇은 무한한 자원을 가진 것이 아니므로, 각 사이트마다 할당된 '크롤 버젯(Crawl Budget)' 내에서만 수집을 진행합니다.
🤖 구글 검색 로봇의 3단계 파이프라인
-
1. 크롤링 (Crawling - 탐색) 🕷️
인터넷 거미줄(링크)을 타고 돌아다니며 새로운 웹페이지의 코드를 긁어갑니다. 서버가 너무 느리거나 무거우면 크롤 버젯이 고갈되어 수집을 중단해버립니다.
-
2. 렌더링 (Rendering - 화면 그리기) 🎨
수집한 HTML과 자바스크립트를 실행해 사람이 보는 것과 똑같은 최종 화면을 렌더링합니다. JS 렌더링 시간이 너무 오래 걸리면(무거운 SPA) 빈 화면만 보고 넘어가 버립니다.
-
3. 인덱싱 (Indexing - 색인 및 저장) 📚
화면 내용과 주제를 분석하여 거대한 구글 도서관 DB에 차곡차곡 분류하여 저장합니다. 이제 검색 결과에 노출될 준비가 끝났습니다.
프론트엔드 개발자가 React나 Vue 같은 SPA(싱글 페이지 애플리케이션)를 만들 때 검색이 잘 안되는 이유는, 초기 HTML이 텅 비어있고 자바스크립트로 너무 느리게 렌더링(2단계)을 하기 때문입니다.
<!-- ❌ 안 좋은 예: 너무 무거운 JS 프레임워크 렌더링 -->
<div id="root"></div>
<script>
// 구글 검색 로봇은 자바스크립트를 실행(렌더링)할 수는 있지만,
// 시간이 오래 걸리거나 에러가 나면 이 텅 빈 <div id="root">만 보고 내용이 없다고 판단해버립니다!
setTimeout(() => {
document.getElementById("root").innerHTML = "<h1>수많은 맛집 정보들!</h1>";
}, 5000);
</script>
<!-- ✅ 좋은 예: 서버 사이드 렌더링(SSR)이나 미리 완성된 HTML 제공 -->
<div id="root">
<h1>수많은 맛집 정보들!</h1>
</div>