前端发送请求主要经历一下三个过程: 请求、处理、响应。如果短时间内重复发送这个请求,每次都会执行这三个过程,影响用户体验和给服务器造成压力,这时候可以选择的解决方案有很多种。从服务端的角度,走cdn、优化接口等。本文重点从前端的角度来描述。浏览器缓存当浏览器请求一个网站的时候,会加载各种各样的资源,比如:HTML文档、图片、CSS和JS等文件。对于一些不经常变的内容,浏览器会将他们保存在本地的文件
转载 2021-01-29 21:46:41
425阅读
2评论
一、HTML5离线缓存技术支持离线缓存是HTML5中的一个重点,离线缓存就是让用户即使在断网的情况下依然可以正常的运行应用。传统的本地存储数据的方式有 localstorage,sessionstorage和cookie。但是这些传统的方式有着致命的弊端。首先这些传统的存储方式的最大使用空间有 限,最多不超过5M;其次它们处理大规模的结构化数据的能力有限。鉴于传统方式的局限性,HTML5提出了三种
转载 2023-07-12 19:55:51
117阅读
前言web缓存是高级前端工程师必修技能。是我们变成大牛过程中绕不开的知识点。文章会尽量用通俗易懂的言语来细说web缓存的概念和用处。本期文章的大纲是什么是web缓存前端缓存缓存可以解决什么问题?他的缺点是什么?强制缓存原理讲解3.1.基于Expires字段实现的强缓存3.2.基于Cache-control实现的强缓存协商缓存原理讲解4.1.基于last-modified实现的协商缓存4.2.基
        我们都知道对页面进行缓存能够有利于减少请求发送,从而达到对页面的优化。不过在我前端工作的生涯中一直以为前端就是写写页面,写写交互,就已经很了不起,这种没有志向的想法发导致我日后的工作一直处于瓶颈。做人嘛总要有梦想嘛,不然跟一条咸鱼有什么区别。最近我一直在关于前端优化的问题,原来对页面进行有效缓存对于响应速度会大大提高。我也是综合自己看到的几篇
转载 2024-04-29 10:01:04
159阅读
观点:  浏览器强缓存前端性能优化最有力的工具,没有之一,对于有静态资源的网页,一定要利用强缓存,提高响应速度。目标:  了解浏览器缓存原理,并能运用浏览器缓存优化项目。浏览器缓存的原理WEB服务软件对缓存的支持谈档案软件如何运用浏览器缓存开发时避免缓存的技巧什么是浏览器缓存简单来说,浏览器缓存就是把一个已经请求过的Web资源(如html页面,图片,js,数据等)拷贝一份副本储存在浏览器中。缓存
原创 2021-03-07 20:39:58
342阅读
文章目录1.分类2.强缓存2.1 Expires2.2 Cache-Control3.协商缓存4.扩展4.1 缓存失效问题1.分类前端缓存分为强缓存和协商缓存两种
原创 2022-05-26 01:32:16
234阅读
什么是web缓存web缓存主要指的是两部分:浏览器缓存和http缓存。浏览器缓存:比如,localStorage,sessionStorage,cookie等等。这些功能主要用于缓存一些必要的数据,比如用户信息。比如需要携带到后端的参数。亦或者是一些列表数据等等。注意,像localStorage,sessionStorage这种用户缓存数据的功能,他只能保存5M左右的数据,多了不行。cookie则
原创 2022-09-07 21:29:01
302阅读
前端缓存的优势1、可配置需要缓存的资源;2、网络无连接应用仍可用;3、本地读取缓存资源,提升访问速度,增强用户体验;4、减少请求,缓解服务器负担。前端缓存的实现在需要应用缓存在页面的根元素(html)里,添加属性manifest="demo.appcache"。路径为以 .appcache 为后缀的缓存清单文件<!DOCTYPE html>&l...
转载 2022-07-12 17:09:33
69阅读
一、缓存是什么?        缓存其实是内存中一个以key-value(键值对)的形式存储数据的一个空间。当然,缓存也可以持久化。常用的缓存技术:Memcached、Ehcache、OsCache、Redis等等。二、缓存的优点(作用)        1、缓存可以减小数据库压力,避免与数据库发生多次交互。 
  这周遇到了一个新需求,产品反馈地图瓦片服务的图片资源没有Http缓存,每次移动地图范围都会向后台发处请求/响应数据,影响了客户端的地图加载体验。所以需要增加这样一种缓存:1)针对同一个请求资源地址URL,首次加载需要缓存数据,后续加载直接读取缓存;2)后台数据发生更新时,需要实时更新缓存;  在完成这个需求之前,我借机补习了一下前端缓存体系:一  HTTP缓存  提起前端缓存,首先
转载 2024-02-17 13:26:24
17阅读
 1.http缓存机制,浏览器缓存到底是什么?所谓的http缓存,就是浏览器自己给你的一个功能,一个缓存数据库,夹在服务端和客户端中间,你只需要设置一些参数即可实现  缓存/不缓存/时效内缓存/时效外缓存等(默认存在缓存)浏览器缓存分为强缓存和协商缓存,浏览器加载一个页面的简单流程如下:(1)浏览器先根据这个资源的http头信息来判断是否命中强缓存。如果命中则直接加在缓存中的资
转载 2023-08-27 17:20:25
70阅读
前端缓存,主要分为两种,HTTP缓存和浏览器缓存。HTTP缓存,主要存在于服务器请求传输时需要记录的一些参数,在服务器代码上设置。浏览器缓存,主要是由前端JS代码主动存储的某些参数。缓存前端项目性能优化中简单高效的一种方式。优秀的缓存策略可以缩短网页请求资源的距离,减少延迟,并且由于缓存文件可以重复利用,还可以减少带宽,降低网络负荷。例如:前端需要发起一个数据请求,可以分为发起网络请求、后端处理
功能概述:前端项目中有同一接口重复触发的并发现象一些公共数据接口,如用户信息,配置信息等接口需要多次获取首页有大量重复请求影响启动时间适用条件:基本的公共数据和用户信息get类获取数据接口基本原则就是缓存不更新或者更新周期较长的数据大体思路:初次请求时将接口promise缓存到map对象中,map中的key名使用api名+参数拼接;下一次请求到同一key名的接口直接返回缓存中的promise;如果
web缓存主要指的是两部分:浏览器缓存和http缓存。浏览器缓存一般指localStorage,sessionStorage,cookie等,主要用于缓存一些必要数据在客户端,有大小的容量限制。http缓存主要是针对html,css,img等静态资源,常规情况下,我们不太会去缓存一些动态资源,因为缓存动态资源的话,数据的实时性就不能保证,所以我们一般都只会去缓存一些不太容易被改变的静态资源。htt
转载 2024-02-26 14:29:38
50阅读
缓存前端面试的一个常见知识点,下面对于实际项目中如何进行缓存的设置给出方案。强缓存和协商缓存浏览器缓存是浏览器将用户请求过的静态资源存储到电脑本地磁盘中,当再次访问时,就可以直接从本地缓存中加载而不需要去向服务器请求了。但是缓存也有缺点,如果服务端资源更新了,客户端没有强制刷新的情况下,看到的内容还是旧的。所以,前端需要根据项目中各个资源的实际情况,做出合理的缓存策略。这就出现了强缓存和协商缓存
一个培训的ppt,是介绍缓存知识的。有兴趣的可以参考:缓存技术浅谈
原创 2023-07-19 16:40:49
51阅读
免责申明,本文仅是个人总结摘记,不用做任何其他场景,部分文字摘自其他大神博文等,未
原创 2023-04-04 22:44:43
96阅读
缓存技术文档备份
原创 2023-07-13 18:19:05
52阅读
HTTP 缓存分为 2 种,一种是强缓存,另一种是协商缓存。主要作用是可以加快资源获取速度,提升用户体验,减少网络传输,缓解服务端的压力。这是缓存运作的一个整体流程图:强缓存不需要发送请求到服务端,直接读取浏览器本地缓存,在 Chrome 的 Network 中显示的 HTTP 状态码是 200 ,在 Chrome 中,
原创 2021-07-16 09:47:23
206阅读
当浏览器向CDN节点请求数据时,CDN节点会判断缓存数据是否过期,若缓存数据并没有过期,则直接将缓存数据返回给客户端
原创 2024-08-18 15:16:52
102阅读
  • 1
  • 2
  • 3
  • 4
  • 5