；当对应的事件符合触发条件被触发时，该线程会把事件添加到待处理队列的队尾，等待JS引擎的处理；注意：由于JS的单线程关系，所以这些待处理队列中的事件都得排队等待JS引擎处理（当JS引擎空闲时才会去执行）...如果资源发生了修改，则返回修改后的资源。协商缓存也可以通过两种方式来设置，分别是 http 头信息中的Etag 和Last-Modified属性。...服务器在返回资源的时候，在头信息中添加了 Etag 属性，这个属性是资源生成的唯一标识符，当资源发生改变的时候，这个值也会发生改变。...在下一次资源请求时，浏览器会在请求头中添加一个 If-None-Match 属性，这个属性的值就是上次返回的资源的 Etag 的值。...当 Last-Modified 和 Etag 属性同时出现的时候，Etag 的优先级更高。
然而对于图片而言，却不应该对图片进行压缩，因为图片本身是已经被压缩过了，如果再进行gzip压缩，有可能得到的结果是和图片本身大小相差不大或更大，这样就浪费了服务器的CPU资源来做无用功了。...当浏览器看到响应中有一个Expires头时，它会和相应的组件一起保存到其缓存中，只要组件没有过期，浏览器就会使用缓存版本而不会进行任何的HTTP请求。...2013 01:35:39 GMT Host: www.google.com.hk Response: HTTP 1.1 304 Not Modified 为什么要使用Etag呢？ ...指令配置了当文档是基于一个文件时用以创建ETag(实体标签)应答头的文件的属性(ETag的值用于进行缓冲管理以节约网 络带宽)。...头 在大型多WEB集群时,使用ETag时有问题,所以有人建议使用WEB集群时不要使用ETag 其实很好解决,因为多服务器时,INode不一样, 所以不同的服务器生成的ETag不一样,所以用户有可能重复下载
还是post 请求什么文件index.js http/1.1 协议头：值 协议头：值 服务器给你发文件 expires过期 缓存过期时间，用来指定资源到期的时间，是服务器端的具体的时间点。...Expires是Web服务器响应消息头字段，在响应http请求时告诉浏览器在过期时间前浏览器可以直接从浏览器缓存取数据，而无需再次请求。...这种方式有一个明显的缺点，由于失效时间是一个绝对时间，所以当客户端本地时间被修改以后，服务器与客户端时间偏差变大以后，就会导致缓存混乱。于是发展出了Cache-Control。...服务器根据http头信息中的Last-Modify/If-Modify-Since或Etag/If-None-Match来判断是否命中协商缓存。...ETag可以保证每一个资源是唯一的，资源变化都会导致ETag变化*。ETag值的变更则说明资源状态已经被修改。服务器根据浏览器上发送的If-None-Match值来判断是否命中缓存。
这让HTTP的报文信息暴露给了外界，给攻击者带来了便利。 「队头阻塞」，当http开启长连接时，共用一个TCP连接，当某个请求时间过长时，其他的请求只能处于阻塞状态，这就是队头阻塞问题。...但是这种方式只能缓存派生资源 200 from disk cache 不访问服务器，直接读缓存，从磁盘中读取缓存，当kill进程时，数据还是存在。...； 浏览器第二次请求/tag时，会把上次请求的/tag时的响应头Etag，设置在请求头if-none-match上，node服务器收到请求后，判断请求头的if-none-match，发现这个if-none-match...ETag机制类似于乐观锁机制，如果请求报文的ETag与服务器的不一致，则表示该资源已经被修改过来，需要发最新的内容给浏览器。...HTTP 2.0 使用 HPACK 算法进行压缩。
HTTP请求格式 做过Socket编程的人都知道，当我们设计一个通信协议时，“消息头/消息体”的分割方式是很常用的，消息头告诉对方这个消息是干什么的，消息体告诉对方怎么干。...Host（发送请求时，该报头域是必需的） Host请求报头域主要用于指定被请求资源的Internet主机和端口号，它通常从HTTP URL中提取出来的。...例如: Referer:http://translate.google.cn/?...当用户再次请求该资源时，将在HTTP Request 中加入If-None-Match信息(ETag的值)。...Last-Modified/Etag 再次请求：当浏览器再次请求的时候，请求头附带Expires，Cache-Control，If-Modified-Since/Etag
Expires是Web服务器响应消息头字段，在响应http请求时告诉浏览器在过期时间前浏览器可以直接从浏览器缓存取数据，而无需再次请求。...比如当Cache-Control:max-age=300时，则代表在这个请求正确返回时间（浏览器也会记录下来）的5分钟内再次加载资源，就会命中强缓存。...ETag 和 If-None-Match Etag 是服务器响应请求时，返回当前资源文件的一个唯一标识(由服务器生成)，只要资源有变化，Etag就会重新生成。...ETag是否一致，就能很好地判断资源相对客户端而言是否被修改过了。...disk cache 资源本身大小数值：当http状态为200是实实在在从浏览器获取的资源，当http状态为304时该数字是与服务端通信报文的大小，并不是该资源本身的大小，该资源是从本地获取的 状态
如果资源从上一次下载之后再没有被修改过，时间戳不变，资源就将从浏览器缓存中直接读出，从而避免一次额外的HTTP往返消耗。详见服务器-添加Expires或Cache响应头。 5....它们本身已经压缩过，再使用 gzip 压缩不仅浪费 CPU 资源，而且还可能增加文件体积。 从HTTP/1.1开始，web客户端就有了支持压缩的Accept-Encoding HTTP请求头。...减少 Cookie 大小 Cookie被用于身份认证、个性化设置等诸多用途。Cookie通过HTTP头在服务器和浏览器间来回传送，减少Cookie大小可以降低其对响应速度的影响。...压缩JavaScript和CSS 压缩代码可以移除非功能性的字符（注释、空格、空行等），减少文件大小，提高载入速度。...移除重复脚本 重复的脚本不仅产生不必要的HTTP请求，而且重复解析执行浪费时间和计算资源。 5. 减少DOM操作 JavaScript 操作 DOM 很慢，尤其是 DOM 节点很多时。
console }) ) } 去除SourceMap 代码压缩后进行调bug定位将非常困难，于是引入sourcemap记录压缩前后的位置信息记录，当产生错误时直接定位到未压缩前的位置...ServiceWorker 拥有对缓存流程丰富灵活的控制能力，当页面请求到 ServiceWorker 时，ServiceWorker 同时请求缓存和网络，把缓存的内容直接给用户，而后覆盖缓存 注意：需要...协商缓存可以通过设置两种 HTTP Header 实现：Last-Modified 和 ETag 首先在精确度上，Etag要优于Last-Modified 第二在性能上，Etag要逊于Last-Modified...头部压缩，用HPACK技术压缩头部，减小报文大小 服务端推送，服务端可以在客户端发起请求前发送数据，换句话说，服务端可以对客户端的一个请求发送多个相应，并且资源可以正常缓存。...server { listen 443 ssl http2; } 资源预加载 提前加载资源，当用户需要时，可以直接从本地缓存中渲染。
第一条线路： 当浏览器再次访问某个 URL 时，会先获取资源的 header 信息，判断是否命中强缓存 （cache-control和expires） ，如命中，直接从缓存获取资源，包括响应的 header...需要使用缓存协商，先与服务器确认返回的响应是否被更改，如果之前的响应中存在 ETag ，那么请求的时候会与服务端验证，如果资源未被更改，则可以避免重新下载。...） ，则后续请求会带上对应的请求字段 （If-Modified-Since 或者 If-None-Match ） ，若响应头没有 Last-Modified 或者 Etag字段，则请求头也不会有对应的字段...类似，与 Last-Modified 不一样的是，当服务器返回 304NotModified 的响应时，由于 ETag 重新生成过， response header中还会把这个 ETag 返回，即使这个...这是原生APP 本来就支持的功能，这也是相比于 web app ，原生 app 更受青睐的主要原因。 再来看看 ?
如图： 总结： 客户端请求服务端时，服务端在响应头添加 {Last-Modified:最新的时间1，Etag:最新的字符串标识符1}，客户端保存服务端的Last-Modified的值和Etag的值，...下次请求服务器时，在请求头添加{If-Modified-Since:最新的时间1，Etag:最新的字符串标识符1}。...需要使用缓存协商，先与服务器确认返回的响应是否被更改，如果之前的响应中存在ETag，那么请求的时候会与服务端验证，如果资源未被更改，则可以避免重新下载。...或者If-None-Match），若响应头没有Last-Modified或者Etag字段，则请求头也不会有对应的字段。...HTTP响应头中不包含Last-Modified/Etag，也不包含Cache-Control/Expires的请求无法被缓存 ---- 苟有恒 , 何必三更眠五更起
即使客户端和服务器都能够支持相同的压缩算法，服务器也可能选择不压缩并返回，这种情况可能是由于这两种情况造成的: 要发送的数据已经被压缩了一次，第二次压缩并不会导致发送的数据更小 服务器过载，无法承受压缩带来的性能开销...比较两个资源是否时相同的版本有些复杂，根据上下文，有两种相等性检查 当期望的是字节对字节进行比较时，例如在恢复下载时，使用强 Etag进行验证 当用户代理需要比较两个资源是否具有相同的内容时，使用若 Etag...对于其他方法，特别是 PUT 方法，If-Match 可以防止丢失更新，服务器会比对 If-Match 的字段值和资源的 Etag 值，仅当两者一致时，才会执行请求。...对于GET 和 HEAD ，仅当服务器没有与给定资源匹配的 Etag 时，服务器将返回 200 OK作为响应。对于其他方法，仅当最终现有资源的 Etag 与列出的任何值都不匹配时，才会处理请求。...即使此方法有效，当文档资源发生改变时，它也会添加额外的 响应/请求 交换。这会降低性能，并且 HTTP 具有特定的标头来避免这种情况 If-Range。 ?
强制缓存的过期时间通过第一次访问服务器时返回的响应头获取。在 http 1.0 和 http 1.1 版本中通过不同的响应头字段实现。...http 1.0 在 http 1.0 版本中，第一次请求资源时服务器通过 Last-Modified 来设置响应头的缓存标识，并且把资源最后修改的时间作为值填入，然后将资源返回给浏览器。...http 1.1 在 http 1.1 版本中，服务器通过 Etag 来设置响应头缓存标识。Etag 的值由服务端生成。...在第一次请求时，服务器会将资源和 Etag 一并返回给浏览器，浏览器将两者缓存到本地缓存数据库。...在第二次请求时，浏览器会将 Etag 信息放到 If-None-Match 请求头去访问服务器，服务器收到请求后，会将服务器中的文件标识与浏览器发来的标识进行对比，如果不相同，服务器返回更新的资源和新的
即使客户端和服务器都能够支持相同的压缩算法，服务器也可能选择不压缩并返回，这种情况可能是由于这两种情况造成的: 要发送的数据已经被压缩了一次，第二次压缩并不会导致发送的数据更小 服务器过载，无法承受压缩带来的性能开销...比较两个资源是否时相同的版本有些复杂，根据上下文，有两种相等性检查 当期望的是字节对字节进行比较时，例如在恢复下载时，使用强 Etag进行验证 当用户代理需要比较两个资源是否具有相同的内容时，使用若 Etag...对于其他方法，特别是 PUT 方法，If-Match 可以防止丢失更新，服务器会比对 If-Match 的字段值和资源的 Etag 值，仅当两者一致时，才会执行请求。...对于GET 和 HEAD ，仅当服务器没有与给定资源匹配的 Etag 时，服务器将返回 200 OK作为响应。对于其他方法，仅当最终现有资源的 Etag 与列出的任何值都不匹配时，才会处理请求。...即使此方法有效，当文档资源发生改变时，它也会添加额外的 响应/请求 交换。这会降低性能，并且 HTTP 具有特定的标头来避免这种情况 If-Range。
属性 首屏内容可以优先加载，非首屏内容采用「滚动加载」 优化关键路径长度 「压缩」 CSS 和 JavaScript 资源 移除 HTML、CSS、JavaScript 文件中一些「注释内容」 优化关键字节... 使用Defer处理脚本 当使用Defer时，JavaScript 资源将在HTML渲染时被下载。然而，「执行不会在脚本被下载后立即发生。相反，它会等待HTML文件被完全渲染」。...头字段 所属分组 Expires 实体头 Cache-control 通用头 ETag 实体头 ❝ETag: 在「更新操作」中，有时候需要基于「上一次请求的响应数据」来发送下一次请求。...no-cache: 使用 ETag 响应头来告知客户端（浏览器、代理服务器）这个资源首先需要被检查是否在服务端修改过，在这之前不能被复用。...当一个组件需要重新渲染时，会进行「浅对比」。由于性能原因，这种方法被广泛使用。
本篇从HTTP请求和响应的头域入手，让你对浏览器缓存有个整体的概念。最终你会发现强缓存，协商缓存 和 启发式缓存是如此的简单。 ” 导读 浏览器对于请求资源，拥有一系列成熟的缓存策略。...即资源被缓存，但是缓存立刻过期，同时下次访问时强制验证资源有效性 ✔️ ✔️ ✔️ ✔️ max-age 缓存资源，但是在指定时间(单位为秒)后缓存过期 ✔️ ✔️ ✔️ ✔️ s-maxage 同上，...当一个no-cache请求发送给一个不遵循HTTP/1.1的服务器时，客户端应该包含pragma指令。为此，勾选☑️ 上disable cache时，浏览器自动带上了pragma字段。如下： ?...怎么让浏览器不缓存静态资源 实际上，工作中很多场景都需要避免浏览器缓存，除了浏览器隐私模式，请求时想要禁用缓存，还可以设置请求头: Cache-Control: no-cache, no-store,...- Stack Overflow App 缓存方案：Http 缓存 · baitouwei Cache-Control - HTTP | MDN 彻底弄懂 Http 缓存机制 - 基于缓存策略三要素分解法
当带着If-Modified-Since头访问服务器请求资源时，服务器会检查Last-Modified，如果Last-Modified的时间早于或等于If-Modified-Since则会返回一个不带主体的...ETag与If-None-Match是一对报文头，属于http 1.1。ETag是一个响应首部字段，它是根据实体内容生成的一段hash字符串，标识资源的状态，由服务端产生。...如果请求资源时在请求首部加上这个字段，值为之前服务器端返回的资源上的ETag，则当且仅当服务器上没有任何资源的ETag属性值与这个首部中列出的时候，服务器才会返回带有所请求资源实体的200响应，否则服务器会返回不带实体的...200 from prefetch cache 在preload或prefetch的资源加载时，两者也是均存储在http cache，当资源加载完成后，如果资源是可以被缓存的，那么其被存储在http cache...这样，每次获取更新时，剩余内容（例如不会频繁更新的库代码）可以从缓存中获取，确保下载的内容量最少。 确保服务器配置或移除ETag：因为Etag跟服务器配置有关，每台服务器的Etag都是不同的。
校验值（验证机制）：服务器返回资源的时候有时在控制头信息带上这个资源的实体标签Etag（Entity Tag），它可以用来作为浏览器再次请求过程的校验标识。...当一个用户发起一个静态资源请求的时候，浏览器会通过以下几步来获取资源： 本地缓存阶段：先在本地查找该资源，如果有发现该资源，而且该资源还没有过期，就使用这一个资源，完全不会发送http请求到服务器； 协商缓存阶段...ETag机制类似于乐观锁机制，如果请求报文的ETag与服务器的不一致，则表示该资源已经被修改过来，需要发最新的内容给浏览器。...Vary：缓存系统通常使用请求的主机和路径作为存储该资源的键。当判断一个请求是否是请求同样内容时，Vary头部可以被用来提醒缓存系统需要注意另一个附加头部。...、图片等资源增加HTTP缓存头，并强制入口Html不被缓存 减少对Cookie的依赖 减少对HTTPS加密协议的使用 多用Get方式请求动态Cgi 动态CGI也是可以被缓存 扩展阅读： HTTP1.1与前端性能
（响应标头） 之一匹配时才返回请求的资源。...对于其他方法，特别是 PUT 方法，If-Match 可以防止丢失更新，服务器会比对 If-Match 的字段值和资源的 ETag 值，仅当两者一致时，才会执行请求。...对于GET 和 HEAD ，仅当服务器没有与给定资源匹配的 ETag 时，服务器将返回 200 作为响应。对于其他方法，仅当最终现有资源的 ETag 与列出的任何值都不匹配时，才会处理请求。...当 GET 和 POST 发送的 If-None-Match与 ETag 匹配时，服务器会返回 304。...Expires HTTP Expires 实体标头包含 日期/时间，在该日期/时间之后，响应被认为过期；在响应时间之内被认为有效。特殊的值比如0表示过去的日期，表示资源已过期。
• If-Modified-Since：当资源过期时(使用Cache-Control标识的max-age)，发现资源具有Last-Modified声明，则再次向web服务器请求时带上头If-Modified-Since...web服务器收到请求后发现有头If-Modified-Since 则与被请求资源的最后修改时间进行比对。...• Etag：web服务器响应请求时，告诉浏览器当前资源在服务器的唯一标识(生成规则由服务器决定)。...• If-None-Match：当资源过期时(使用Cache-Control标识的max-age)，发现资源具有Etage声明，则再次向web服务器请求时带上头If-None-Match(Etag的值)...web服务器收到请求后发现有头If-None-Match则与被请求资源的相应校验串进行比对，决定返回200或304。 • 既生Last-Modified何生Etag？
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
