code: function onFetch(event) {
    // Make sure this is a request we should be handling in the first place.
    // If it's not, it's important to leave it alone and not call respondWith.
    let useCache = false;
    for (const prefix of CACHEABLE_URL_PREFIXES) {
      if (event.request.url.startsWith(prefix)) {
        useCache = true;
        break;
      }
    }
  
    // Now we need to check our resource lists.  The list of prefixes above won't
    // cover everything that was installed initially, and those things still need
    // to be read from cache.  So we check if this request URL matches one of
    // those lists.
    // The resource lists contain some relative URLs and some absolute URLs.  The
    // check here will only be able to match the absolute ones, but that's enough,
    // because the relative ones are covered by the loop above.
    if (!useCache) {
      if (CRITICAL_RESOURCES.includes(event.request.url) ||
          OPTIONAL_RESOURCES.includes(event.request.url)) {
        useCache = true;
      }
    }
  
    if (useCache) {
      event.respondWith(fetchCacheableResource(event.request));
    }
  }
docs: This event fires when any resource is fetched.
  This is where we can use the cache to respond offline.
  
  @param {!FetchEvent} event