フェッチイベントでrespondWithとwaitUntilの両方を使用する

Question

waitUntilをrespondWith（それ自体はfetchイベント内）内に使用する必要がありますか？ respondWithは既にwaitUntilに解決された約束を受けていませんか？

本のいくつかの議論は、両方が使用されている次の簡単な例が与えられているhere、次のとおりです。

addEventListener('fetch', event => { 
    event.respondWith(
    fetch(whatever).then(response => { 
     event.waitUntil(addThisToTheCache(response)); 
     return response; 
    }) 
); 
}); 

をしかし、これはwaitUntilなしで書き込むことができませんでしたか？次のように：

addEventListener('fetch', event => { 
    event.respondWith(
    fetch(whatever).then(response => { 
     return addThisToTheCache(response).then(() => { 
     return response; 
     }); 
    }) 
); 
}); 

Answer 1

これは、2秒で応答を表示するブラウザ処理&を遅らせます：

addEventListener('fetch', event => { 
    event.respondWith(async function() { 
    const response = await fetch(event.request); 
    await processResponseForTwoSeconds(response); 
    return response; 
    }()); 
}); 

これません。

addEventListener('fetch', event => { 
    event.respondWith(async function() { 
    const response = await fetch(event.request); 
    event.waitUntil(processResponseForTwoSeconds(response)); 
    return response; 
    }()); 
}); 

waitUntilは、滞在するサービスワーカーに伝えます進行中のタスクに対しては生きていますが、応答を遅らせることはありません。