تحسين تجربة تطوير مشغّلي الخدمات

وبينما تضمن دورة حياة عامل الخدمة عملية تثبيت وتحديث يمكن التنبؤ بها، يمكن أن تجعل دورة التنمية المحلية أكثر دقة.

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

استثناءات التنمية المحلية

بشكل عام، لا تتوفر واجهات برمجة التطبيقات لمشغّلي الخدمات إلا في الصفحات التي يتم عرضها عبر بروتوكول HTTPS، ولكن هناك استثناءات لهذه القاعدة حيث قد تكون متاحة عبر HTTP. يُستثنى من ذلك الصفحات التي يتم عرضها على مدار localhost والتي تفيد التنمية المحلية.

في المقابل، ليس من المعتاد أن يحدِّد المطوّرون أسماء مضيفين محليين باستثناء localhost في ملف المضيف (hosts). هذا الأمر مطلوب في بيئات التطوير المحلية عندما تتطلّب المشاريع المتعددة أسماء مضيفين منفصلة. وفي هذه الحالات، يكفي توفير شهادة موقَّعة ذاتيًا.

وهناك حل أكثر ملاءمة وهو إرشاد المتصفح إلى عمل استثناءات لاختبار عاملي الخدمة. في متصفّح Chrome، انتقِل إلى chrome://flags/#unsafely-treat-insecure-origin-as-secure. وتحديد مصادر غير آمنة لمعاملتها كمصادر آمنة. يوفّر Firefox طريقة لاختبار موظفي الخدمة على مصادر غير آمنة من خلال الإعداد devtools.serviceWorkers.testing.enabled في about:config.

أدوات تطوير عاملي الخدمات

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

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

  1. افتح نافذة تصفّح بخصوصيّة تامّة.
  2. انتقِل إلى صفحة تسجّل مشغّل الخدمات.
  3. تحقَّق مما إذا كان عامل الخدمة يتصرف على النحو الذي تتوقعه.
  4. أغلِق نافذة التصفّح المتخفي.
  5. والتكرار.

من خلال هذه العملية، فإنك تحاكي تمامًا دورة حياة عامل الخدمة.

أدوات الاختبار الأخرى المتوفّرة في لوحة تطبيق "أدوات مطوري البرامج في Chrome" على الرغم من أنّه بإمكانها تعديل دورة حياة عامل الخدمة بطرق معيّنة.

لوحة تطبيق "أدوات مطوري البرامج في Chrome"

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

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

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

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

نقل البيانات وإعادة التحميل

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

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

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

فحص محتوى ذاكرة التخزين المؤقت

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

فحص ذاكرة التخزين المؤقت في "أدوات مطوري البرامج"

تسهّل هذه اللوحة الفرعية تطوير مشغّلي الخدمات من خلال توفير وظائف مثل:

  • عرض أسماء Cache نسخة افتراضية
  • إمكانية فحص نص الاستجابة لمواد العرض المخزّنة مؤقتًا وعناوين الاستجابة المرتبطة بها
  • عليك إزالة عنصر واحد أو أكثر من ذاكرة التخزين المؤقت أو حذف نُسخ "Cache" بالكامل.

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

محاكاة حصة مساحة تخزين

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

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

عارض استخدام مساحة التخزين
عارض استخدام مساحة التخزين في لوحة "التطبيقات" في "أدوات مطوري البرامج" في Chrome هنا، يتم ضبط حصة مساحة تخزين مخصَّصة.

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

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

تطوير أسهل، وإنتاجية أفضل

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