Question

我正在尝试重写一些ajax代码，以使其更符合自动完成的需求。在这种情况下，您有时必须中止先前的请求xhr.abort()，因此重用XMLHttpRequest对象（我在此处称为xhr）感觉相当自然。

我试图了解重用XMLHttpRequest对象是好还是坏。你能看到什么利弊？

PS：此重写将使用原生ES6风格的Promise，因此它只能在较新的Web浏览器中运行。

Answer 1

正如@Bergi建议的时间测试：

function initCache(url) {
    var xhr = new XMLHttpRequest();
    xhr.open("get", url); xhr.send();
    console.log("Initialized cache");
}

function reuseXhr(url, numLoops) {
    var xhr = new XMLHttpRequest();
    for (var i=0; i<numLoops; i++) {
        xhr.open("get", url); xhr.send();
    }
    xhr.abort();
}

function newXhr(url, numLoops) {
    var xhr;
    for (var i=0; i<numLoops; i++) {
        xhr = new XMLHttpRequest();
        xhr.open("get", url); xhr.send(); xhr.abort();
    }
}
function testIt() {
    var url = "http://urlwithcors.com/"; // Pseudo-URL with CORS enabled
    var numLoops = 1000;
    initCache(url);
    setTimeout(function(){
        console.time("reuse"); reuseXhr(url, numLoops); console.timeEnd("reuse");
        console.time("new"); newXhr(url, numLoops); console.timeEnd("new");
    }, 5000);
}
testIt();

Chrome中的结果是：

test-xhr-reuse.js:6 XHR finished loading: GET ...
reuse: 510.000ms
new: 386.000ms

所以...在慢速PC上每次通话0.1毫秒，这不值得麻烦......

现在等待 - 重用xhr更慢......不值得。 ; - ）

更多的测试告诉我们没有任何区别。这只是偶然的问题。

重用XMTHttpRequest对象？

1 个答案: