DebounceRequestQueue

debouncerequestqueue.markdown

DebounceRequestQueue

A Pen by Tan Duong on CodePen.

License.

script.babel

class DebounceRequestQueue {
  constructor(queueLength = 6) {
    this.queueLength = queueLength;
    this.queue = [];
  }

  request(url) {
    return new Promise((resolve, reject) => {
      let req = new XMLHttpRequest();
      req.open('GET', url);
      req.onload = function () {
        if (req.status === 200) {
          resolve(req.response);
        } else {
          reject(Error(req.statusText));
        }
      };

      req.onerror = function () {
        reject(Error('Network Error'));
      };

      this.queue.push({req, resolve, reject});

      if (this.queue.length > this.queueLength) {
        let oldestOutstandingRequest = this.queue.shift();
        oldestOutstandingRequest.req.abort();
        oldestOutstandingRequest.reject(Error('Markers data call took too long; cancelling'));
      }

      req.send();
    });
  }
}

let debounceRequestQueue = new DebounceRequestQueue();
for(let i = 0; i < 20; i++) {
  debounceRequestQueue.request("https://api.soundcloud.com/tracks/197355235\?client_id\=978b6cc3cb0ba473f75da8bf6d3d0990")
    .then(r => document.write(`${i},`))
    .catch(e => document.write(e));  
}