客户端Web资源缓存

news2024/11/21 0:35:22

为了提高Web服务器的性能,其中的一种可以提高Web服务器性能的方法就是采用缓存技术。

1.缓存

1.1.什么是缓存?

如果某个资源的计算耗时或耗资源,则执行一次并存储结果。当有人随后请求该资源时,返回存储的结果,而不是再次计算。

1.2.新鲜度和陈旧度

问题的关键在于“计算”不是数学计算。在数学中,计算的结果随时间而变化。在网络上,您昨天请求的资源可能与您今天请求的资源不同。因此就会有新鲜度和陈旧度两个关键概念。

A fresh response is one whose age has not yet exceeded its freshness lifetime. Conversely, a stale response is one where it has.
A response’s freshness lifetime is the length of time between its generation by the origin server and its expiration time. An explicit expiration time is the time at which the origin server intends that a stored response can no longer be used by a Cache without further validation, whereas a heuristic expiration time is assigned by a Cache when no explicit expiration time is available. A response’s age is the time that has passed since it was generated by, or successfully validated with, the origin server.
When a response is “fresh” in the cache, it can be used to satisfy subsequent requests without contacting the origin server, thereby improving efficiency.
— RFC 7234 - 4.2. Freshness

2.如何进行客户端Web资源缓存?

2.1.以前的方法

万维网刚开始时相对简单。客户端会发送请求,服务器会返回所请求的资源。当资源是页面时,它是静态页面还是服务器呈现的页面并不重要。因此,早期的客户端缓存相当简单。

2.2.现在的方法

2.2.1.Web资源缓存规范

Web 缓存的第一个规范于 2014 年在RFC 7234(又名HTTP/1.1 缓存)中定义。请注意,自 2022 年起,它已被RFC 9111取代。

2.2.2.具体的方法

2.2.2.1.Pragma HTTP 标头

已经弃用

2.2.2.2.Expire HTTP 响应标头

最直接的缓存管理是通过Expire响应标头。当服务器返回资源时,它会指定缓存在哪个时间戳之后过期。请求缓存资源时,浏览器有两个选项:

  • 当前时间在到期时间戳之前:资源被视为新鲜,浏览器从本地缓存中提供该资源
  • 或者是之后:资源被视为过时,并且浏览器需要从服务器获取资源,因为它未被缓存
2.2.2.2.1.优点

它完全是本地决策。它不需要向服务器发送请求

2.2.2.2.2.不足
  • 是否使用本地缓存资源的决定是基于启发式的。尽管值Expiry是未来的,但资源可能已在服务器端发生变化,因此浏览器会提供过期的资源。相反,浏览器可能会因为时间已到而发送请求,但资源尚未发生变化。

  • Expire这非常基本。资源要么是新鲜的,要么是陈旧的;要么从中返回,Cache要么再次发送请求,控制的维度有限。

2.2.2.3.Cache-Control

Cache-Control的目标:

  • 绝不缓存资源
  • 在提供资源之前,验证是否应从缓存中提供资源
  • 中间缓存(代理)可以缓存资源吗?
    Cache-Control的基本实现流程:

在这里插入图片描述
由于Cache-Control和Expire一样都是客户端本地的,具体来说就是如果需要,浏览器会从其缓存中提供资源,而无需向服务器发出任何请求。

2.2.2.4.Last-Modified 和 ETag

为了避免提供过期资源的风险,浏览器必须向服务器发送请求。输入Last-Modified响应标头。 If-Modified-Since与请求Last-Modified标头配合使用:

The If-Modified-Since request HTTP header makes the request conditional: the server sends back the requested resource, with a 200 status, only if it has been last modified after the given date. If the resource has not been modified since, the response is a 304 without any body; the Last-Modified response header of a previous request contains the date of last modification. Unlike If-Unmodified-Since, If-Modified-Since can only be used with a GET or HEAD.
在这里插入图片描述

注意:
具有和其他非幂等方法If-Unmodified-Since的相反功能:它返回HTTP 错误,以避免覆盖已更改的资源。POST412 Precondition Failed。

分布式系统中时间戳的问题在于无法保证系统中的所有时钟都具有相同的时间。时钟以不同的速度漂移,需要定期同步Last-Modified到同一时间。因此,如果生成标头的服务器和接收标头的服务器If-Modified-Since不同,则结果可能会因它们的漂移而出乎意料。请注意,这也适用于标Expire头。

Etags 是时间戳的替代方案,可避免上述问题。服务器计算所提供资源的哈希值,并将ETag包含该值的标头与资源一起发送。当新请求包含If-None-Match哈希值时,服务器会将其与当前哈希值进行比较。如果它们匹配,则返回304如上所述的哈希值。

与仅提供时间戳相比,计算哈希值的开销较小,但现在被认为是一种很好的做法。

2.2.2.5.缓存 API

客户端最新的缓存方式是通过Cache API。它提供了一个通用的缓存接口:你可以将其视为浏览器提供的本地键值。

缓存 API提供以下方法:

  • Cache.match(request, options)

返回Promise解析与对象中第一个匹配的请求相关的响应Cache。

  • Cache.matchAll(request, options)

返回Promise解析为对象中所有匹配响应的数组Cache。

  • Cache.add(request)

获取 URL,检索它并将生成的响应对象添加到给定的缓存中。这在功能上等同于调用fetch(),然后使用put()将结果添加到缓存中。

  • Cache.addAll(requests)

获取 URL 数组,检索它们,并将生成的响应对象添加到给定的缓存中。

  • Cache.put(request, response)

接受请求及其响应并将其添加到给定的缓存中。

  • Cache.delete(request, options)

查找Cache以请求为键的条目,如果找到匹配的条目并将其删除,则返回Promise解析为的条目。如果未找到任何条目,则解析为。trueCacheCachePromisefalse

  • Cache.keys(request, options)

返回Promise解析为键数组的Cache。

Cache API 与Service Workers配合使用。流程很简单:

首先在 URL 上注册一个 Service Worker,浏览器在 URL 获取调用之前调用该 worker,从 worker 中,你可以从缓存中返回资源,并避免向服务器发出任何请求,它允许我们在初始加载后将资源放入缓存中,以便客户端可以离线工作 ,而具体效果取决于用例。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1686728.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

以太坊(3)——智能合约

智能合约 首先明确一下几个说法(说法不严谨,为了介绍清晰才说的): 全节点矿工 节点账户 智能合约是基于Solidity语言编写的 学习Solidity语言可以到WFT学院官网(Hello from WTF Academy | WTF Academy)…

2024电工杯数学建模选题建议及各题思路来啦!

大家好呀,2024电工杯数学建模竞赛开始了,来说一下初步的选题建议吧: 首先定下主基调, 本次电工杯建议选B。A题目难度较高,只建议有相关专业知识和优化经验的队伍选择,小白队伍无脑选B即可。是比较经典的数…

新媒体时代,LCD电子价签赋予零售场景新活力

近年来,全球企业迅速掀起了数字化转型的浪潮,加速了新零售科技的发展与应用。在实体零售门店中,商品货架显示逐渐趋向智能化和多样化。然而,在信息传播日益碎片化和视频化的时代,零售门店如何更有效地吸引消费者的注意…

go slice 扩容

扩容 slice 会迁移到新的内存位置,新底层数组的长度也会增加,这样就可以放置新增的元素。同时,为了应对未来可能再次发生的 append 操作,新的底层数组的长度,也就是新 slice 的容量是留了一定的 buffer 的。否则&…

【附带效果视频】php接口给前端返回流式数据,php使用event-stream进行数据推送,循环一次输出一次

背景:不分接口需要返回流式数据,循环一次输出一次数据 php接口给前端返回流式数据,循环一次输出一次 返回结果效果视频完整返回结果数据格式控制台网络内查看到的数据格式完整代码 返回结果效果视频 php接口给前端返回流式数据,循…

2024年 电工杯 (A题)大学生数学建模挑战赛 | 园区微电网风光储协调优化配置 | 数学建模完整代码解析

DeepVisionary 每日深度学习前沿科技推送&顶会论文&数学建模与科技信息前沿资讯分享,与你一起了解前沿科技知识! 本次DeepVisionary带来的是电工杯的详细解读: 完整内容可以在文章末尾全文免费领取&阅读! 问题重述…

2024 电工杯高校数学建模竞赛(A题)| 储能配置 |建模秘籍文章代码思路大全

铛铛!小秘籍来咯! 小秘籍团队独辟蹊径,运用负载均衡,多目标规划等强大工具,构建了这一题的详细解答哦! 为大家量身打造创新解决方案。小秘籍团队,始终引领着建模问题求解的风潮。 抓紧小秘籍&am…

Linux备份服务及rsync企业备份架构(应用场景)

备份服务概述 备份服务:需要使用到脚本,打包备份,定时任务. 备份服务:rsyncd服务,不同主机之间数据传输. 特点: rsync是个服务也是命令使用方便,具有多种模式传输数据的时候是增量传输 增量与全量: 全量 :无论多少数据全部推…

【机器学习】必会降维算法之:t-分布邻域嵌入(t-SNE)

t-分布邻域嵌入(t-SNE) 1、引言2、随机梯度下降(SGD)2.1 简介2.1.1 定义2.1.2 应用场景 2.2 原理2.3 实现方式2.4 算法公式2.5 代码示例解析: 3、总结 1、引言 小屌丝:鱼哥, 啥是降维算法 小鱼…

AI三级淋巴结构·预测癌症预后和免疫疗法反应

小罗碎碎念 今天分享的这篇文章对于想从事三级淋巴结交叉研究等同学和老师来说,具有非常重要的参考价值,反正我写完这篇推文以后,觉得受益匪浅。 其中重点需要提醒大家关注的是——从2D组织切片计算的TLS面积已被验证为多种肿瘤类型的预后和…

pycharm打开服务器(linux)上的项目

先在本地打开项目 一、项目文件配置 tools-deployment-configuration 新增一个sftp连接 测试服务器是否可以连通 mappings中设置本地路径和服务器上的路径 二、环境配置 先参考文章 复现论文的conda环境(win和联网、离线linux)_conda复现环境-CSDN博…

bugku 网络安全事件应急响应

开启靶场: 开始实验: 使用Xshell登录服务器,账号及密码如上图。 1、提交攻击者的IP地址 WP: 找到服务器日志路径,通常是在/var/log/,使用cd /var/log/,ls查看此路径下的文件. 找到nginx文件夹。 进入ng…

SAP Credit Management-Reconcile Documented Credit Decisions

ECC 升级S4后,经过事后迁移后,出现如下报错 找到了这里的配置路径: DCD settings – to maintain/complete Create Profile for Case Search -> no entry UKM_CASE – DCD search -> no search fields BC set UKM_DCD_CUST not activated -> transactio

温故而知新-秒杀项目篇【面试复习】

温故而知新-秒杀项目篇【面试复习】 前言版权推荐温故而知新-论坛项目篇【面试】秒杀项目中注册模块怎么实现的?秒杀项目中登录模块怎么实现的?秒杀项目中显示登录用户信息怎么实现的?SessionStorage是什么?为什么不用session而用token什么是…

2024年电工杯高校数学建模竞赛(B题) 建模解析| 大学生平衡膳食食谱的优化设计 |小鹿学长带队指引全代码文章与思路

我是鹿鹿学长,就读于上海交通大学,截至目前已经帮200人完成了建模与思路的构建的处理了~ 本篇文章是鹿鹿学长经过深度思考,独辟蹊径,实现综合建模。独创复杂系统视角,帮助你解决电工杯的难关呀。 本题&…

南京中科微Ci2451+11dbm发射功率 国产8位RISC内核无线MCU芯片

Ci2451是一款在现有的2.4GHz射频芯片基础上,内部集成8位RISC内核(精简指令集)MCU的SOC芯片。 Ci2451引脚图↑ 无线MCU解决方案,集成丰富的MCU资源、更小尺寸,来满足设计中的各种内存、功率、尺寸要求,充分…

QCC30xx如何实单声道MONO输出

有客户提出需要将QCC30xx的输出改为单声道输出(我们的QCC30xx是双声道输出,如果采用单声道输出,我们需要进行混音操作)。 客户采用目前最新的 SDK上将INCLUDE_STEREO屏蔽掉,直接进行编译,会报一系列的问题,编译不过。 也有很多客户尝试在各个模式下强制将通道输出设置…

cert-s

绕不过,啊对对对。 安全公司的东西都是无敌的。 菜你就多练。

C中十进制转十六进制示例

uint8_t QR_code_RxBfr[255]{0}; uint8_t TouchCode[100];memcpy (&Sys.TouchCode[0], &QR_code_RxBfr[0], Sys.QR_code_Len);Str &Sys.TouchCode[TmpVble];Sys.Card_ID 0; while(0 ! isdigit(*Str)){Sys.Card_ID Sys.Card_ID*10 *Str - 0;Str;} 最后在通过以下…

Springboot阶段项目---《书城项目》

一 项目介绍 本项目采用集成开发平台IntelliJ IDEA开发了在线作业成绩统计系统的设计与实现,实现了图书商城系统的综合功能和图形界面的显示,可以根据每个用户登录系统后,动态展示书城首页图书,实现了分类还有分页查询&#xff0c…