将使用 Ajax 加载的插件保存到缓存答案

【问题标题】：Save plugin loaded with Ajax to cache将使用 Ajax 加载的插件保存到缓存
【发布时间】：2017-05-29 15:58:02
【问题描述】：

所以我使用此代码来更改我的网站内容并为每个“页面”加载特定插件：

$.ajax({
  url: urlPath, 
  type: 'GET',
  success: loadContent //content and plugins are loaded through this
});

现在我注意到它没有缓存来自loadContent 的加载的插件，每次下载它们一次又一次，因此使用 ajax 请求 的页面是 0.5s 到 1.5s 比 简单的 http 请求慢 0.5s 到 1.5s（显然在插件已经从第一次加载缓存之后）。使用cache: true/false 没有任何区别。

我已经读过这不能完成，因为 javascript 无法写入磁盘，但我仍然可能遗漏了一些东西，并且有一种方法可以缓存插件并避免在每次加载时浪费额外的时间？

【问题讨论】：

您应该再等一会儿，直到您删除一个问题。我正在尝试回答您的最新问题，并且即将完成我的回答，直到我注意到您已经删除了您的问题。是的，SO does have a major problem with people being plain rude & unhelpful，但要知道不是每个人都是这样 ;-)
@JohnSlegers 是的，我有点生气，因为我没有要求任何代码，只是一个文本答案，人们表现得就像我要求制作此类按钮的完整指南一样。谢谢你的回复，让我感觉好多了。我希望你也有美好的一天:)（我知道，谢谢回复，所有这些东西在 SO 上也不受欢迎，但无论如何）
我个人觉得有趣的大多数问题最终都因为“太宽泛”或不包含任何代码等愚蠢的原因而在 SO 上被关闭。我完全同意，当你只是想弄清楚某种方法是否有意义时，人们要求你展示一些代码是没有任何意义的。我想我与你的情况有关，因为我自己不止一次站在你的立场上；-)
关于您删除的问题...我不会寻求完整的 CSS 解决方案。这很复杂，不值得努力。相反，我会选择sprite，其中每个元素（书、铅笔……）都是一个单独的“图像”，并使用这些不同的“图像”作为 div 元素的背景。另外，如果可能的话，我会选择 svg 而不是 png。如今，浏览器中的 svg 支持相当不错，而且您会以更小的文件大小获得更清晰/更干净的结果。
我正要走同样的路，虽然我不知道 .svg 更好，但会使用它。你刚刚激励我回到 SO，我只记得我说过在几个月前的类似情况之后我不会再踏上这里了。干杯！

标签： javascript jquery html ajax caching

【解决方案1】：

您可以使用 localStorage 来替代缓存。每个网站都有权在用户磁盘上存储最多 5 MB 的数据。

所以用这个来保存数据：

//browser support localStorage
if((typeof(Storage) !== "undefined"){
    localStorage.setItem("mydataname", data);
}

然后检索或下载一个新的：

//browser support localStorage
if((typeof(Storage) !== "undefined"){
    var data = localStorage.getItem("mydataname");
    if(data){ //data does exist in localStorage
        // Use data, no need to download a new version.
    }
    else{ // data doesn't exist, not saved yet or have been removed
        // download new version of data and save it using the above code.
    }
}
else{
    // browser doesn't support localStorage redownload data.
}

更多关于 localStorage here.

【讨论】：