تطبيقات الويب التقدّمية على أجهزة الكمبيوتر المكتبي

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

في ChromeOS، تبرز قوة النظام الأساسي للويب، وتُعدّ تطبيقات الويب إحدى الميزات الأساسية للنظام الأساسي. تظهر تطبيقات الويب التقدّمية المثبَّتة في مشغّل ChromeOS، ويمكن تثبيتها على الرف، كما أنّها تتكامل بشكل كبير مع بقية نظام التشغيل.

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

تسهيل تثبيت التطبيق

من أهم مزايا تطبيقات الويب التقدّمية مقارنةً بتطبيقات الويب العادية هي إمكانية تثبيتها، تمامًا مثل تطبيقات الكمبيوتر التقليدية. يتضمّن مسار "تطبيق الويب التقدّمي" على web.dev قسمًا مخصّصًا لإتاحة تثبيت تطبيق الويب التقدّمي، ويمكنك استخدامه لبدء العمل. لكي يتم تحديد تطبيق ويب تقدّمي (PWA) على أنّه قابل للتثبيت على ChromeOS، يجب استيفاء المعايير التالية التي يمكن التحقّق منها باستخدام تدقيق قابلية التثبيت في Lighthouse:

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

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

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

ملاحظة حول العمل بلا إنترنت

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

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

إذا أردت توفير تجربة أكثر فعالية، يمكنك استخدام ميزات مثل IndexedDB لتخزين NoSQL داخل المتصفح والمزامنة في الخلفية للسماح للمستخدمين باتّخاذ إجراءات أثناء عدم الاتصال بالإنترنت وتأجيل التواصل مع الخادم إلى أن يتوفّر للمستخدم اتصال ثابت بالإنترنت مرة أخرى، وذلك بالإضافة إلى Cache Storage API. يمكنك أيضًا تنفيذ أنماط مثل الجلسات الآمنة والطويلة الأمد لإبقاء المستخدمين مصادقًا عليهم وشاشات الهيكل العظمي لإعلام المستخدمين بسرعة بأنّك تحمّل المحتوى الذي يمكن أن يعود إلى المحتوى المخزّن مؤقتًا أو مؤشر بلا إنترنت إذا لزم الأمر.

إمكانية التفاعل مع المحتوى

تتوافق جميع أجهزة ChromeOS تقريبًا مع اللمس، ويتوافق العديد منها مع أقلام الشاشة أيضًا، لذا عليك التأكّد من أنّ تطبيقك يعمل بسلاسة مع كلتا طريقتَي الإدخال بالإضافة إلى لوحة المفاتيح والماوس العاديين. تم تصميم واجهة برمجة تطبيقات أحداث المؤشر خصيصًا للتعامل مع هذه المشكلة. بعض الأحداث الأساسية المتعلّقة بالمؤشر التي من المحتمل ألا تحتاج إلى تغييرها، مثل أحداث click. يجب نقل الأحداث الأخرى، مثل mouseup أو touchstart، إلى أحداث المؤشر المقابلة لها لتعمل بسلاسة على أي نوع من المؤشرات. يمكنك حتى إدارة أنواع الإدخال المختلفة بشكل منفصل إذا أردت ذلك. بالنسبة إلى التطبيقات والألعاب التي تعتمد بشكل كبير على إدخال المستخدم اللمسي، سيحدث فرق كبير عند الانتقال إلى Pointer Events API على أجهزة ChromeOS.

الرسم بسلاسة على الويب

إذا كنت بصدد إنشاء تطبيق يتيح للمستخدمين الرسم باستخدام أصابعهم أو أقلامهم، كان من الصعب في السابق الحفاظ على سرعة كافية في وقت الاستجابة بين إدخال المستخدم وإخراج التطبيق لضمان سلاسة التجربة. عند إنشاء هذا النوع من التطبيقات المستندة إلى Canvas API لنظام التشغيل ChromeOS، ننصحك باستخدام التلميح desynchronized لـ canvas.getContext() من أجل توفير عرض منخفض الاستجابة. لاستخدام التلميح desynchronized للوحة عرض، اتّبِع الخطوات التالية:

const canvas = document.createElement('canvas'); // or select one from the DOM
const ctx = canvas.getContext('2d', {
  desynchronized: true,
  // Other options here…
});

if (ctx.getContextAttributes().desynchronized) {
  // Low-latency supported! Do something awesome with it.
} else {
  // Low-latency not supported! Fall back to less awesome stuff
}

اعتبارات التصميم للشاشات التي تعمل باللمس

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

• لا تفترِض طريقة الإدخال استنادًا إلى حجم الشاشة. بدلاً من ذلك، استخدِم رصد الميزات، ويفضّل أن يكون ذلك في وقت الإدخال، لتحديد كيفية الردّ. تذكَّر أنّه على ChromeOS، يمكن للمستخدمين التبديل بسلاسة بين استخدام الماوس واللمس والقلم الرقمي خلال جلسة واحدة.
• تأكَّد من أنّ العناصر التي تتوقّع أن ينقر عليها المستخدم لها الحدّ الأدنى لحجم المساحة المستهدَفة كبير بما يكفي حتى لا يتم النقر على العناصر المحيطة بها عن طريق الخطأ بدلاً من ذلك.
• تعامَل مع التمرير فوق العناصر على أنّه تحسين تدريجي وتأكَّد من إمكانية إكمال التفاعل من خلال وسائل أخرى تعمل باللمس والقلم (مثل الضغط مع الاستمرار أو النقر).
• يتوقّع مستخدمو اللمس أن يتمكّنوا من التفاعل مباشرةً مع العناصر الظاهرة على الشاشة، مثل تحريك الإصبعين للتكبير/التصغير على الخرائط بدلاً من استخدام أزرار التكبير/التصغير. يمكن أن تساعد إضافة إيماءات اللمس الشائعة، حيثما كان ذلك مناسبًا، في جعل تطبيقك يبدو طبيعيًا.

توفير إمكانات كافية

في حين أنّ بعض إمكانات تطبيقات الويب التقدّمية معروفة بشكل شائع، مثل واجهة برمجة التطبيقات Notifications API التي تتيح لتطبيق الويب تلقّي إشعارات المنصة ونشرها، هناك عدد من الميزات الجديدة والقادمة التي ستتوفر على الويب لتعزيز تطبيقاتك. مشروع إمكانات الويب في Chromium، المعروف أيضًا باسم Project Fugu 🐡، هو جهد يهدف إلى إتاحة معايير ويب جديدة وقوية تحافظ على ما يميّز الويب، أي الأمان الذي يركّز على المستخدمين، وسهولة الاستخدام، والتوافق مع جميع الأنظمة الأساسية.

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