make sure that outdated web responses are ignored

barrier.js

class Barrier {
  constructor() {
    this.time = 0
    this.state = 0
  }

  start() {
    return ++this.time
  }

  // Check that the suggested update is helpful
  end(time) {
    if (this.state < time) {
      this.state = time
      return true
    }
    return false
  }
}

// Example usage:

const barrier = new Barrier()

async function search(ev) {
  const query = ev.target.value
  const transaction = barrier.start()
  const response = await fetch(`/api/search/${query}?limit=100`, {method: 'GET'})
  if (barrier.end(transaction)) {
    resultList.innerHTML = response.text()
  }
}

const input = document.createElement("input")
input.oninput = search
input.default = "Type to search..."
document.body.appendChild(input)

const resultList = document.createElement("ul")
document.body.appendChild(resultList)