AJAX-Cache：一款好用的Ajax缓存插件

didikee 发布于2019-08-22 15:11 / 288人阅读

摘要：是一款缓存插件，可以为方法扩展缓存功能。缓存清理插件本身会自动清理过期缓存对于不想继续使用缓存的接口可以为方法传入清理当前接口的缓存并返回最新数据也可以调用清理所有插件产生的缓存。

原文链接

AJAX-Cache是什么

Ajax是前端开发必不可少的数据获取手段，在频繁的异步请求业务中，我们往往需要利用“缓存”提升界面响应速度，减少网络资源占用。AJAX-Cache是一款jQuery缓存插件，可以为$.ajax()方法扩展缓存功能。

AJAX-Cache提供什么 1. 定时缓存

大多数的缓存场景是，希望将某个接口数据在一定时间段内缓存起来，缓存期内不再发起请求直接返回本地数据，过了这段时间再重新获取并更新缓存。

这就是“定时缓存”的典型使用场景，我们可以为$.ajax()方法传入localCache: Number开启定时缓存，Number是缓存秒毫秒数。定时缓存实际上是牺牲了数据实时性换取响应速度，使用中通过设置不同的缓存时长，可以匹配不同的业务场景，比如对于相对稳定的数据可以设置较长的缓存时间，而设置较短的缓存时间则可以起到请求“防抖”作用。

2. 快照缓存

更多的时候我们希望接口能兼具实时性和响应速度，比如应用首屏的异步数据块，既要快又要新，虽然这种需求听起来很“不科学”，但我们确实可以通过“快照缓存”满足这个需求。

为$.ajax()方法传入localCache: "snapshot"可以开启快照缓存，此时每当接口成功请求后都会为数据建立一份“快照”，下次请求时接口会首先将最近的快照数据作为结果返回，供前端渲染界面，同时发送请求获取最新数据，新数据到达后会与快照做对比，如果与快照相同则缓存命中，如果与快照不同会更新快照，并将新数据返回，供前端更新界面。也就是说启用快照缓存的接口前端有可能得到两次返回结果，为了让前端能够区分出快照，对象格式的快照数据会自动增加一个snapshot=true的属性。

3. 缓存清理

插件本身会自动清理过期缓存；

对于不想继续使用缓存的接口可以为$.ajax()方法传入localCache: false清理当前接口的缓存并返回最新数据；

也可以调用$.ajaxCache.clear()清理所有AJAX-Cache插件产生的缓存。

4. 并发管理

除了上述基本功能，AJAX-Cache还考虑到了极端情况下的请求并发问题，当某个接口在本地没有缓存或者缓存过期时发生了并发，AJAX-Cache会拦截并发请求，暂存请求回调，只向服务端发送一次请求，待拿到数据后再依次执行暂存的请求回调，从而真正起到减少网络资源占用的作用。

5. 约定优于配置

最后，Ajax-Cache奉行“约定优于配置”的理念，将主要功能都集中到一个localCache配置上，使用简单，将对业务代码的侵入性降到最低，如果没有使用$.ajaxCache全局方法的话，从页面中直接将Ajax-Cache插件移除业务代码也不会报错。

使用简单不代表功能简单，如果需要修改Ajax-Cache的全局配置，也可以通过$.ajaxCache.set(config[Object])方法实现，目前有两个配置项：

扩展信息

官网：http://refined-x.com/AJAX-Cache/
Github：https://github.com/tower1229/AJAX-Cache

前端路上原创技术文章，转载请注明出处：http://refined-x.com/2018/03/07/AJAX-Cache/

对文章内容有任何疑问欢迎留言讨论，或者扫描下方二维码加入“前端路上-知识星球”付费提问。

混合云私有云 ajax请求数据缓存 jquery_ajax分页插件一款强大的php大马下一款

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/93242.html

超好用的谷歌浏览器、Sublime Text、Phpstorm、油猴插件合集

摘要：分享一些超好用插件，打造一个不一样的浏览器编辑器。一谷歌浏览器插件谷歌访问助手强烈推荐一键安装，无需其他配置，即可访问谷歌。谷歌浏览器是很耗内存的，该插件会自动挂起长时间未使用的网页，来释放系统资源。 showImg(https://segmentfault.com/img/remote/1460000014011338); 分享一些超好用插件，打造一个不一样的 GitHub、浏览器、...

Rango 2019-08-22 15:45 评论0 收藏0
JavaScript精编干货

摘要：老姚浅谈怎么学鉴于时不时，有同学私信问我老姚，下同怎么学前端的问题。撸码听歌，全局控制。浅析用 js 解析 xml 的方法由于项目上需要解析 xml，于是各种百度，然后自己总结了下各个主流浏览器解析 xml 的方法，只能是很浅显的知道他的用法，但是还没有深层次的研究。装 X - 建立自己的斗图网站库之前加过一个斗图群，看到很多经典的表情，然后就收藏到了 QQ，迫于本屌丝开不起...

Fourierr 2019-08-21 18:46 评论0 收藏0
推荐几款好用的Chrome插件

摘要：今天就来跟大家分享一下工作中用到的几款插件。是一款功能强大的网页调试与发送网页请求的插件。俗称油猴子，是一款功能非常强大的插件，他包含方便的脚本管理脚本概览设置多样性脚本自动更新安全兼容性同步编辑器语法检查快速开发卸载等功能。 ‘工欲善其事，必先利其器’。优秀的开发者不仅体现在其在技术方面的精通，还体现在其对各种开发工具的充分了解与使用，这会让其开发效率事半功倍。作为一个前端开发者，平...

fox_soyoung 2019-08-01 18:19 评论0 收藏0