العرض لتطبيقات الويب المستندة إلى المحتوى

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

العرض من جهة الخادم (SSR)

يتضمّن العرض من جهة الخادم (SSR) عرض صفحات الويب على الخادم ثم إرسال رمز HTML المعروض بالكامل إلى متصفّح العميل بدلاً من عرضها من جهة العميل باستخدام JavaScript. عندما يصل المستخدمون إلى تطبيق، يرسل المتصفح طلبًا إلى الخادم. يعالج التطبيق الطلب على الخادم، بما في ذلك جمع البيانات من قواعد بيانات أو واجهات برمجة تطبيقات خارجية، ثم يعرض ترميز HTML للصفحة المطلوبة. بعد ذلك، يرسل الخادم رمز HTML المعروض بالكامل للصفحة إلى متصفّح المستخدم. عندما يتلقّى متصفّح المستخدم رمز HTML، يحمِّل المتصفّح أي ملفات JavaScript مطلوبة.

تعرَّف على HTML على web.dev.

تشمل مزايا استخدام SSR سرعة التحميل المبدئي السريعة والأداء الجيد لتحسين محركات البحث (SEO) والموثوقية وتجربة المستخدم الجيدة بشكل عام. ومع ذلك، يمكن أن يكون تطبيق SSR أكثر تعقيدًا من العرض من جهة العميل (CSR) بسبب أعباء الأداء ومهارات التطوير اللازمة لإنشاء تطبيقات متوافقة مع SSR وصيانتها. يُعد SSR مفيدًا بشكل خاص لتطبيقات الويب التي تعتمد على المحتوى ومنصات التجارة الإلكترونية وأي تطبيق يتطلب أداءً جيدًا في مجال تحسين محركات البحث وسرعات استجابة مبدئية سريعة.

إنشاء المواقع الثابتة (SSG)

تعمل ميزة إنشاء المواقع الإلكترونية الثابتة (SSG) على إنشاء ملفات HTML ثابتة في وقت الإصدار وعرضها للمستخدمين بدون عرض من جهة الخادم أو من جهة العميل. يتم تأليف محتوى الويب، عادةً بتنسيق منظَّم مثل Markdown أو JSON أو YAML، ويتضمن نصًا وصورًا ومواد عرض أخرى. تعالج أداة إنشاء المواقع الإلكترونية الثابتة، مثل Hugo أو Jekyll، المحتوى وتنشئ ملفات HTML وCSS وJavaScript. الإخراج الثابت هو موقع الويب بالكامل، ويتم نشر هذه الملفات الثابتة على خادم ويب أو شبكة توصيل محتوى (CDN) أو خدمة استضافة.

يمكنك الاطّلاع على مزيد من المعلومات حول CSS وHTML على web.dev.

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

العرض من جهة العميل (CSR)

يحدث العرض من جهة العميل (CSR) على متصفّح العميل، وليس على الخادم. غالبًا ما يتم تحميل تطبيقات الويب بأقل عدد ممكن من نماذج HTML، ثم يتم معالجة المحتوى ديناميكيًا باستخدام JavaScript والبيانات من الخوادم أو واجهات برمجة التطبيقات. بعد طلب التطبيق، يرسل الخادم مستند HTML مصغرًا بالبنية الأساسية وكود JavaScript اللازم لعرض الصفحة. يتم تنفيذ رمز JavaScript في متصفّح المستخدم. يعالج الرمز بعد ذلك البيانات التي تم جلبها وينشئ المحتوى، بما في ذلك CSS وHTML وجميع العناصر التفاعلية. يستجيب رمز JavaScript بعد ذلك لتفاعل المستخدم، مثل إرسال النموذج.

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