نظرة من الداخل على متصفح الويب الحديث (الجزء 1)

Mariko Kosaka

وحدة المعالجة المركزية (CPU) ووحدة معالجة الرسومات (GPU) والذاكرة والبنية متعددة العمليات

في سلسلة المدونات هذه المكونة من 4 أجزاء، سنلقي نظرة على متصفح Chrome بدءًا من البنية عالية المستوى إلى تفاصيل مسار العرض. إذا تساءلت يومًا كيف يحول المتصفح الرمز الخاص بك إلى موقع ويب فعال، أو إذا كنت غير متأكد من سبب اقتراح أسلوب معين للأداء التحسينات، فهذه السلسلة مناسبة لك.

وفي إطار هذا السلسلة، سنلقي نظرة على مصطلحات الحوسبة الأساسية وواجهة بنية متعددة العمليات.

وحدة المعالجة المركزية (CPU) ووحدة معالجة الرسومات هي جوهر الكمبيوتر

لفهم البيئة التي يعمل بها المتصفح، نحتاج إلى فهم بعض أجزاء الكمبيوتر وماذا تفعل.

وحدة معالجة مركزية (CPU)

وحدة معالجة مركزية (CPU)
الشكل 1: 4 نوى وحدة معالجة مركزية كعاملين في المكاتب يجلسون في كل مهام من المكاتب عند تنفيذها

الأول هو وحدة المعالجة المركزية المركزية التي تعتمد على وحدة المعالجة المركزية (CPU). يمكن اعتبار وحدة المعالجة المركزية (CPU) دماغ الكمبيوتر. يمكن لوحدة المعالجة المركزية (CPU)، التي تظهر في الصورة هنا كعامل في المكتب، التعامل مع العديد من المهام المختلفة واحدة تلو الأخرى عند دخولها. بإمكان "مساعد Google" التعامل مع مختلف المواضيع، بدءًا من الرياضيات والفن، وفي الوقت نفسه معرفة كيفية الردّ. إلى مكالمة عميل. في الماضي، كانت معظم وحدات المعالجة المركزية (CPU) عبارة عن شريحة واحدة. يشبه النواة أي وحدة معالجة مركزية أخرى الشريحة ذاتها. في الأجهزة الحديثة، تحصل غالبًا على أكثر من نواة واحدة، ما يمنحك قدرة أكبر على الحوسبة. إلى الهواتف وأجهزة الكمبيوتر المحمولة.

وحدة معالجة الرسومات

وحدة معالجة الرسومات
الشكل 2: العديد من نوى وحدة معالجة الرسومات التي لديها مفتاح ربط يشير إلى إنجازها مَهمّة محدودة

رسومات التشغيل - أو وحدة معالجة الرسومات هي جزء آخر من جهاز الكمبيوتر. وعلى عكس وحدة المعالجة المركزية (CPU)، تعمل وحدة معالجة الرسومات على التعامل مع المهام البسيطة بشكل جيد ولكن تعمل على عدة نوى في الوقت نفسه. كاسم إلا أنه تم تطويره لأول مرة للتعامل مع الرسومات. وهذا هو السبب في أنه في سياق الرسومات "استخدام وحدة معالجة الرسومات" أو "مدعوم بوحدة معالجة الرسومات" بالعرض السريع والتفاعل السلس. في السنوات الأخيرة، ومع الحوسبة المسرّعة من خلال وحدة معالجة الرسومات (GPU)، يزداد عدد الحوسبة الممكنة على وحدة معالجة رسومات وحدها

عند بدء تشغيل تطبيق على الكمبيوتر أو الهاتف، تكون وحدة المعالجة المركزية (CPU) ووحدة معالجة الرسومات (GPU) هما الأداتان. التطبيق. عادةً ما يتم تشغيل التطبيقات على وحدة المعالجة المركزية (CPU) ووحدة معالجة الرسومات باستخدام الآليات التي توفرها نظام التشغيل.

الأجهزة، نظام التشغيل، التطبيق
الشكل 3: ثلاث طبقات من بنية الكمبيوتر. أجهزة الآلة في الجزء السفلي، وهي تعمل النظام في المنتصف، والتطبيق في الأعلى.

تنفيذ البرنامج على Process وThread

المعالجة وسلاسل المحادثات
الشكل 4: عملية كمربع إحاطة، خيوط كسمكة تجريدية تسبح داخل عملية

هناك مفهوم آخر يجب فهمه قبل الغوص في بنية المتصفح هو Process وThread. يمكن وصف العملية كبرنامج تنفيذ للتطبيق. وسلسلة المحادثات هي تلك التي تستمر داخل العملية وينفذ أي جزء من برنامج عمليتها.

عند بدء تشغيل تطبيق، يتم إنشاء عملية. قد ينشئ البرنامج سلاسل محادثات للمساعدة في ذلك. تقوم بالعمل، لكن هذا اختياري. يعطي نظام التشغيل العملية "درسًا" من الذاكرة للعمل مع الاحتفاظ بجميع حالات التطبيق في مساحة الذاكرة الخاصة تلك. عند إغلاق فإن التطبيق، تختفي العملية أيضًا، ويحرر نظام التشغيل الذاكرة.

المعالجة والذاكرة
الشكل 5: رسم تخطيطي لعملية تستخدم مساحة الذاكرة وتخزين بيانات التطبيق

يمكن أن تطلب العملية من نظام التشغيل بدء عملية أخرى لتشغيل مهام مختلفة. عندما يكون هذا يتم تخصيص أجزاء مختلفة من الذاكرة للعملية الجديدة. إذا احتاجت عمليتان إلى يمكنهم إجراء ذلك من خلال استخدام الاتصالات (IPC). تطبيقات عديدة بحيث تعمل بهذه الطريقة بحيث يمكن إعادة تشغيلها في حالة عدم استجابة العامل بدون إيقاف العمليات الأخرى التي تعمل في أجزاء مختلفة من التطبيق.

وعملية العمال وIPC
الشكل 6: رسم تخطيطي للعمليات المنفصلة التي تتصل عبر IPC

بنية المتصفح

إذًا، كيف يتم إنشاء متصفح الويب باستخدام العمليات وسلاسل البيانات؟ حسنًا، يمكن أن تكون عملية واحدة مع العديد أو سلاسل محادثات مختلفة أو عمليات مختلفة مع عدد قليل من سلاسل التعليمات التي تتصل عبر IPC.

بنية المتصفّح
الشكل 7: بنيات المتصفح المختلفة قيد المعالجة / الرسم التخطيطي لسلسلة المحادثات

الشيء المهم الذي يجب ملاحظته هنا هو أن هذه البُنى المختلفة المختلفة هي تفاصيل التنفيذ. لا توجد مواصفات قياسية حول كيفية إنشاء متصفح ويب. قد تتغير طريقة عمل متصفح واحد مختلفة تمامًا عن غيرها.

لأغراض سلسلة المدونات هذه، نستخدم أحدث بنية Chrome، كما هو موضح في الشكل 8.

في أعلى الصفحة، يتم تنسيق عملية المتصفّح مع العمليات الأخرى التي تعتني بمختلف من التطبيق. بالنسبة إلى عملية العارض، يتم إنشاء عمليات متعددة وتعيينها إلى كل علامة تبويب. حتى وقت قريب جدًا، نفّذ Chrome عملية لكل علامة تبويب متى أمكن ذلك؛ والآن يحاول أن يعطي لكل موقع إلكتروني العملية الخاصة به، بما في ذلك إطارات iframe (راجِع عزل الموقع).

بنية المتصفّح
الشكل 8: رسم تخطيطي لبنية Chrome المتعددة العمليات. يتم عرض طبقات متعددة ضمن عملية العارض لتمثيل Chrome الذي يشغِّل عمليات عرض متعددة لكل علامة تبويب.

ما العملية التي تتحكم في ماذا؟

يوضّح الجدول التالي كل عملية في Chrome والميزات التي تخضع لها:

المعالجة وما الذي تتحكم فيه
المتصفح يتحكّم هذا الإعداد في "chrome". من التطبيق بما في ذلك شريط العناوين والإشارات المرجعية أزرار التقديم/الترجيع.
يتعامل أيضًا مع الأجزاء غير المرئية والمميزة من متصفح الويب، مثل الشبكة والدخول إلى الملفات.
العارض يتحكّم هذا الإعداد في أي عنصر داخل علامة التبويب التي يتم عرض الموقع الإلكتروني عليها.
المكوّن الإضافي يتحكّم هذا الإعداد في أي مكوّنات إضافية يستخدمها الموقع الإلكتروني، مثل flash.
وحدة معالجة الرسومات يتعامل مع مهام وحدة معالجة الرسومات بمعزل عن العمليات الأخرى. يتم فصلها إلى عمليات مختلفة وذلك لأنّ وحدات معالجة الرسومات تتعامل مع الطلبات الواردة من تطبيقات متعددة وترسمها في مساحة عرض واحدة.
عمليات Chrome
الشكل 9: عمليات مختلفة تشير إلى أجزاء مختلفة من واجهة مستخدم المتصفّح

هناك المزيد من العمليات مثل عملية الإضافة وعمليات الأداة. إذا كنت ترغب في مشاهدة عدد العمليات التي تعمل في Chrome، انقر على رمز قائمة الخيارات في أعلى يسار الشاشة، وانقر على "المزيد من الأدوات"، ثم وحدد "مدير المهام". سيؤدي هذا إلى فتح نافذة تحتوي على قائمة بالعمليات قيد التشغيل حاليًا وحجم وحدة المعالجة المركزية (CPU) / الذاكرة التي يستخدمونها.

فائدة البنية متعددة العمليات في Chrome

ذكرتُ سابقًا أن Chrome يستخدم عمليات عرض متعددة. في أبسط الحالات، يمكنك تخيل أن كل علامة تبويب لها عملية عارض خاصة بها. لنفترض أنّ لديك 3 علامات تبويب مفتوحة وأنّ كل علامة تبويب قيد التشغيل. من خلال عملية عرض مستقلة

وإذا أصبحت إحدى علامات التبويب غير مستجيبة، يمكنك إغلاق علامة التبويب غير المستجيبة والمضي قدمًا مع الاحتفاظ هناك علامات تبويب أخرى نشطة. إذا كانت جميع علامات التبويب قيد التشغيل في عملية واحدة، وعندما لا تستجيب إحدى علامات التبويب، علامات التبويب لا تستجيب. هذا محزن.

برنامج عرض متعدد لعلامات التبويب
الشكل 10: رسم تخطيطي يعرض عمليات متعددة تعمل على كل علامة تبويب

هناك فائدة أخرى لفصل عمل المتصفح إلى عمليات متعددة هي الأمان وضع الحماية. ونظرًا لأن أنظمة التشغيل توفر طريقة لتقييد العمليات امتيازات، فإن المتصفح يمكنه وضع حماية لعمليات معينة من ميزات معينة. على سبيل المثال، يقيّد متصفّح Chrome الوصول العشوائي إلى الملفات في العمليات التي تعالج البيانات العشوائية التي يُدخلها المستخدمون، مثل عملية العارض

نظرًا لاحتواء العمليات على مساحة ذاكرة خاصة بها، فإنها غالبًا ما تحتوي على نسخ من الملفات البنية الأساسية (مثل V8، وهو محرك JavaScript في Chrome). وهذا يعني زيادة استخدام الذاكرة فلن تتم مشاركة هذه البيانات بالطريقة التي تكون بها إذا كانت سلاسل محادثات داخل العملية نفسها. لتوفير مساحة في الذاكرة، يضع Chrome حدًا لعدد العمليات التي يمكنه تعديلها. يختلف هذا الحد بناءً على مقدار طاقة الذاكرة ووحدة المعالجة المركزية (CPU) التي يمتلكها جهازك، ولكن عندما يصل Chrome يبدأ تشغيل علامات تبويب متعددة من نفس الموقع في عملية واحدة.

حفظ المزيد من الذاكرة - الخدمة في Chrome

ويتم تطبيق الطريقة نفسها على عملية المتصفِّح. يخضع Chrome لتغييرات هيكلية تشغيل كل جزء من برنامج المتصفح كخدمة مما يسمح بالتقسيم إلى عمليات مختلفة أو تجميعها في واحدة.

الفكرة العامة هي أنه عند تشغيل Chrome على أجهزة قوية، قد يقسم كل خدمة إلى عمليات مختلفة توفر مزيدًا من الاستقرار، ولكن إذا كانت على جهاز يقيد موارده، فإن Chrome ودمج الخدمات في عملية واحدة مما يوفر أثر الذاكرة. نهج مشابه للتوحيد لتقليل استخدام الذاكرة على أنظمة أساسية مثل Android قبل هذا التغيير.

خدمة Chrome
الشكل 11: رسم تخطيطي لخدمة Chrome التي تنقل الخدمات المختلفة إلى عمليات متعددة وعملية متصفح واحدة

عمليات العرض لكل إطار - عزل الموقع

تعد ميزة عزل الموقع مؤخرًا في Chrome، وهي تشغِّل عملية عارض منفصلة لكل إطار iframe في مواقع إلكترونية متعددة. لقد كنا نتحدث عن عملية عارض واحدة لكل نموذج من نماذج علامات التبويب، ما سمح بإجراء عمليات عرض على مواقع إلكترونية متعددة تشغيل إطارات iframe في عملية عارض واحدة مع مشاركة مساحة الذاكرة بين المواقع المختلفة قد يبدو تشغيل a.com وb.com في عملية العارض نفسها أمرًا مقبولاً. سياسة المصدر نفسه هو نموذج الأمان الأساسي للويب، يتأكد من عدم إمكانية وصول موقع واحد إلى البيانات من المواقع الأخرى بدون موافقة. يُعد تجاوز هذه السياسة هدفًا أساسيًا للهجمات الأمنية. يُعد عزل العمليات الطريقة الأكثر فعالية لفصل المواقع. مع Meltdown وSpectre أصبح من الواضح أننا بحاجة إلى فصل المواقع باستخدام العمليات. مع تفعيل ميزة "عزل المواقع الإلكترونية" على سطح المكتب تلقائيًا بدءًا من الإصدار Chrome 67، يتم عرض كل إطار iframe لكل المواقع الإلكترونية في علامة تبويب على عملية عارض منفصلة.

عزل المواقع الإلكترونية
الشكل 12: رسم تخطيطي لعزل الموقع؛ عمليات عرض متعددة تشير إلى إطارات iframe داخل موقع إلكتروني

يمثّل تفعيل ميزة "عزل المواقع الإلكترونية" جهدًا هندسيًا لعدّة سنوات. ميزة عزل المواقع ليست بسيطة مثل تعيين عمليات عرض مختلفة فإنها تغير جذريًا الطريقة التي تتحدث بها إطارات iframe مع كل آخر. يعني فتح أدوات مطوري البرامج على صفحة بها إطارات iframe تعمل على عمليات مختلفة أن أدوات مطوّري البرامج اضطررت إلى وتنفيذ أعمال وراء الكواليس لجعلها تبدو سلسة. حتى تشغيل Ctrl+F بسيط لإيجاد كلمة في صفحة تعني البحث عبر عمليات العرض المختلفة. يمكنك معرفة سبب يتحدّث مهندسو المتصفّح عن إطلاق ميزة "عزل المواقع الإلكترونية" باعتبارها إنجازًا رئيسيًا.

الخاتمة

في هذه المشاركة، تناولنا عرضًا عالي المستوى لبنية المتصفح وتناولنا مزايا بنية متعددة العمليات. تناولنا أيضًا خدمات الصيانة وعزل المواقع في Chrome التي ارتباطًا وثيقًا بالبنية متعددة العمليات. في المشاركة التالية، سنبدأ في التعمق في بين هذه العمليات وسلاسل المحادثات من أجل عرض موقع إلكتروني.

هل استمتعت بالمشاركة؟ إذا كانت لديك أي أسئلة أو اقتراحات بشأن المشاركة المستقبلية، يُرجى التواصل معنا. التواصل معك على @kosamari على Twitter

التالي: ماذا يحدث في التنقّل