انتقل إلى محتوى الدرس
ابدأ رحلتك
فقرة فرعية #2 من درس: كيف تحمّل المتصفحات المواقع وتعرضها

Fetching Files from Web Servers جلب ملفات الصفحة من الخادم

افهم بعمق هندسي مسار العرض الحرج داخل المتصفح؛ كيف تتحول أكواد HTML وCSS إلى شجرتي DOM وCSSOM وشجرة العرض، والفرق بين إعادة التخطيط Reflow وإعادة الرسم Repaint والتركيب عبر GPU.
3 صفوف تعليمية
تكنولوجيا الويب
3 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

بمجرد وصول أول دفعة من بايتات ملف عبر الشبكة، يبدأ محلل المتصفح بتنفيذ أربع خطوات متسلسلة لبناء شجرة كائنات المستند ():

  1. 1. تحويل البايتات إلى حروف (): يقرأ المتصفح الأرقام الثنائية الخام ويترجمها إلى حروف نصية وفق نظام الترميز المحدد في الملف (وهو قياسياً ).
  2. 2. التقطيع اللغوي إلى رموز (): يقسم المحلل النص إلى وحدات معيارية () مثل وسم بداية ووسم نهاية ومحتوى نصي.
  3. 3. إنشاء العقد البرمجية (): يُحوّل كل رمز إلى كائن برمجي مستقل في الذاكرة يُسمى عقدة () يحمل خصائص العنصر وسماته.
  4. 4. ربط شجرة : يربط المحلل هذه العقد في علاقة أب وابن وشقيق لتكوين شجرة هرمية تبدأ من الجذر .
الصف 2 كود برمجي
HTML 
<!DOCTYPE html>
<html lang="en">
  <head>
    <title>CloseTag DOM</title>
  </head>
  <body>
    <h1 id="hero-title">Web Rendering</h1>
    <p class="lead">Fast DOM Tree Construction</p>
  </body>
</html>
الصف 3 ملاحظة هامة

جميع فقرات هذا الدرس (كيف تحمّل المتصفحات المواقع وتعرضها)