إجابة سريعة: تحتوي شجرة Document Object Model (DOM) على ما يصل إلى 92% من الرموز الزائدة الناتجة عن رسوم SVG المضمنة وفئات CSS ونصوص التتبع والقوائم. يؤدي استخدام html parser عالي السرعة مثل lxml أو Cheerio أو Tree-sitter لحذف العقد غير الدلالية إلى تحقيق token reduction html بنسبة 85–92%، مما يقلل تكاليف الاستدلال ويرفع دقة أنظمة RAG.
1. المقدمة: ما هو Document Object Model (DOM) ولماذا يدمر كود HTML الخام نماذج LLM؟
تواجه وكلاء تصفح الويب المستقلة وأنظمة RAG (Retrieval-Augmented Generation) وأدوات كشط البيانات عقبة رئيسية: كود HTML الخام غير المعالج. عندما يزور وكيل الذكاء الاصطناعي صفحة ويب عبر Playwright أو بروتوكول HTTP، يقوم محرك المتصفح بتحويل البايتات إلى هيكل شجري في الذاكرة يُعرف باسم شجرة document object.
ما هو Document Object Model (DOM)؟
لتحسين معالجة البيانات لنماذج اللغة، يجب على المهندسين استيعاب المفهوم الأساسي: what is document object model dom؟
إن Document Object Model (DOM) هو واجهة برمجية قياسية ومحايدة للغات ينشئها محرك المتصفح (Blink في Chromium، Gecko في Firefox، WebKit في Safari). بمجرد استلام ملف HTML، يقوم المحلل بتحليله لغوياً لبناء تسلسل شجري للعقد (Document $\rightarrow$ Element $\rightarrow$ Text) ويدمج قواعد CSSOM لحساب التخطيط المرئي. في المتصفحات العادية، تتيح هذه البنية document object العرض البصري والتفاعل عبر JavaScript.
التحليل اللغوي في المتصفح وبناء شجرة Document Object Model (DOM):
┌─────────────────────────────────────────────────────────────────────────────┐
│ تدفق بايتات HTML الخام │
│ <!DOCTYPE html><html lang="ar"><head>... │
└──────────────────────────────────────┬──────────────────────────────────────┘
│ محلل الرموز (خوارزمية HTML5 Parser)
▼
┌─────────────────────────────────────────────────────────────────────────────┐
│ تدفق الرموز اللغوية │
│ [StartTag: html] [StartTag: head] [StartTag: script] [EndTag: head] │
└──────────────────────────────────────┬──────────────────────────────────────┘
│ باني الشجرة (Tree Builder)
▼
┌─────────────────────────────────────────────────────────────────────────────┐
│ شجرة Document Object Model (DOM) │
│ Document │
│ │ │
│ <html> │
│ ┌─────────────────┴─────────────────┐ │
│ <head> <body> │
│ ┌───────┴───────┐ ┌───────┴───────┐ │
│ <title> <script> <header> <main> │
│ │ │ │ │ │
│ "العنوان" [تتبع JS] <nav> <article> │
│ │ │ │
│ <ul>... <p> "النص المفيد" │
└─────────────────────────────────────────────────────────────────────────────┘أضرار كود DOM الخام على نماذج الذكاء الاصطناعي:
- تضخم نافذة السياق: تولد صفحة الويب النموذجية ما بين 45,000 و 120,000 رمز HTML. يشكل 85% إلى 92% منها شوائب رقمية: إحداثيات منحنيات SVG المضمنة، وفئات CSS، ونصوص التتبع وإشعارات ملفات تعريف الارتباط.
- تشتت الانتباه وتراجع دقة RAG: يؤدي دفن النص المفيد تحت 40,000 رمز غير ذي صلة إلى حدوث ظاهرة "Lost in the Middle"، مما يقلل دقة استرجاع RAG بنسبة 34% إلى 48%.
- تكاليف استدلال باهظة: معالجة 100,000 صفحة غير منظفة يومياً تكلف أكثر من 18,000 دولار شهرياً. التنظيف الفعال يقلل الفاتورة إلى أقل من 2,200 دولار.
2. مسار تقليم DOM المكون من 5 مراحل
- المرحلة 1: حذف الوسوم المحظورة: إزالة كاملة لوسوم