JS每日一题: 前端的缓存有哪些?都适用什么场景?区别是什么?

您所在的位置:网站首页 前端缓存问题有哪些 JS每日一题: 前端的缓存有哪些?都适用什么场景?区别是什么?

JS每日一题: 前端的缓存有哪些?都适用什么场景?区别是什么?

2024-07-14 17:12| 来源: 网络整理| 查看: 265

20190116问:

前端的缓存有哪些?都适用什么场景?区别是什么?

参考回答

前端缓存分为两部分:

http 缓存浏览器缓存 http 缓存 强缓存

强缓存主要是采用响应头中的Cache-Control和Expires两个字段进行控制的

Cache-Control 值理解:

max-age 指定设置缓存最大的有效时间(单位为s) public 指定响应会被缓存,并且在多用户间共享 private 响应只作为私有的缓存,不能在用户间共享 no-cache 指定不缓存响应,表明资源不进行缓存 no-store 绝对禁止缓存

Expires 理解:

缓存过期时间,用来指定资源到期的时间,是服务器端的具体的时间点, 需要和Last-modified结合使用

Last-modified 理解

服务器端文件的最后修改时间,需要和cache-control共同使用,是检查服务器端资源是否更新的一种方式

ETag 理解

根据实体内容生成一段hash字符串,标识资源的状态,由服务端产生。浏览器会将这串字符串传回服务器,验证资源是否已经修改

协商缓存(304)

协商缓存是指当强缓存机制如果检测到缓存失效,就需要进行服务器再验证

浏览器缓存 CookieLocalStorageSessionStorageService Worker Cookie

Cookie主要用于用户信息的存储, 容量为4KB

LocalStorage

LocalStorage的数据将一直保存在浏览器内,直到用户清除浏览器缓存数据为止, 容量为5MB

SessionStorage

SessionStorage的其他属性同LocalStorage, 不同是的当页面关闭时会随之清除

Service Worker

主要是为了提高web app的用户体验,可以实现离线应用消息推送等等一系列的功能, 可以看做是一个独立于浏览器的Javascript代理脚本, 在离线状态下也能提供基本的功能。 出于安全性的考虑,Service Worker 只能在https协议下使用

往期

JS每日一题: Call,Apply,Bind的使用与区别,如何实现一个bind?JS每日一题: 说说你对前端模块化的理解JS每日一题: web安全攻击手段有哪些?以及如何防范

关于JS每日一题

JS每日一题可以看成是一个语音答题社区 每天利用碎片时间采用60秒内的语音形式来完成当天的考题 群主在次日0点推送当天的参考答案

注 绝不仅限于完成当天任务,更多是查漏补缺,学习群内其它同学优秀的答题思路 扫描下方二维码即可加入答题



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3