Learning jQuery 3 - Fifth Edition

Caching responses

If we need to use the same piece of data repeatedly, it is wasteful to make an Ajax request each time. To prevent this, we can cache the returned data in a variable. When we need to use some data, we can check to see whether the data is already in the cache. If so, we act on this data. If not, we need to make an Ajax request, and in its .done() handler, we store the data in the cache and act on the returned data.

If we exploit the properties of promises, it can be quite simple:

$(() => {  const cache = new Map();  $('#ajax-form')    .on('submit', (e) => {      e.preventDefault();      const search = $('#title').val();      if (search == '') {        return;      }      $('#response')        .addClass('loading')        .empty();      cache.set(search, cache.has(search) ? cache.get(search) ...