在HTML5本地存储中缓存整个jquery.min.js文件

Cache entire jquery.min.js file in HTML5 localstorage

本文关键字：jquery min js 文件 缓存 HTML5 存储      更新时间：2023-09-26

我一直在尝试使用localstorage来存储Jquery min，但我无法做到。我尝试了一些Jquery插件，但它们也不起作用。

为我的web应用程序加载一次Jquery，然后再也不用担心它，这似乎是一个好主意。我正在创建的应用程序每天都有人访问。我认为他们不需要多次下载JS文件或CSS文件。

我可以将所有CSS存储在本地存储中，但不能存储Jquery或Jquery UI。

不管怎样，我知道人们会试图召集我使用缓存清单。。。。等等。但我正在寻找一种将Jquery库存储在本地存储中的方法。(这就是目标(。

有什么想法吗？

编辑：每个人都要求提供一个代码示例。所以它就在这里……它非常直接，我只使用了Jquery缩小版的一小部分，以保持帖子的小规模：

localStorage.setItem("name", "(function(a,b){function cy(a){return f.isWindow(a)?a:a.nodeType===9?a.defaultView||a.parentWindow:!1}function cv(a){if(!cj[a]){var b=f('<'+a+'>').appendTo('body'),d=b.css('display');b.remove();if(d==='none'||d===''){ck||(ck=c.createElement('iframe'),ck.frameBorder=ck.width=ck.height=0),c.body.appendChild(ck);if(!cl||!ck.createElement)cl=(ck.contentWindow||ck.contentDocument).document,cl.write('<!doctype><html><body></body>");

查看时保存的内容：

(function(a,b){function cy(a){return f.isWindow(a)?a:a.nodeType===9?a.defaultView||a.parentWindow:!1}function cv(a){if(!cj[a]){var b=f('<'+a+'>').appendTo('body'),d=b.css('display');b.remove();if(d==='none'||d===''){ck||(ck=c.createElement('iframe'),ck.frameBorder=ck.width=ck.height=0),c.body.appendChild(ck);if(!cl||!ck.createElement)cl=(ck.contentWindow||ck.contentDocument).document,cl.write('

它并不能拯救一切。我可以使用parsefloat((之类的吗？如果它能起作用，我该怎么做？

我喜欢本地存储的原因是我可以很容易地控制它。而且我不必担心用户清空他们的缓存。如果我需要更新localstorage，我可以用一行代码来完成。它几乎可以作为我的web应用程序的更新功能。如果我错过了什么，或者有没有更简单的方法可以做到这一点，请告诉我。示例代码即将推出

如果在将脚本文件保存到本地存储之前对其进行Base64编码，则效果良好。在下面的示例中，我省略了jQuery文件，但在演示中，对整个jQuery1.7进行了编码。

我使用以下网站将整个文件编码为一个字符串(大多数将其分成块(：http://textmechanic.co/ASCII-Hex-Unicode-Base64-Converter.html?type=text

演示：http://jsfiddle.net/ThinkingStiff/ZMAKn

HTML:

<div></div>

脚本：

var jquery = '<Base64 encoded file>';
var result = 'jQuery: ' + ( typeof $ != 'undefined' ) + '<br />';
window.localStorage.setItem( 'jquery', jquery );
jquery = '';
jquery = window.localStorage.getItem( 'jquery' );
eval( atob( jquery ) );
result += 'jQuery: ' + ( typeof $ != 'undefined' ) + '<br />';
$( 'div' ).html( result ); //this works, so jQuery loaded
window.localStorage.removeItem( 'jquery' );

输出：

jQuery: false
jQuery: true

这是一个很好的练习，适用于HTML5本地存储，但您的web服务器不应该只响应HTTP 304(未修改(吗？自1998年以来，几乎所有的web服务器都支持此功能。让服务器用简单的304响应要比编写大量javascript在本地存储中加载jQuery快得多。

如果由于某种原因，您无法让web服务器正常工作，请使用一个公共jQueryCDN，它们将为您执行此操作。

我同意Cyan Lite。你需要使用浏览器缓存，而不是浪费时间编码它

如果您不想像Cyan建议的那样使用CDN，您可以轻松地在服务器上启用缓存：https://developers.google.com/speed/docs/best-practices/caching#LeverageBrowserCaching

相关文章：