客户端Web资源缓存

为了提高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 中,你可以从缓存中返回资源,并避免向服务器发出任何请求,它允许我们在初始加载后将资源放入缓存中,以便客户端可以离线工作 ,而具体效果取决于用例。

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

免费视频格式在线转换网站,推荐这5款!

在数字化时代,视频已成为我们日常生活和工作中不可或缺的一部分。然而,随着各种设备和平台的不断涌现,视频格式繁多,常常会出现不兼容的情况。为了解决这一问题,视频格式在线转换网站应运而生,成为了我们应…

【数据结构】排序(归并排序,计数排序)

一、归并排序 基本思想: 归并排序(MERGE-SORT)是建立在归并操作上的一种有效的排序算法,该算法是采用分治法(Divide and Conquer)的一个非常典型的应用。将已有序的子序列合并,得到完全有序的序列&#xf…

百度百舸 AIAK-LLM 的大模型训练和推理加速实践

本文整理自 4 月 16 日的 2024 百度 Create 大会的公开课分享《百舸 AIAK-LLM:大模型训练和推理加速实践》。 今天要分享的主题是 AI Infra 相关的内容,主要内容分为四部分。 首先和大家一起讨论大模型给基础设施带来的挑战。第二部分则是向大家介绍一个…

力扣HOT100 - 32. 最长有效括号

解题思路&#xff1a; 栈 class Solution {public int longestValidParentheses(String s) {int max 0;// 也可以使用 Stack<Integer> stacknew Stack<>();但Stack是遗留类&#xff0c;不推荐Deque<Integer> stack new LinkedList<>();stack.push(…

犀牛Rhinoceros 8创建、编辑、分析、记录、渲染、制作动画和转换

Rhino - 多功能 3D 建模器。 Rhinoceros 可以创建、编辑、分析、记录、渲染、制作动画和转换 NURBS* 曲线、曲面、实体、点云和多边形网格。除了硬件之外&#xff0c;复杂性、程度或大小没有任何限制。 特殊功能包括&#xff1a; -不受约束的自由形式 3D 建模工具&#xff0c;…

【汇编】算术指令

一、加法指令 &#xff08;一&#xff09;各加法指令的格式及操作 加法指令可做字或字节运算 &#xff08;1&#xff09;加法指令 ADD 格式&#xff1a;ADD DST,SRC执行的操作&#xff1a;(DST) ← (SRC)(DST) &#xff08;2&#xff09;带进位加法指令 ADC 格式&#xf…

ENZO--Leptin (human) ELISA kit

瘦素(Leptin)是由ob基因编码、在脂肪组织中生成的一种脂肪代谢调控产物&#xff0c;在代谢和调控体重等方面发挥重要作用。它通过下丘脑中的瘦素受体发出信号&#xff0c;降低食欲&#xff0c;增加能量消耗。在外周组织中&#xff0c;瘦素能拮抗胰岛素信号传导&#xff0c;增加…

目标检测标注工具Labelimg安装与使用

目录 一、安装Labelimg与打开 二、使用 1、基本功能介绍 2、快捷键 3、状态栏的工具 4、数据准备 5、标注 三、附录 1、YOLO模式创建标签的样式 2、create ML模式创建标签的样式 3、PascalVOC模式创建标签的样式 一、安装Labelimg与打开 源码网址&#xff1a;Label…

前端通知组件封装

背景 实现如上图效果&#xff1a;点击小铃铛&#xff0c;从右侧展示通知&#xff0c;点击其中一条跳&#xff0c;转到一个新页面&#xff1b;小铃铛数目减少&#xff1b; 实现 index.vue <template><el-drawerv-if"visible":visible.sync"visible&…

C#知识|上位机子窗体嵌入主窗体方法(实例)

哈喽,你好啊,我是雷工! 上位机开发中,经常会需要将子窗体嵌入到主窗体, 本节练习C#中在主窗体的某个容器中打开子窗体的方法。 01 需求说明 本节练习将【账号管理】子窗体在主窗体的panelMain容器中打开。 账号管理子窗体如下: 主窗体的panelMain容器位置如图: 02 实现…

【找到所有数组中消失的数字】leetcode,python

很菜的写法&#xff1a; class Solution:def findDisappearedNumbers(self, nums: List[int]) -> List[int]:nlen(nums)#存1-Nnum_1[i for i in range(1,n1)]#预存数num_2[]nums.sort()for i in nums:num_1[i-1]0for i in num_1:if i!0:num_2.append(i)return num_2能过但是…

计算机毕业设计hadoop+hive+hbase学情分析 在线教育大数据 课程推荐系统 机器学习 深度学习 人工智能 大数据毕业设计 知识图谱

毕 业 设 计&#xff08;论 文&#xff09;开 题 报 告 1&#xff0e;结合毕业设计&#xff08;论文&#xff09;课题情况&#xff0c;根据所查阅的文献资料&#xff0c;每人撰写不少于1000字的文献综述&#xff1a; 一、研究背景和意义 “互联网”和大数据带来了网络教育的蓬…

Java入门——异常

异常的背景 初识异常 我们曾经的代码中已经接触了一些 "异常" 了. 例如: //除以 0 System.out.println(10 / 0); // 执行结果 Exception in thread "main" java.lang.ArithmeticException: / by zero //数组下标越界 int[] arr {1, 2, 3}; System.out.…

C语言之指针初阶

目录 前言 一、内存与地址的关系 二、指针变量 三、野指针 四、const 五、传值调用与传址调用 总结 前言 本文主要介绍C语言指针的一些基础知识&#xff0c;为后面深入理解指针打下基础&#xff0c;因此本文内容主要包括内存与地址的关系&#xff0c;指针的基本语法&…

LiveGBS流媒体平台GB/T28181用户手册-服务器概览:通道信息、负载信息、CPU使用、存储使用、带宽使用(Mbps)、内存使用

LiveGBS用户手册-服务器概览&#xff1a;通道信息、负载信息、CPU使用、存储使用、带宽使用&#xff08;Mbps&#xff09;、内存使用 1、服务器概览1.1、通道信息1.2、负载信息1.2.1、信息说明1.2.2、会话列表 1.3、CPU使用1.4、存储使用1.5、带宽使用&#xff08;Mbps&#xf…

视频下载器 - 网页视频自动嗅探2.2.4

【应用名称】&#xff1a;视频下载器 - 网页视频自动嗅探 【适用平台】&#xff1a;#Android 【软件标签】&#xff1a;#Video #Downloader 【应用版本】&#xff1a;2.2.4 【应用大小】&#xff1a;33MB 【软件说明】&#xff1a;软件升级更新。支持多种格式的看片神器&am…

java入门详细教程之集合的理解与应用

一、Collenction集合 数组和集合的区别 长度 数组的长度是不可变的,集合的长度是可变的 数据类型 数组可以存基本数据类型和引用数据类型 集合只能存引用数据类型,如果要存基本数据类型,需要存对应的包装类 Collection 集合概述和使用 Collection集合概述​&#xff1a; 是单…

MacOS下载安装JDK8

一、前言 今天给苹果电脑安装JDK环境&#xff0c;后续打算把Mac系统也用起来&#xff0c;也体验一把用苹果系统开发。 JDK就不过多介绍了&#xff0c;大家都是JAVA开发&#xff0c;JDK就是JAVA开发的必要环境。目前已经更新到JDK20了&#xff0c;不过我是不会更新的&#xff0…

微服务中的鉴权怎么做?

大家好&#xff0c;我是苍何呀。 现在出去找工作&#xff0c;简历上不写上微服务的技术&#xff0c;仿佛自己跟不上时代了&#xff0c;面试官更是喜欢盯着微服务项目来提问。 但其实虽说微服务是主流&#xff0c;随着云原生架构的发展&#xff0c;微服务也是趋势&#xff0c;…

DOS学习-目录与文件应用操作经典案例-dir

欢迎关注我&#x1f446;&#xff0c;收藏下次不迷路┗|&#xff40;O′|┛ 嗷~~ 目录 一.前言 二.使用 三.练习 一.前言 dir是"directory"&#xff08;目录&#xff09;的缩写&#xff0c;它主要用于展示某个磁盘上的全部或特定文件目录。在DOS操作系统中&#…