Workbox-navigation-preload

"تسريع مشغّل الخدمات باستخدام عمليات التحميل المُسبق للتنقّل" هل لتوضيح ماهية التحميل المسبق للتنقل، والمزايا التي يقدمها لتطبيقات الويب التي لا يتعامل عامل الخدمة بشكل صريح طلبات التنقّل

ما الذي تفعله هذه الوحدة؟

سيتولى workbox-navigation-preload عملية التحقُّق في وقت التشغيل لمعرفة ما إذا كان المتصفّح الحالي متوافقًا أم لا وفي حال استخدام التحميل المسبق، سيتم تلقائيًا إنشاء معالج أحداث activate من أجل لتفعيلها.

الرمز المشترَك داخل workbox-core الذي يعالج إرسال طلبات الشبكة في جميع تطبيقات Workbox تم تحديثه أيضًا للاستفادة تلقائيًا من استجابة التحميل المسبق، في حال توفرها. هذا النمط أن أي من الاستراتيجيات المضمنة يمكن أن تستفيد تلقائيًا من التحميل المسبق للتنقل، بمجرد تفعيلها.

مَن الذي عليه تفعيل عمليات التحميل المُسبق للتنقّل؟

مطوّرو البرامج الذين يتعاملون مع عمليات التنقل حاليًا من خلال الرد باستخدام محتوى HTML مخزَّن مؤقتًا (من المحتمل أن تم إعداده باستخدام إجراء احتياطي في App Shell) إلى تفعيل التحميل المُسبق للتنقّل. تهدف هذه الميزة إلى تقليل وقت الاستجابة أثناء التنقّل للمطوّرين الذين لا يمكنهم تخزين ملف HTML مسبقًا، ولكنهم يريدون استخدام Workbox لإدارة تخزين مواد العرض الأخرى على مواقعهم الإلكترونية.

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

الاستخدام الأساسي

import * as navigationPreload from 'workbox-navigation-preload';
import {NetworkFirst} from 'workbox-strategies';
import {registerRoute, NavigationRoute} from 'workbox-routing';

// Enable navigation preload.
navigationPreload.enable();

// Swap in NetworkOnly, CacheFirst, or StaleWhileRevalidate as needed.
const strategy = new NetworkFirst({
  cacheName: 'cached-navigations',
  plugins: [
    // Any plugins, like `ExpirationPlugin`, etc.
  ],
});

const navigationRoute = new NavigationRoute(strategy, {
  // Optionally, provide a allow/denylist of RegExps to determine
  // which paths will match this route.
  // allowlist: [],
  // denylist: [],
});

registerRoute(navigationRoute);

ما هي قصة دعم المتصفح؟

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

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

workbox-navigation-preload.disable()

workbox-navigation-preload.enable(
  headerValue?: string,
)

workbox-navigation-preload.isSupported()