Я заметил, что время, ожидающее, что работники службы ответят на элементы из кеша, не так быстро, как вы ожидали. Я видел одно и то же время ожидания как с sw-precache и с обычным письменным сотрудником службы.
Каковы возможные причины этого времени ожидания и как я могу его уменьшить?
Событие "Моя fetch для персонализированного сервисного работника выглядит так:
self.addEventListener('fetch', function(event) {
event.respondWith(
caches.match(event.request).then(function(response) {
if (response) {
return response;
}
return fetch(event.request);
})
);
});
У вас есть обновление "Обновить при перезагрузке" в Chrome Dev Tools на вкладке "Приложение → Сервис"?
Если это так, я думаю, что это может быть проблемой, поскольку он будет перезапускать весь ваш код Service Worker, который может быть довольно много кода при использовании sw-precache при каждой перезагрузке.
Событие, хотя я не могу ответить на возможные причины этого странного времени ожидания, я знаю, как его уменьшить.
Мы можем перехватить событие выборки в сервисном работнике с event.respondWith(). Каким-то образом, в моем случае, когда моя страница должна загружать javascript поставщика через тег скрипта с моими работниками по умолчанию, чтобы перехватывать каждое событие выборки, чтобы выполнить кеш-затем-сеть (для активов) или только для сети (для извлечения данных), как это:
if (shouldLoadOfflinePage) {
fetchEvent.respondWith(cacheManager.fromCache(new Request(offlinePage)));
} else if (shouldFromCache) {
fetchEvent.respondWith(cacheManager.fromCache(fetchEvent.request));
} else {
fetchEvent.respondWith(fetch(fetchEvent.request));
}
Последний блок перехватывает сетевой запрос, который довольно необязательно делать. Этот ненужный блок каким-то образом вызывает блокирующую нагрузку (но я не знаю, что его блокирует):
длинный запрос на время ожидания serviceworker: ~ 400 мс
Поэтому я решил не перехватывать ненужный перехват fetch (конечно, удалив последний блок):
if (shouldLoadOfflinePage) {
fetchEvent.respondWith(cacheManager.fromCache(new Request(offlinePage)));
} else if (shouldFromCache) {
fetchEvent.respondWith(cacheManager.fromCache(fetchEvent.request));
}
Тогда моя страница нуждается только в 16ms для загрузки вышеупомянутого файла.
Надеюсь, это поможет
очистка indexedDB поможет сократить время, затрачиваемое на "Запрос работнику службы". Вы можете удалить его с помощью js:
indexedDB.deleteDatabase(location.host);
или сделать это вручную:
/Пользователи/[USERNAME]/Library/Поддержка приложений /Google/Chrome/Default/IndexedDB/