随着网站和应用变得越来越复杂，对内容交付网络 (CDN) 的需求也在不断增长。CDN 可以通过将内容缓存到分布在全球各地的服务器上来提高网站和应用的性能。CDN 服务的成本可能会很高，因此优化成本至关重要。
优化 CDN 成本的策略
以下策略可以帮助您优化 CDN 成本：
1. 选择合适的 CDN 提供商
在选择 CDN 提供商时，考虑以下因素：定价模式：CDN 提供商使用不同的定价模式，例如基于流量、基于带宽或基于请求。选择最适合您需求的模型。覆盖范围：确保 CDN 提供商拥有您目标受众所在的全球覆盖范围。功能：比较不同提供商提供的功能，例如缓存策略、安全功能和分析工具。
2. 优化网站内容
通过优化网站内容，可以减少对 CDN 服务的需求，从而节省成本：使用 CDN 友好的文件格式：JPEG、PNG 和 MP4 等格式通常比 GIF 和 BMP 等格式更适合 CDN。压缩文件：使用 Gzip 或 Brotli 等压缩技术减小文件大小。减少 HTTP 请求：合并 CSS 和 JavaScript 文件，并尽可能使用内联 CSS 和 JavaScript。
3. 配置 CDN 缓存策略
CDN 缓存策略控制着内容在 CDN 服务器上缓存的时间。优化缓存策略可以节省成本：设置适当的缓存到期时间：对于经常更新的内容，设置较短的到期时间。对于静态内容，设置较长的到期时间。使用缓存控制指令：使用 HTTP 缓存控制指令 (如 Cache-Control 和 Expires) 控制缓存行为。使用缓存协商：使用 If-Modified-Since 和 ETag 协商来避免不必要的缓存获取。
4. 监控和分析 CDN 使用情况
监控和分析 CDN使用情况可以帮助您识别成本节约机会：跟踪流量模式：分析流量模式以确定 CDN 使用高峰期和淡季。识别热门内容：确定最受欢迎的内容，并针对这些内容优化您的 CDN 配置。查找未缓存的内容：查找未被 CDN 缓存的内容，并优化您的网站内容或缓存策略以解决此问题。
5. 协商折扣和优惠
与 CDN 提供商协商折扣和优惠可以帮助您节省成本：批量折扣：如果您拥有大量流量，可以协商批量折扣。长期合同：签订长期合同可以获得较低的费率。合作关系：与 CDN 提供商建立合作伙伴关系可以获得额外的优惠和支持。
CDN 成本优化工具
以下工具可以帮助您优化 CDN 成本：CDN Benchmarks：比较不同 CDN 提供商的定价和性能。Google PageSpeed Insights：分析您的网站并提供优化建议，以减少 CDN 使用量。WebPagetest：分析您的网站性能，并识别优化 CDN 配置的机会。
结论
通过实施这些策略，您可以优化您的 CDN 成本，同时保持网站或应用的性能。通过选择合适的提供商、优化内容、配置缓存策略、监控使用情况并协商折扣，您可以精打细算，节省开支。
HTTP版本特性HTTP (The HyperText Transfer Protocol，超文本传输协议) 是用于在 Web 上传输超媒体文件的底层协议，最典型场景是在浏览器和服务器之间传递数据。
现行的HTTP标准的版本是HTTP/2。
1. HTTP0.9http0.9是最古老的一个版本，1991年万维网协会和互联网工程任务组制定，组成极其简单。
一次HTTP 0.9的传输首先要建立一个由客户端到Web服务器的TCP连接，由客户端发起一个请求，然后由Web服务器返回页面内容，然后连接会关闭。
如果请求的页面不存在，也不会返回任何错误码。
2. HTTP1.年5月发布了1.0版本，其缺点在于没有管道化的请求响应。
3. HTTP1.1HTTP 1.1 是1997年1月发布，在 1.0 发布之后的半年就推出了，完善了 1.0 版本。
目前也还有很多的互联网项目基于 HTTP 1.1 在向外提供服务。
基于长连接的基础，没有管道化的请求响应。
管道化的请求响应可以一次发送多个请求，但是响应仍是按照顺序返回的，还是无法解决队头阻塞的问题。
4. HTTP2http2大幅度的提升了web性能，完全兼容http1.1完全语意兼容。
为了保证HTTP不受影响，增加了二进制分帧层，在二进制分帧层上，HTTP2会将所有传输的信息分为更小的信息和帧，并采用二进制格式编码，其中HTTP1.x的首部信息会被封装到Header帧，而Request Body则封装到Data帧中。
HTTP2对HTTP1.x中很多字段进行了优化，比如Cookie和User Agent，引入了头部压缩机制，对头信息使用gzip或者compress压缩后发送，并且客户端和服务器端同时维护一张头信息表，所有的字段都存入这个表，生成一个索引号。
缓存介绍1. 什么是缓存在实际的开发过程中，缓存技术会涉及到不同层、不同端。
每一层的缓存目标都是一致的，就是尽快返回数据请求，减少延迟，但是每层使用的技术实现是不相同的。
当浏览器请求一个网站的时候，会加载各种各样的资源，比如HTML文档、图片、css、js等文件，对于一些不经常变的内容，浏览器会将他们保存在本地文件中，下次访问相同的网站时候直接加载这些资源，加速访问。
这些被浏览器保存的文件就被称为缓存。
2. 缓存的位置a. Service WorkerService Worker 本质上充当 Web 应用程序、浏览器与网络（可用时）之间的代理服务器。
这个 API 旨在创建有效的离线体验，它会拦截网络请求并根据网络是否可用采取来适当的动作、更新来自服务器的的资源。
它还提供入口以推送通知和访问后台同步 API。
b. Memory Cache内存中的缓存，主要包含当前页面中已经抓取到的资源。
比如页面上已经下载的样式、脚本、图片等。
读取内存中的数据肯定比磁盘的快，虽然读取高效，但是缓存的持续时间短，会随着进程的释放而释放。
一旦我们关闭Tab页，内存中的缓存也就会被释放。
❓ 什么时候资源会被放入Memory cache中呢？几乎所有的网络请求资源都会根据相关的策略被浏览器自动放入memory cache中，不受控制相当于一个黑盒。
但是也正因为数量很大但是浏览器占用的内存不能无限扩大这样两个因素，memory cache 注定只能是个“短期存储”。
当数据量过大，即使网页不关闭，缓存依然会失效。
❓ 既然内存缓存如此高效，为什么不将所有的数据都放在内存缓存中呢？因为相对于磁盘容量，内存要小很多，系统使用内存都要精打细算，所以我们使用的不多。
c. Disk Cache存储在硬盘中的缓存，读取速度慢，但是什么都能存储到磁盘当中，与内存相比胜在容量和存储的时效性上。
MemoryCache要比DiskCache快的多。
Disk Cache覆盖面是最大的，它会根据HTTP Hearder中的字段判断哪些资源需要缓存，哪些资源可以不请求直接使用，哪些资源过期了需要重新请求。
并且即使在跨域的情况下，相同地址的资源一旦被硬盘缓存下来，就不会再次去请求数据了。
d. Push CachePush Cache(推送缓存)是HTTP/2中的内容，当以上三种缓存都没有命中时，才会使用。
Push Cache只在会话中存在，一旦会话结束就会释放，并且缓存的时间也很短暂。
在chrome里只有5分钟左右。
3. 缓存的过程浏览器和服务器之间的通信方式：浏览器发起HTTP请求-服务器响应该请求根据上图可知：4. 强缓存和协商缓存浏览器会先去查看强缓存 (Expires 和 cache-control) 判断是否过期，如果强缓存生效，返回 200 并从缓存中读取资源；若不生效则进行协商缓存 (Last-Modified / If-Modified-Since 和 Etag / If-None-Match)，协商缓存由服务器决定是否使用缓存，若协商缓存失效，那么代表该请求的缓存失效，返回 200，并重新返回资源和缓存标识，再次存入浏览器缓存中；生效则返回 304，并从缓存中读取资源 (协商缓存之前要经过 DNS 域名解析，之后建立 TCP 链接)4.1 强缓存强缓存有两个相关字段：Expires、Cache-ControlHTTP1.0版本：使用的是ExpiresHTTP1.1版本：使用的是Cache-Control1. Expires:缓存过期时间，用来指定资源到期时间，是服务器端的具体时间点。
也就是说Expires=max-age+请求时间。
Cache-Control的优先级高于Expires。
Expires是文本服务器端响应消息字段，在响应http请求时告诉浏览器在过期时间前浏览器可以从浏览器缓存中读取数据，而无需再次请求。
但是这样就会有新的问题，服务器时间和浏览器时间可能会不一致，所以HTTP1.1提出新的字段替代它。
2. Cache-Control主要包括max-age:单位为s，指定设置缓存最大的有效时间，定义的是时间的长短。
当浏览器向服务器发送请求后，在max-age这段时间里浏览器就不会再向服务器发送请求了。
s-maxage: 单位为s，同max-age，只用于共享缓存(比如CDN缓存)。
public:指定响应会被缓存，并且在多用户之间共享。
private:响应只作为私有的缓存，不能在用户之间共享。
no-cache:不缓存过期资源，缓存会向服务器进行有效确认之后处理资源。
设置no-cache之后并不代表浏览器不缓存，而是在缓存之前要向服务器确认资源是否被更改。
因此有的时候只设置no-cache防止缓存是不够保险的，还可以加上private，将过期时间设置为过去时间。
no-store:绝对禁止缓存。
每次请求资源都要从服务器重新获取。
must-revalidate:如果页面过期，则去服务器进行获取。
4.2 协商缓存协商缓存就是强制缓存失效后，浏览器携带缓存标识向服务器发起请求，由服务器根据缓存标识决定是否使用缓存的过程。
协商缓存的标识也是在响应报文的HTTP头中和请求结果一起返回给浏览器的，控制协商缓存的字段分别有：HTTP1.0版本：Last-Modified / If-Modified-SinceHTTP1.1版本：Etag / If-None-Match，其中Etag / If-None-Match的优先级比Last-Modified / If-Modified-Since高。
1. Last-Modified / If-Modified-SinceLast-Modified是服务器响应请求时，返回该资源文件在服务器最后被修改的时间。
If-Modified-Since则是客户端再次发起该请求时，携带上次请求返回的Last-Modified值，通过此字段值告诉服务器该资源上次请求返回的最后被修改时间。
服务器收到该请求，发现请求头含有If-Modified-Since字段，则会根据If-Modified-Since的字段值与该资源在服务器的最后被修改时间做对比，若服务器的资源最后被修改时间大于If-Modified-Since的字段值，则重新返回资源，状态码为200；否则则返回304，代表资源无更新，可继续使用缓存文件。
如果只是查看了文件Last-Modified也会被修改，而且一秒之内多次修改是没有办法获取到最后修改的文件。
为了解决这个问题，HTTP1.1增加了新的字段Etag / If-None-Match。
2. Etag / If-None-MatchEtag是服务器响应请求时，返回当前资源文件的一个唯一标识(由服务器生成)。
If-None-Match是客户端再次发起该请求时，携带上次请求返回的唯一标识Etag值，通过此字段值告诉服务器该资源上次请求返回的唯一标识值。
服务器收到该请求后，发现该请求头中含有If-None-Match，则会根据If-None-Match的字段值与该资源在服务器的Etag值做对比，一致则返回304，代表资源无更新，继续使用缓存文件；不一致则重新返回资源文件，状态码为200。
Etag / If-None-Match优先级高于Last-Modified / If-Modified-Since，同时存在则只有Etag / If-None-Match生效。
5. 缓存都是好的吗？正常重新加载：直接刷新当前页面，会正常走浏览器检查缓存的流程。
硬性重新加载：浏览器发送请求的时候，会带上禁止缓存的请求头，并且不会使用缓存的资源而是重新请求数据。
清空缓存并硬性重新加载：浏览器除了会执行硬性重新加载还会清除缓存内容。
避免一些js文件读取缓存。
Disable cache：打开Disable cache浏览器不会删除本地的缓存，也不会做强缓存。
Webpack打包生成的文件：文件名+contenthash。
如果源码不变，打包生成文件的contenthash是不会变化的。
缓存控制：还有更多⌛️微信的缓存加meta标签不生效。
打包时加上contenthash。
总结：浏览器在第二次以后访问就能够使用缓存资源，不必每次都向服务器请求，加快了访问速度。
本着能用就用，不能用就商量着用的原则来使用缓存资源。
