إضافة ميزة "مزامنة الخلفية"

جيك أرشيبالد
جيك أرشيبالد

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

المشكلة

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

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

  1. الهاتف خارج جيبك.
  2. تحقيق هدف بسيط.
  3. تمت إعادة الهاتف في جيبه.
  4. استئناف الحياة

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

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

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

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

هذا قذر. تتيح لك المزامنة في الخلفية تحسين الأمور.

الحل

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

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

اعتبارًا من آذار (مارس) 2016، ستتوفّر ميزة "المزامنة في الخلفية" في متصفِّح Chrome بدءًا من الإصدار 49 والإصدارات الأحدث. يمكنك الاطّلاع على الإجراء من خلال اتّباع الخطوات التالية:

  1. افتح Emojoy.
  2. بلا اتصال بالإنترنت (إما باستخدام وضع الطيران أو زيارة مركز الأنشطة التجارية المحلية في Faaday).
  3. اكتب الرسالة.
  4. ارجع إلى الشاشة الرئيسية (اختياريًا، أغلق علامة التبويب أو المتصفح).
  5. الاتصال بالإنترنت:
  6. يتم إرسال الرسائل في الخلفية.

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

كيفية طلب مزامنة في الخلفية

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

وكما هو الحال مع الرسائل الفورية، تستخدم السياسة عامل خدمات كهدف الحدث، ما يتيح له العمل عندما لا تكون الصفحة مفتوحة. للبدء، يمكنك التسجيل في مزامنة من إحدى الصفحات:

// Register your service worker:
navigator.serviceWorker.register('/sw.js');

// Then later, request a one-off sync:
navigator.serviceWorker.ready.then(function(swRegistration) {
  return swRegistration.sync.register('myFirstSync');
});
 ```

Then listen for the event in `/sw.js`:

```js
self.addEventListener('sync', function(event) {
  if (event.tag == 'myFirstSync') {
    event.waitUntil(doSomeStuff());
  }
});

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

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

إليك عرض توضيحي بسيط يستوفي الحدّ الأدنى المطلوب، ويستخدم حدث المزامنة لعرض إشعار.

ما الغرض من استخدام المزامنة في الخلفية؟

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

ومع ذلك، يمكنك أيضًا استخدامه لجلب أجزاء صغيرة من البيانات...

عرض توضيحي آخر!

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

جرِّب هذا بنفسك. يُرجى التأكّد من استخدام الإصدار 49 من Chrome والإصدارات الأحدث، وبعد ذلك:

  1. انتقِل إلى أي مقالة، مثلاً Chrome.
  2. قطع الاتصال بالإنترنت (إما باستخدام وضع الطيران أو الانضمام إلى مزوّد خدمة سيئ لشبكة الجوّال مثلي).
  3. انقر على رابط يؤدي إلى مقالة أخرى.
  4. من المفترض أن يتم إعلامك بتعذُّر تحميل الصفحة (سيظهر هذا أيضًا إذا استغرق تحميل الصفحة بعض الوقت).
  5. الموافقة على الإشعارات
  6. يُرجى إغلاق المتصفّح.
  7. الاتصال بالإنترنت
  8. يتم إعلامك عند تنزيل المقالة وتخزينها مؤقتًا وتكون جاهزة للعرض.

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

الأذونات

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

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

  • لا يمكنك التسجيل في حدث مزامنة إلا عندما تكون نافذة المستخدم مفتوحة على الموقع الإلكتروني.
  • تم تحديد وقت تنفيذ الحدث كحد أقصى، لذا لا يمكنك استخدامه لاختبار اتصال الخادم كل x ثانية، أو تعدين عملات Bitcoin أو غير ذلك.

بالطبع قد تخفف هذه القيود أو تتشدّد وفقًا للاستخدام في العالم الحقيقي.

التحسين التدريجي

وسيبقى بإمكانك استخدام المزامنة في الخلفية على جميع المتصفحات خلال فترة من الزمن، لا سيما وأن المتصفح Safari وEdge لا يتيحان عمل بعضهما البعض. لكن التحسين التدريجي يساعد في تحقيق ذلك:

if ('serviceWorker' in navigator && 'SyncManager' in window) {
  navigator.serviceWorker.ready.then(function(reg) {
    return reg.sync.register('tag-name');
  }).catch(function() {
    // system was unable to register for a sync,
    // this could be an OS-level restriction
    postDataFromThePage();
  });
} else {
  // serviceworker/sync not supported
  postDataFromThePage();
}

إذا لم يكن مشغّلو الخدمة أو ميزة المزامنة في الخلفية متاحة، ما عليك سوى نشر المحتوى من الصفحة كما تفعل اليوم.

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

المستقبل

نسعى إلى توفير ميزة المزامنة في الخلفية إلى إصدار مستقر من Chrome في النصف الأول من عام 2016، مع العمل على نسخة مختلفة من "المزامنة الدورية في الخلفية". باستخدام المزامنة الدورية في الخلفية، يمكنك طلب أن يكون الحدث محدودًا بالفاصل الزمني وحالة البطارية وحالة الشبكة. وبالطبع، سيتطلب ذلك إذن المستخدم، وسيعود ذلك أيضًا إلى المتصفح لتحديد وقت وعدد مرات تنشيط هذه الأحداث. بعبارة أخرى، قد يطلب موقع إخباري إجراء المزامنة كل ساعة، ولكن قد يعرف المتصفّح أنّك قرأت هذا الموقع فقط في الساعة 07:00، وبالتالي سيتم تنشيط المزامنة يوميًا في الساعة 06:50. هذه الفكرة بعيدة قليلاً عن المزامنة لمرة واحدة، ولكنها قادمة.

شيئًا فشيئًا نحن نجلب أنماطًا ناجحة من نظامي التشغيل Android وiOS على الويب، مع الاحتفاظ بالعناصر التي تجعل الويب رائعًا!