0

我很痛苦，我希望有人可以帮助！

我有一段非常慢的代码。我有 40 variables，对于他们每个人，我执行以下操作：

for (i=variables.length; i--;) {
  metric = URL?name=variable;
  d3.select( ... get_data(metric)).... // calls to visualize the data 
}

function get_data(metric) { 
  d3.json(metric, function(data) {
     // do stuff 
  }); 
}

为了让它更快，我做了以下事情：

for (i=variables.length; i--;) {
  metric = URL;
  d3.select( ... get_data(metric,variable)).... // calls to visualize the data
} 

function get_data(metric,variable) { 
  d3.json(metric, function(data) {
    parse(data, variable) // extract variable related data
    // do stuff 
  }); 
}

新代码至少快 6 倍！但为什么？我不是在获取更多数据吗？

编辑：我回去并console.log(data)在新get_data功能中做了一个，令人惊讶的是它确实请求了整个数据（URL）40次！但这比做 40 种不同的 (URL?name=variable) 更快

4

1 回答 1

1

您不再将变量添加到 URL，因此 URL 保持不变。我相信浏览器会在第一个请求后缓存响应，因此剩余的 39 个请求是从缓存中提供的。

毕竟，您发出的 HTTP 请求更少，这意味着花费在建立连接上的时间更少。

“最佳”解决方案是总共只发出一个 Ajax 请求：

var get_data = (function() {
  var cache = {};

  function doStuff(data, variable) {
    parse(data, variable);
    // do stuff
  }

  return function(metric, variable) {
    if (cache[metric]) {
      doStuff(cache[metric], variable);
    }
    else {
      d3.json(metric, function(data) {
        cache[metric] = data;
        doStuff(data, variable);
      }); 
    }
  };
}());
于 2013-08-26T20:42:24.903 回答