동기 웹과 비동기 웹의 차이(ft.데이터 크롤링)

• 수업 내용 리마인드 및 아카이빙 목적의 업로드

---

"Image generated using DALL-E by OpenAI"

---

 

오늘은 데이터 크롤링에 대해 이야기해볼까 해요. 웹에서 데이터를 자동으로 모아 활용하는 기술인데, 웹 페이지의 구조에 따라 크롤링이 쉽기도 하고 어려워지기도 하거든요. 특히 동기 웹과 비동기 웹이 어떻게 다른지 알면 크롤링이 한층 수월해질 거예요. 그럼 함께 알아볼까요?

 

1. 동기 웹(Synchronous Web)이란?

동기 웹은 쉽게 말해, 웹 페이지가 한 번에 순서대로 로드되는 방식이에요. 페이지를 열면 모든 데이터가 한꺼번에 불러와지죠. 그래서 사용자는 페이지가 완전히 로드된 후에야 내용을 볼 수 있어요.

 

예를 들어, 뉴스 사이트를 떠올려 볼게요. 웹 페이지를 열면 모든 기사 제목, 내용, 이미지 등이 한 번에 다 로드되죠? 이때 크롤러는 HTML 코드를 그대로 가져와 필요한 데이터를 쏙쏙 뽑아내면 돼요. 페이지 구조가 고정되어 있고, 한 번에 데이터를 모두 가져올 수 있으니 크롤링이 아주 쉽답니다.

 

1) 동기 웹 크롤링의 장점:

• 쉽고 간단함: 모든 데이터가 한꺼번에 로드되니까, 크롤러가 HTML 코드만 분석하면 돼요.
• 예측 가능함: 로드된 데이터가 변하지 않아서, 크롤링할 때 어떤 데이터를 얻을지 예상하기 쉬워요.

2) 동기 웹 크롤링의 단점:

• 비효율적일 수 있음: 필요한 데이터가 적더라도 전체 페이지를 다 로드해야 하니까, 데이터 양이 많으면 조금 비효율적일 수 있어요.

 

2. 비동기 웹(Asynchronous Web)이란?

비동기 웹은 말 그대로 필요할 때마다 부분적으로 데이터가 로드되는 방식이에요. 웹 페이지를 처음 열었을 때는 기본적인 구조만 보여주고, 필요한 데이터는 JavaScript를 통해 그때그때 불러와요. 예를 들어, 페이지를 아래로 내릴 때마다 추가 콘텐츠가 로드되는 형태죠.

 

비동기 웹의 좋은 예시가 소셜 미디어 피드예요. 처음에는 몇 개의 게시물만 보이다가, 스크롤을 내릴 때마다 새 게시물이 로드되죠? 이 경우 크롤러는 단순히 HTML을 파싱하는 것만으로는 데이터를 다 가져올 수 없어요. JavaScript가 데이터를 어떻게 불러오는지 이해하거나, 서버와의 통신을 모방해야 해요.

 

1) 비동기 웹 크롤링의 장점:

• 효율적임: 필요한 데이터만 로드하니까, 불필요한 데이터 전송이 줄어들어요.
• 동적 콘텐츠에 적합: 사용자 행동에 따라 로드되는 콘텐츠를 다룰 수 있어요.

2) 비동기 웹 크롤링의 단점:

• 복잡함: 크롤링이 더 복잡해져요. 추가 요청을 처리하거나, JavaScript를 이해해야 하거든요.
• 특별한 도구 필요: Selenium 같은 브라우저 자동화 도구나 네트워크 요청을 추적하는 도구가 필요할 수 있어요.

 

3. 동기 웹과 비동기 웹 크롤링, 실제로는?

1) 동기 웹 예시: 네이버 뉴스

ⓒ 네이버 뉴스

• 뉴스 웹사이트에서 모든 기사를 크롤링할 때, HTML 코드만 분석하면 되니까 쉽게 크롤링할 수 있어요. 페이지가 로드되면 필요한 데이터가 다 들어있으니까요.

2) 비동기 웹 예시: Instagram

ⓒ Instagram

• 소셜 미디어 웹사이트에서 스크롤할 때마다 게시물이 추가로 로드되는 경우, 비동기 웹에서는 크롤러가 JavaScript를 이해하거나 네트워크 요청을 모방해야 하죠. 그래야 추가 데이터를 가져올 수 있어요.

 

4. 결론

데이터 크롤링을 할 때, 웹 페이지가 동기적으로 작동하는지, 비동기적으로 작동하는지를 이해하는 게 정말 중요해요. 동기 웹은 크롤링이 비교적 간단하지만, 경우에 따라 비효율적일 수 있어요. 반면 비동기 웹은 크롤링이 조금 더 복잡하지만, 동적 콘텐츠를 처리하는 데는 더 효율적이죠.

 

크롤러를 만들 때는 대상 웹 페이지의 특성을 잘 이해하고, 그에 맞는 방법을 선택하는 게 핵심이에요. 동기 웹과 비동기 웹의 차이를 알면, 더 똑똑하게 데이터를 모을 수 있을 거예요.