Question

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

Answer 1

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

从CDN获取资源是一个延迟调用，而从缓存中获取项目实际上似乎是一个阻塞调用，尽管速度很快。
Firefox并没有始终如一地展示这种展览行为（我甚至不打扰IE）。

为了进一步测试这个观察结果，我构建了以下小小提琴，它可靠地为我提供在Chrome 上。如果你有时间，请对你自己的测试结果发表评论。

＆＃13;

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);
}

＆＃13;

<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" />

＆＃13;

测量外部CDN资源的访问者HTTP缓存命中率

1 个答案: