My goal is to leverage HTML5 sessionStorage to store data retrieved from an external API, enabling me to cache the data for future use within the same session. This way, I can avoid redundant calls to the API and improve performance by using locally stored data.
function getItemWithTooltip(item_id, div_id) {
var xmlhttp2 = new XMLHttpRequest();
var url2 = "https://api.guildwars2.com/v2/items/"+item_id;
xmlhttp2.onreadystatechange=function() {if (xmlhttp2.readyState == 4 && xmlhttp2.status == 200) {parseItemTooltip(xmlhttp2.responseText);}};
xmlhttp2.open("GET", url2, true);
//xmlhttp2.send();
var item;
var cache_enabled = true;
// Implement caching for quicker page loads
if (cache_enabled == true){
if (Storage !== void(0)) {
// Check if data is already cached
if (sessionStorage[String(item_id)]) {
item = JSON.parse(sessionStorage[item_id.toString()]);
}
}
}
if (item == null){
xmlhttp2.send();
}
function parseItemTooltip(response) {
if (item == null){
// Store data in cache
if (cache_enabled == true){sessionStorage.setItem(item_id.toString(), JSON.stringify(response));}
item = JSON.parse(response);
}
//..Additional code removed for brevity..
}
}