AJAX Performance
Minimise AJAX requests with batching, response caching, and request deduplication.
jQuery
Advanced
4 min read
Ajax Performance Tuning
Example
// Deduplicate concurrent identical requests
const pending = {};
function dedupeGet(url) {
if (!pending[url]) {
pending[url] = $.getJSON(url).always(() => delete pending[url]);
}
return pending[url];
}
// Batch multiple requests into one call
function batchFetch(ids) {
return $.getJSON(`/api/items?ids=${ids.join(",")}`);
}
// Browser-cache with If-None-Match (304 response = no body transfer)
$.ajax({ url: "/api/data", headers: { "If-None-Match": lastEtag }, success: (data, _, xhr) => { lastEtag = xhr.getResponseHeader("ETag"); } }); Pro Tip
Deduplication prevents double-fetching when two components request the same URL simultaneously.