javascript - 测量外部CDN资源的访客HTTP缓存命中率

我的站点使用了几种常见的CDN托管资源，例如bootstrap.css，jquery.js和fontawesome.css。是否有可能使用JavaScript获取信息，我的网站访问者是否在其Web浏览器中拥有这些资源的高速缓存？

最佳答案

虽然不是答案，但我在使用处理此问题时发现了一些有趣的见解:Chrome :

从CDN提取资源是一个延迟的调用，而从高速缓存中获取一个项目实际上似乎是一个阻塞的调用，尽管速度非常快。
Firefox似乎并没有表现出一致的行为(我什至没有为IE烦恼)。

为了进一步测试此观察结果，我构建了以下 fiddle ，该 fiddle 对我来说可以可靠地在Chrome 上运行。如果有时间，请对您自己的测试结果发表评论。

var testSource = function(href) {
  var timeLimit = 5;
  var l = document.createElement("link");
  l.rel = "stylesheet";
  l.type = "text/css";
  l.href = href;
  var s1 = document.createElement("script");
  s1.innerHTML = "window.d = new Date();";
  var s2 = document.createElement("script");
  s2.innerHTML = "window.d2 = new Date();";
  document.head.appendChild(s1);
  document.head.appendChild(l);
  document.head.appendChild(s2);
  window.setTimeout(function() {
      var p = document.createElement("p");
      if (typeof(d2) === "undefined" || d2 - d > timeLimit) {
        p.innerHTML = "guess cache";
      } else {
        p.innerHTML = "guess load";
      }
      p.innerHTML += " (" + href + ")";
      document.body.appendChild(p);
    },
    timeLimit * 10);
}

btn.onclick = function() {
  testSource(inp.value);
}

<input type="text" id="inp" value="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" />
<input type="button" id="btn" value="test url" />