1

目前，我正在尝试使用服务人员缓存 api 调用。它确实缓存了 api 请求。但是，它似乎没有利用缓存。当我检查 devtool 上的网络选项卡时，我看到了来自 service worker 和 workbox 的请求，甚至比正常请求还要慢。

我用 webpack 3 尝试了旧版本，缓存的 api 几乎像 3ms 一样立即返回。

在此处输入图像描述 在此处输入图像描述

在没有第二次通话之前

工作箱-webpack-插件配置

new workboxPlugin.GenerateSW({
  swDest: 'sw.js',
  clientsClaim: true,
  skipWaiting: true,
  runtimeCaching: [
    {
      urlPattern: new RegExp('/'),
      handler: 'staleWhileRevalidate',
    },
    {
      urlPattern: new RegExp('https://api/'),
      handler: 'cacheFirst',
      options: {
        cacheName: 'api',
        expiration: {
          maxEntries: 100,
          maxAgeSeconds: 72 * 60 * 60
        },
        cacheableResponse: { statuses: [0, 200] },
      }
    },
  ]

})

服务人员请求创建某种瓶颈？

附带问题 - 网络请求中的两个时间段有什么区别？正如您从图像中看到的，第一次请求时有 3.53 秒和 2.01 秒

4

0 回答 0