Javascript：有没有办法检查浏览器缓存中是否存在资产？

我正在尝试优化我的网页包大小。看看我的供应商包，最大的块是ReactDOM+React

我想我可以利用webpack的

externals

config选项，让CDN为这些资产提供服务，就像我目前使用jQuery所做的那样。但我检查了一下，我的个人浏览器没有缓存这些资产，所以我开始怀疑其他人是否会缓存这些资产。如果大多数人没有缓存这些资产，那么由于额外的往返，从外部加载这些资产将弊大于利

有人知道用于检查资产当前是否缓存的跨浏览器解决方案吗？通过这种方式，我可以在我的用户基础上生成一些分析，看看将这些更大的资产外部化是否是一个好的举措

我已经看到了大多数现代浏览器的

Cache

API。不过，我仍然需要Safari/IE的解决方案。

因为您可以在反应前后花点时间。如果该时间低于几毫秒，则它来自缓存，并且时间正好是解析所需的时间，否则它是从服务器加载的，ypu获得网络延迟：

<script>
  var start = Date.now();
 </script>
 <script src="cdn/react.min.js" ></script>
 <script>
   var loadTime = Date.now() - start;
   // Do whatever with that
   if(loadTime < 10) alert("cached");
</script>

var start=Date.now（）；
var loadTime=Date.now（）-start；
//用它做什么都行
如果（加载时间<10）警报（“缓存”）；

使用非常慢的浏览器和高速用户时，可能会出现误报和误报。不过，您可以使用查找已加载的所有资源，以及每个资源的

transferSize

属性，以了解其是否从缓存加载。传输大小为0表示缓存的负载。任何大于0的值都表示通过网络的实际传输，因此表示未缓存的资源

const resourcesStatus = window.performance.getEntriesByType('resource')
  .reduce(function(formattedOutput, resourceDetails) {
    return formattedOutput.concat({
      resourceName: resourceDetails.name,
      cached: resourceDetails.transferSize ? false : true
    })}, [])

---

我希望找到一个不需要我实际加载CDN资产的解决方案。我可以在没有立即的性能后果的情况下实施，以决定进行更改是否有益。这不是一个坏的解决方案，但有点太“去做吧，看看会发生什么”。如果没有其他选择的话，我可能会选择这样的方式。@Darklord47我认为这是不可能的。但是我们会看到，也许其他人知道如何使用

缓存

API，但您可能适合Safari/IE。页面加载性能是导致首先需要捆绑大小优化的原因，因此很难合理化某些东西，因为这样做可能会使事情变得更糟，因为没有好的方法，所以接受我得到的唯一答案