퍼페티어 크롤링 속도 높이는 방법 : Puppeteer

by
퍼페티어-크롤링-속도-향상-방법

자바스크립트 플랫폼에서 Node.js를 사용하는 경우, 퍼페티어(Puppeteer)를 이용하여 웹 크롤링을 자주 진행합니다. 그러나 웹 크롤링의 속도가 느릴 수 있고, 설정된 타임아웃 시간이 지나 에러가 발생하는 경우도 있습니다. 이 글에서는 퍼페티어 크롤링 속도를 높이는 방법을 소개합니다. 이 글을 끝까지 읽으면, 단순한 코드 추가만으로도 크롤링 m속도를 최소 10배 이상 높일 수 있을 것입니다.

퍼페티어 크롤링 속도 향상 방법

퍼페티어 크롤링 기본 코드

퍼페티어 크롤링 기본 코드는 아래와 같습니다.

const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.waitForTimeout(1000);
await page.goto(url, { waitUntil: 'networkidle0', timeout: 30000 });

줄별로 코드를 간단히 설명하면 아래와 같습니다.

  • 브라우저로 퍼페티어를 실행합니다.
  • 브라우저에 새로운 페이지를 엽니다.
  • 페이지가 열릴 때까지 1초 대기합니다.
  • 페이지는 가고자하는 URL로 이동합니다
    – 네트워크가 완전히 정지할 때까지 대기합니다. 타임아웃은 30초입니다.

스타일시트, 폰트, 이미지 차단

퍼페티어로 크롤링하고자 하는 대상이 텍스트나 URL인 경우, 위의 스타일시트, 폰트, 이미지 같은 리소스는 페이지 로딩 시간을 늘리고 필요도 없습니다. 아래와 같은 간단한 코드를 추가하면, 크롤링 속도를 대폭 향상시킬 수 있습니다.

const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.waitForTimeout(1000);
await page.goto(url, { waitUntil: 'networkidle0', timeout: 30000 });

// 리소스 로딩 제한 설정
await page.setRequestInterception(true);
page.on('request', (req) => {
    if (req.resourceType() === 'stylesheet' || req.resourceType() === 'font' || req.resourceType() === 'image') {
        req.abort();
    }
    else {
        req.continue();
    }
});

// 나머지 코드

정적 페이지 리소스 로딩 차단

정적 페이지에서는 모든 리소스 로딩을 차단하여 퍼페티어 크롤링 속도를 더욱 향상시킬 수 있습니다. 이는 스타일시트, 폰트, 이미지 리소스를 차단하는 것보다 더 큰 향상은 아니지만, 프로젝트의 목적에 따라 퍼페티어 크롤링 속도를 더 높이고자 한다면 유용합니다.

const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.waitForTimeout(1000);
await page.goto(url, { waitUntil: 'networkidle0', timeout: 30000 });
  
await page.setRequestInterception(true);
page.on('request', (req) => {
        if (req.resourceType() === 'document') {
            req.continue();
        } else {
            req.abort();
        }
    });
  
// 나머지 코드

동적 페이지 리소스 로딩 차단

동적 콘텐츠가 필요한 경우에는 script, xhr, fetch, websocket, 그리고 eventsource가 로딩되어야 합니다. 이러한 리소스를 차단하면 페이지의 중요한 기능이 작동하지 않을 수 있습니다. 따라서, 이러한 리소스는 로딩 제한에서 제외하는 것이 좋습니다.

동적 리소스의 종류

  1. script: 자바스크립트 파일은 페이지의 동적 콘텐츠를 조작하고 생성하는 데 사용됩니다.
  2. xhr: XMLHttpRequest는 서버로부터 데이터를 비동기로 가져오는 데 사용됩니다.
  3. fetch: fetch 역시 서버로부터 데이터를 비동기로 가져오는 데 사용되며, xhr보다 현대적인 API입니다.
  4. websocket: 실시간 양방향 통신을 위해 사용됩니다.
  5. eventsource: 서버로부터 실시간으로 이벤트를 받기 위해 사용됩니다.

아래 코드는 HTML과 위의 동적 리소스를 제외하고 나머지 리소스는 모두 차단하는 내용입니다.

const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.waitForTimeout(1000);
await page.goto(url, { waitUntil: 'networkidle0', timeout: 30000 });
  
 page.on('request', (req) => {
    const resourceType = req.resourceType();
    
    if (resourceType === 'document' || 
        resourceType === 'script' || 
        resourceType === 'xhr' || 
        resourceType === 'fetch' ||
        resourceType === 'websocket' ||
        resourceType === 'eventsource') {
      req.continue();
    } else {
      req.abort();
    }
    });
  
// 나머지 코드

결론

웹 크롤링은 데이터 수집에 있어 중요한 작업입니다. 특히, 자바스크립트 플랫폼에서 퍼페티어(Puppeteer)를 이용할 때는 효율적인 크롤링을 위해 여러 전략들이 필요합니다. 이 글에서는 퍼페티어 크롤링 속도를 높이기 위한 다양한 방법들을 소개했습니다. 스타일시트, 폰트, 이미지와 같은 불필요한 리소스의 로딩을 차단하거나, 정적 및 동적 페이지에 따라 필요한 리소스만 로딩하는 방법 등을 통해 크롤링의 효율을 대폭 높일 수 있습니다. 이러한 전략들을 적절히 활용하여, 퍼펟티어 크롤링 속도를 최적화하고, 원하는 데이터를 효과적으로 수집하세요. 이상 백투더가이드였습니다.

Leave a Comment