Cheerio

Cheerio là một implementation phía server của jQuery được thiết kế đặc biệt cho các ứng dụng Node.js. Nó cung cấp một API quen thuộc giống jQuery để phân tích, thao tác và duyệt qua các document HTML và XML mà không cần overhead của môi trường browser. Cho dù bạn đang xây dựng web scraper, xử lý HTML template, hay chuyển đổi markup theo chương trình, Cheerio làm cho việc làm việc với HTML trở nên trực quan như làm việc với DOM trong browser.

Về cốt lõi, Cheerio giải quyết vấn đề thao tác HTML phía server. Trong khi browser cung cấp các DOM API gốc để tương tác với HTML, các môi trường JavaScript phía server lại thiếu những khả năng này. Cheerio thu hẹp khoảng cách này bằng cách triển khai các method hữu ích nhất của jQuery trong một package nhẹ, được tối ưu hóa cho server. Nó được xây dựng trên các thư viện phân tích đã được chứng minh như htmlparser2 và parse5, đảm bảo xử lý HTML nhanh và chính xác trong khi duy trì cú pháp thân thiện với developer mà hàng triệu developer đã biết.

Điều làm cho Cheerio nổi bật là sự tập trung vào hiệu suất và tính đơn giản. Không giống như các giải pháp headless browser mô phỏng toàn bộ môi trường browser, Cheerio hoạt động trực tiếp trên các cấu trúc HTML đã được phân tích, làm cho nó cực kỳ nhanh cho các tác vụ thao tác HTML. Nó loại bỏ các phức tạp và không nhất quán đặc thù của browser, cung cấp cho bạn một API sạch sẽ, nhất quán để xử lý HTML hoạt động đáng tin cậy trên các môi trường khác nhau.

Tính năng chính

API tương thích jQuery — Sử dụng các selector quen thuộc như $('.class'), $('#id'), và $('element') với các method bạn đã biết bao gồm .find(), .text(), .html(), và .attr()
Hiệu suất cực nhanh — Được xây dựng trên các parser được tối ưu hóa không có overhead của browser, làm cho nó lý tưởng cho các ứng dụng thông lượng cao như web scraping và xử lý HTML hàng loạt
Phân tích HTML linh hoạt — Xử lý cả HTML đúng định dạng và sai định dạng một cách duyên dáng, với hỗ trợ chế độ XML khi cần phân tích nghiêm ngặt
Tối ưu hóa phía Server — Được thiết kế đặc biệt cho môi trường Node.js không có dependency browser hay sự không nhất quán của DOM để lo lắng
Hỗ trợ Streaming — Xử lý HTML từ nhiều nguồn khác nhau bao gồm string, buffer, URL, và stream để có tính linh hoạt tối đa
Sẵn sàng TypeScript — Hỗ trợ TypeScript đầy đủ với định nghĩa type toàn diện để có trải nghiệm phát triển tốt hơn và an toàn code
Footprint nhẹ — Dependency tối thiểu và kích thước bundle nhỏ làm cho nó hoàn hảo cho serverless function và môi trường hạn chế tài nguyên
Hiệu quả bộ nhớ — Thao tác trực tiếp các cấu trúc HTML đã được phân tích mà không có overhead của việc duy trì context browser đầy đủ

Bắt đầu nhanh

Bắt đầu với Cheerio bằng cách cài đặt nó qua npm:

npm install cheerio

Đây là một ví dụ đơn giản thể hiện sức mạnh của Cheerio trong thao tác HTML:

import * as cheerio from 'cheerio';

// Load HTML content
const $ = cheerio.load(`
  <html>
    <head><title>My Page</title></head>
    <body>
      <h1 class="header">Welcome</h1>
      <div class="content">
        <p>Hello <span class="name">World</span>!</p>
        <ul class="list">
          <li>Item 1</li>
          <li>Item 2</li>
        </ul>
      </div>
    </body>
  </html>
`);

// Use jQuery-like selectors to find and modify elements
$('h1').text('Welcome to Cheerio!');
$('.name').text('Everyone');
$('.list').append('<li>Item 3</li>');
$('p').addClass('highlight');

// Extract data from elements
const title = $('title').text();
const items = $('.list li').map((i, el) => $(el).text()).get();

console.log('Page title:', title);
console.log('List items:', items);
console.log('Modified HTML:', $.html());

Ví dụ này cho thấy Cheerio làm cho thao tác HTML trở nên trực quan như thế nào:

Tải HTML — Function cheerio.load() phân tích HTML của bạn và trả về một function giống jQuery ($)
Chọn Element — Sử dụng CSS selector để nhắm mục tiêu các element cụ thể, giống như trong jQuery
Sửa đổi nội dung — Nối các method như .text(), .addClass(), và .append() để sửa đổi HTML của bạn
Trích xuất dữ liệu — Sử dụng các method như .map() để trích xuất thông tin từ nhiều element
Xuất kết quả — Gọi .html() để có được chuỗi HTML đã được sửa đổi cuối cùng

Cú pháp jQuery quen thuộc có nghĩa là hầu như không có đường cong học tập nếu bạn đã sử dụng jQuery trước đây, làm cho Cheerio cực kỳ dễ tiếp cận đối với các developer ở mọi cấp độ kỹ năng.

Khi nào sử dụng Cheerio vs các giải pháp thay thế

Chọn Cheerio khi:

Bạn cần phân tích và thao tác HTML hoặc XML phía server
Hiệu suất là quan trọng và bạn đang xử lý nhiều document
Bạn muốn cú pháp quen thuộc giống jQuery
Bạn đang xây dựng web scraper hoặc công cụ trích xuất dữ liệu
Bạn cần chuyển đổi HTML template hoặc tạo nội dung tĩnh
Bạn đang làm việc trong môi trường hạn chế tài nguyên như serverless function

Cân nhắc các giải pháp thay thế khi:

Bạn cần thực thi JavaScript trong trang (sử dụng Puppeteer hoặc Playwright)
Bạn đang làm việc với SPA phức tạp cần JavaScript rendering
Bạn cần mô phỏng tương tác người dùng như click và submit form
Bạn yêu cầu API browser đầy đủ như localStorage hoặc fetch

Cheerio vs Puppeteer/Playwright: Mặc dù headless browser có thể thực thi JavaScript và mô phỏng tương tác người dùng, chúng nặng và chậm hơn nhiều. Cheerio hoàn hảo khi bạn chỉ cần phân tích và thao tác HTML mà không cần thực thi JavaScript.

Cheerio vs DOM API gốc: Môi trường browser cung cấp thao tác DOM gốc, nhưng Node.js phía server thì không. Cheerio lấp đầy khoảng trống này với giao diện quen thuộc, lấy cảm hứng từ jQuery.

Cheerio vs Regular Expression: Mặc dù regex có thể trích xuất dữ liệu từ HTML, nó dễ vỡ và dễ lỗi. Cheerio cung cấp phân tích HTML mạnh mẽ xử lý các trường hợp đặc biệt và markup sai định dạng một cách duyên dáng.

Cheerio xuất sắc trong các tình huống mà bạn cần xử lý HTML nhanh, đáng tin cậy mà không có độ phức tạp và yêu cầu tài nguyên của môi trường browser đầy đủ. API tương thích jQuery của nó làm cho nó trở thành lựa chọn tuyệt vời cho các developer muốn khả năng thao tác HTML mạnh mẽ với overhead học tập tối thiểu.

Installation & Setup →