تحليل HTML في Node.js: نظرة عامة على أفضل المكتبات والأدوات

تحليل HTML في JavaScript (Node.js): اختيار الأداة المناسبة للعمل مع صفحات الويب

تحليل HTML هو إحدى المهام الأساسية عند تطوير أدوات استخراج بيانات الويب، ومحللي المحتوى، والاختبارات الآلية. في نظام Node.js البيئي، توجد عدة مكتبات قوية، لكل منها نقاط قوتها الخاصة. في هذه المقالة، سنستعرض ثلاث أدوات رئيسية: cheerio و jsdom و htmlparser2، وسنشرح متى وأي منها من الأفضل استخدامه.

1. Cheerio — jQuery للخادم

مكتبة cheerio هي الخيار الأكثر شيوعًا لتحليل HTML في Node.js. توفر بناء جملة مشابهًا لـ jQuery للتنقل ومعالجة شجرة DOM. لا تقوم Cheerio بإنشاء DOM كامل للمتصفح، بل تعمل بتجريد خفيف، مما يجعلها سريعة جدًا.

الإمكانيات الرئيسية:

• دعم محددات CSS (كما في jQuery)
• تحليل سريع بدون تنفيذ JavaScript
• طرق غير قابلة للتغيير (لا تغير HTML الأصلي)
• التعامل مع السمات والنص والبنية HTML

مثال على الاستخدام:

const cheerio = require('cheerio');const html = '<div class="content"><h1>مرحبًا بالعالم!</h1><p>نص المقال</p></div>';

const $ = cheerio.load(html);const title = $('h1').text();const paragraphs = $('p').map((i, el) => $(el).text()).get();

console.log(title); // "مرحبًا بالعالم!"console.log(paragraphs); // ["نص المقال"]

2. JSDOM — متصفح كامل في Node.js

إذا كنت لا تحتاج فقط إلى تحليل HTML الثابت، بل أيضًا إلى تنفيذ نصوص JavaScript، ومحاكاة الأحداث، أو العمل مع واجهات برمجة التطبيقات الحديثة (مثل fetch و localStorage)، فإن jsdom هو خيارك. يقوم بإنشاء بيئة متصفح كاملة، مما يوفر أقصى درجات التوافق، ولكنه يتطلب موارد أكثر.

متى تستخدم jsdom:

• مواقع ذات محتوى ديناميكي (تطبيقات الصفحة الواحدة SPA على React/Vue)
• الحاجة لتنفيذ نصوص الصفحة
• اختبار مكونات الويب
• التعامل مع الأحداث والعمليات غير المتزامنة

مثال على التحليل:

const { JSDOM } = require('jsdom');const html = '<html><body><div id="app">المحتوى</div></body></html>';

const dom = new JSDOM(html);const document = dom.window.document;const content = document.getElementById('app').textContent;

console.log(content); // "المحتوى"

3. Htmlparser2 — أقصى أداء

مكتبة htmlparser2 هي محلل منخفض المستوى يعمل بناءً على الأحداث (نهج مشابه لـ SAX). لا يقوم بإنشاء شجرة DOM، بل يولد أحداثًا عند مواجهة كل وسم أو سمة أو عقدة نصية. وهذا يجعله أسرع محلل في Node.js.

الميزات:

• معالجة تدفقية (يمكن تحليل ملفات بحجم غيغابايت)
• استهلاك ضئيل للذاكرة
• دعم XML و HTML
• لا توجد طرق مدمجة للتنقل (تحتاج لكتابة منطقك الخاص)

مثال على الاستخدام:

const htmlparser2 = require('htmlparser2');const html = '<div class="item">المنتج 1</div><div class="item">المنتج 2</div>';

const items = [];const parser = new htmlparser2.Parser({    onopentag(name, attribs) {        if (name === 'div' && attribs.class === 'item') {            this.currentItem = '';        }    },    ontext(text) {        if (this.currentItem !== undefined) {            this.currentItem += text;        }    },    onclosetag(name) {        if (name === 'div' && this.currentItem !== undefined) {            items.push(this.currentItem.trim()