Разработчикам, использующим сервис-воркеров и Cache Storage API, следует обратить внимание на два небольших изменения, которые появятся в Chrome 71. Оба изменения приводят реализацию Chrome в большее соответствие со спецификациями и другими браузерами.
Запрет асинхронного importScripts()
importScripts()
сообщает вашему основному сервисному рабочему сценарию, что нужно приостановить его текущее выполнение, загрузить дополнительный код с заданного URL-адреса и запустить его до завершения в текущей глобальной области . Как только это будет сделано, основной сценарий сервисного работника возобновит выполнение. importScripts()
пригодится, если вы хотите разбить основной сценарий сервис-воркера на более мелкие части по организационным причинам или использовать сторонний код, чтобы добавить функциональность вашему сервис-воркеру.
Браузеры пытаются смягчить возможные проблемы с производительностью, связанные с «загрузкой и запуском некоторого синхронного кода», автоматически кэшируя все, что было получено с помощью importScripts()
, а это означает, что после первоначальной загрузки на выполнение импортированного кода требуется очень мало накладных расходов.
Однако, чтобы это работало, браузер должен знать, что после первоначальной установки в сервис-воркер не будет импортировано никакого «неожиданного» кода. Согласно спецификации сервис-воркера , вызов importScripts()
должен работать только во время синхронного выполнения сценария сервис-воркера верхнего уровня или, если необходимо, асинхронно внутри обработчика install
.
До Chrome 71 работал асинхронный вызов importScripts()
вне обработчика install
. Начиная с Chrome 71 , эти вызовы вызывают исключение во время выполнения (если тот же URL-адрес не был ранее импортирован в обработчик install
), что соответствует поведению в других браузерах.
Вместо такого кода:
// This only works in Chrome 70 and below.
self.addEventListener('fetch', event => {
importScripts('my-fetch-logic.js');
event.respondWith(self.customFetchLogic(event));
});
Код вашего сервис-воркера должен выглядеть так:
// Move the importScripts() to the top-level scope.
// (Alternatively, import the same URL in the install handler.)
importScripts('my-fetch-logic.js');
self.addEventListener('fetch', event => {
event.respondWith(self.customFetchLogic(event));
});
Устаревшие повторяющиеся URL-адреса, передаваемые в кэш.addAll().
Если вы используете Cache Storage API вместе с сервис-воркером, в Chrome 71 есть еще одно небольшое изменение, чтобы привести его в соответствие с соответствующей спецификацией . Когда один и тот же URL-адрес передается несколько раз при одном вызове cache.addAll()
, в спецификации говорится, что обещание, возвращаемое вызовом, должно быть отклонено.
До Chrome 71 это не обнаруживалось, и повторяющиеся URL-адреса фактически игнорировались.
Это ведение журнала является прелюдией к Chrome 72, где вместо простого зарегистрированного предупреждения дублирующиеся URL-адреса будут приводить к отклонению cache.addAll()
. Если вы вызываете cache.addAll()
как часть цепочки обещаний, передаваемой в InstallEvent.waitUntil()
, что является обычной практикой, этот отказ может привести к сбою установки вашего сервис-воркера.
Вот как вы можете столкнуться с проблемами:
const urlsToCache = [
'/index.html',
'/main.css',
'/app.js',
'/index.html', // Oops! This is listed twice and should be removed.
];
self.addEventListener('install', event => {
event.waitUntil(
caches.open('my-cache').then(cache => cache.addAll(urlsToCache))
);
});
Это ограничение применяется только к фактическим URL-адресам, передаваемым в cache.addAll()
, и кэширование того, что в конечном итоге представляет собой два эквивалентных ответа с разными URL-адресами, например '/'
и '/index.html'
, не приведет к отклонению.
Широко протестируйте реализацию своего сервис-воркера
На данный момент сервис-воркеры широко реализованы во всех основных «вечнозеленых» браузерах . Если вы регулярно тестируете свое прогрессивное веб-приложение в нескольких браузерах или у вас есть значительное количество пользователей, которые не используют Chrome, то, скорее всего, вы уже обнаружили несогласованность и обновили свой код. Но на тот случай, если вы не заметили такого поведения в других браузерах, мы хотели объявить об этом изменении, прежде чем переключать поведение Chrome.