ServiceWorker 拥有对缓存流程丰富灵活的控制能力，当页面请求到 ServiceWorker 时，ServiceWorker 同时请求缓存和网络，把缓存的内容直接给用户，而后覆盖缓存 注意：需要...协商缓存可以通过设置两种 HTTP Header 实现：Last-Modified 和 ETag 首先在精确度上，Etag要优于Last-Modified 第二在性能上，Etag要逊于Last-Modified...头部压缩，用HPACK技术压缩头部，减小报文大小 服务端推送，服务端可以在客户端发起请求前发送数据，换句话说，服务端可以对客户端的一个请求发送多个相应，并且资源可以正常缓存。...普通的script标签在开始解析和解析的过程中，会停止解析dom defer </...（两者执行顺序不确定，执行阶段不确定，可能在 DOMContentLoaded 事件前或者后 ） defer和async都不会停止解析dom 「webp」 「webp」 是一种新的图片格式，它的体积只有只有
背景 随着业务的发展，系统架构从单体架构变为面向服务架构，水平分层架构；再变为微服务架构， 服务网格，服务与服务间的交互越来越复杂，如何优雅的设计一个接口，需要考虑哪些方面？...特别是对公服务（比如BFF）需要对外提供公网域名的接口，安全性怎么保证，我整理了我工作以来一些常见的措施以及具体如何去实现： 数据有效性校验 合法性校验包括：常规性校验以及业务校验；常规性校验：包括必填字段校验...数据发生改变才需要做幂等，有些接口是天然保证幂等性的。 比如查询接口，有些对数据的修改是一个常量，并且无其他记录和操作，那也可以说是具有幂等性的。...https如何配置和使用，大家翻阅我历史文章自行去研究。...好啦，现在大家应该都上班了，我熬夜值班还在大促现场（文章周末写的，现在就写个总结），我是敖丙，你知道的越多，你不知道的越多，我们下期见。
在我所在的团队Node主要是用于提供接口数据和页面渲染。既然文章标题是和node接口耗时相关的，我先讲一下我们node是如何做接口数据提供的。...由于node是单线程模型，所以优化更多的是要减少io操作，减少同步阻塞，避免执行CPU密集型操作，以下是我所使用的一些优化方法。 1....使用压测工具对本地服务发送请求，我这里使用的工具是loadtest ?...以下是我的升级过程： 先将本地版本进行升级，对页面渲染和接口运行进行测试，确保可以稳定运行；使用nvm进行版本切换，本地启动node服务，使用压测工具分别对两个版本的node页面渲染和接口响应速度进行测试...pm2 save pm2 kill pm2 resurrect 以上便是目前我对于降低node接口耗时所使用的一些小小的办法，如果你还有一些更好的想法和思考，欢迎联系我，一起交流学习。
不卖关子，我个人对这两个的理解： 类是具体实例的抽象，比如一个json字符串的抽象；而抽象类就是类的抽象；接口就是抽象类的抽象，接口更像是一种协议 听我慢慢道来~ 吐槽 首先，我必须吐槽一下这种面试，我认为面试官凡事问出这种类似...我觉得这可以考验面试者对问题的理解程度，我想微软的面试题（你如何向你奶奶解释Excel）一样，考验一个人对某一事物的理解程度（虽然，至今我还不能很好的想明白这个问题 -。...这样就有各种汽车了，奔驰牌的，宝马牌的，丰田牌的… 接口就是对抽象类的抽象 这只是我个人的理解。 在我们日常生活中可以看到各种“接口”，电源插座就是一种。...后来我就想，这个东西其实无处不在，制造电源插座的厂和制造电器的厂只要约定一种“接口”——两口插座或三口插座，当然每个国家的接口都不一样，不同接口之间的转换就需要用适配器了。...其实程序中也一样，比如所有的交通工具可以抽象为一个接口Drivable（可能由于经验原因，我考虑的不是很完善），表示实现这个接口的类创建的对象（比如：汽车，飞机，轮船等等）都是可以驾驶的 public
该 http 请求需要返回两个头部(header)，一个是 Last-Modified，一个是 ETag，这两者都是字符串类型，只要有一个发生变化，该插件就会去抓取新的分词进而更新词库。...说明 Last-Modified是上次更新时间 ETag是实体标签（Entity Tag）的缩写，根据实体内容（文本数据）生成的一段hash字符串，可以通过它的标识数据的修改状态，当数据发生改变时，ETag...另外可以做一个工具来从业务系统提取相关词汇，再更新到这个文件中 如何设置ETag的值 首先ETag要满足以下三个条件： 1、当文件内容改变时，ETag值跟着改变 2、计算简单，不会特别消耗CPU（因此就不能使用...MD5、SHA128、SHA256等算法） 3、必须支持横向扩展，也就是在不同的服务器节点上生成的ETag是一样的 参考Nginx中ETag的生成： 由Last-Modified和content_length...3、如果我在一分钟内改了文件，发现改错了，又改回来了，那么这个时间虽然修改时间变了，但是因为内容没变，我是不希望更新它的。
虽然它确实可以停止一个正在运行的线程，但是这个方法是不安全的，而且是已被废弃的方法。...停止不了的线程 interrupt()方法的使用效果并不像for+break语句那样，马上就停止循环。调用interrupt方法是在当前线程中打了一个停止标志，并不是真的停止线程。...这个当前线程是main，它从未中断过，所以打印的结果是两个false. 如何使main线程产生中断效果呢？...： ... i=180136 i=180137 i=180138 i=180139 线程已经终止， for循环不再执行 这是for循环外面的语句，也会被执行 如何解决语句继续运行的问题呢？...能停止的线程---暴力停止 使用stop()方法停止线程则是非常暴力的。
前言 最近在项目开发中遇到一个需求：项目打包后，可以根据修改配置文件，进而动态替换页面上的文本。由于项目基本不涉及到后端，因此不考虑通过接口来修改。...这可以让缓存更高效，并节省带宽，因为如果内容没有改变，Web服务器不需要发送完整的响应。而如果内容发生了变化，使用ETag有助于防止资源的同时更新相互覆盖。...打包后可以修改配置文件里的值，并且确保浏览器不会对该文件进行缓存后，刷新浏览器便可以得到最新的替换文本。这里我采用了使用随机数的方式来让浏览器不缓存文件。...探索了如何不需要重新打包，只修改打包后暴露的配置文件，进而替换页面上的文字。 总结了一下浏览器的强缓存和协商缓存。 与强缓存相关的头部包括Cache-control和Expries。...与协商缓存相关的头部包括Last-Modify/If-Modify-Since和ETag/If-None-Match。
假设没有校验器（如 ETag/Last-modified 头部），并且缺少明确的新鲜度信息的话，那就要经常（但并不总是）被认定为无法缓存了。...这个指令是明确针对中间人缓存中的 CDN 的。当这个指令出现在头部中时，会覆盖掉 `max-age` 和 `expires` 的设置。...Validators ETag 这种在 HTTP/1.1 中定义的有效性 token: 通过服务器的 `ETag` HTTP头部传达 确保资源更新的有效性，也就是说，如果资源没改变，就不会发生数据传输...边缘服务器（edge server, 译注：如专门负责缓存、防火墙、负载均衡等的第一层服务器；其后是提供web服务的第二层和提供数据库的第三层）创建并返回特制的 token，存放在 ETag 头部域中，...web 开发者因此只需要确保服务器提供所需的 ETag token 就行了。 Last-Modified `Last-Modified` 头部作为一个常见的校验器，指示了文件最后一次改变的时间。
ETag为相应头部字段，表示资源内容的唯一标识，随服务器response返回；If-None-Match为请求头部字段，服务器通过比较请求头部的If-None-Match与当前资源的ETag是否一致来判断资源是否在两次请求之间有过修改...（彩蛋：有意思的，找了几个TX的网站，发现其实并不是所有的网站都采用了最后一种方式。我想应该技术都是用来追求完美的，但实现还是人实现的，毕竟人的天性是喜欢偷懒的。）那么问题来了？...如果你这么想，那么我只能说，我无话可说。发上两种都是属于覆盖式资源发布，不管如何处理，都会存在这样的问题。那么解决方案就是第三种。非覆盖式发布。...3 第三种方式，应该是最完美的解决方案：1 首先发资源文件，由于文件名已经不一样了，所以不会覆盖掉之前存在的资源文件，客户端依旧可以安全的访问。...2 再发客户端文件，在客户端文件一旦发布成功，那么就会立马切成新的特性，中间可以做到无缝衔接。这就是所谓的非覆盖发布的方案。
若last-Modified没有匹配上，返回412（预验证失败) ETag 服务器响应时将文本的md5值跟随此头发送到客户端 响应 If-None-Match 告诉服务器如果没有匹配上ETag相关资源就重发...，否则304 If-Match 如果服务器没有匹配上ETag相关资源，则响应412 其他缓存头部 Vary | 向服务器请求时以Vary指定的字段来区分内容是否缓存了 data/age...no-transform：传送没有被转换过的实体数据（如：压缩），不知如何验证 only-if-cached：客户端获取缓存（若有），不用向服务器请求， 无缓存则原始请求 cache-extension...覆盖max-age的设置 no-store: 所有内部不会被缓存或者放在浏览器临时文件夹下面，始终请求会被执行 no-store覆盖max-age的设置 public：允许任何地方缓存，代理、cdn都可以...），不知如何验证 only-if-cached：客户端获取缓存（若有），不用向服务器请求， 无缓存则原始请求 must-revalidate：当前资源一定是向原服务器发出验证请求的，若请求失败返回504
Disk Cache的覆盖面在浏览器中占用比重很大，通常结合HTTP头部字段进行判断，如果跨站点下载文件，已经下载过的文件不会再次请求，而是直接从Disk Cache 获取。...如何判断缓存进内存还是进磁盘？通常有两个依据：1. 如果是大文件，通常会进入磁盘当中进行缓存。2. 如果是频繁访问的文件，也会放入磁盘。...但是这里肯定又会问，你都no-cache了我怎么知道什么时候响应新内容呢？先别急，这里有一套稍微复杂的判断机制：协商缓存，学东西一点一点来，我们接着看其他几个强制缓存的问题。...官方这话是在暗示你要尽量给资源设置缓存过期时间，因为我建议的这东西不是特别靠谱。...结论有时候文件仅仅是改了日期（比如重新传了一份一模一样的覆盖），我们可以认为文件内容是没有改变的，依然可以用本地缓存而不是GET请求。
拿ETag举例，如果浏览器给的If-None-Match值与服务端给的ETag值相等，服务器就直接返回304，从而避免重复传输数据。...ETag示例： 如果几个配置同时存在，则优先级为：Cache-Control > Expires > ETag > Last-Modified。...常用工具： HTTP/2 HTTP/2较HTTP/1.1最大的改进在于： 多路复用：单一TCP连接，多HTTP请求； 头部压缩：减少HTTP头体积； 请求优先级：优先获取重要的数据； 服务端推送：主动推送...常用工具： Node.js，用于服务器端执行代码，输出HTML给浏览器，支持所有主流前端框架 Next.js，用于服务器端渲染React的框架 gatsby，用React生成静态网站的工具 除了可以提升页面用户体验...如果是前端资源加载慢，导致页面慢，则应该考虑如何缩短请求耗时。而如果是前端页面逻辑笨重，UI数据量太大，则可以试着从减少重排重绘的角度去优化。
2D 绘图上下文具体的作用：提供基本绘图单元的绘制接口以及设置绘图的样式。绘图接口包括画点，画线、画图片、画多边形、画文字等，绘图样式包括颜色、线宽、字号大小、渐变等。...(如何查看？ 浏览器F12->XHR->Headers) 响应response：包括状态行、响应头、响应体 ? ?...架构遵循统一接口原则，统一接口包含了一组受限的预定义的操作，不论什么样的资源，都是通过使用相同的接口进行资源的访问。...浏览器通过发送请求对象的ETag 或者自己所知道的最后修改时间给 WEB 服务器，让其判断对象是否改变了。总是跟 Range 头部一起使用。 ...在服务器向客户返回一个部分响应，它必须描述响应覆盖的范围和整个实体长度。
ETag全称EntityTags，HTTP协议规格说明中定义“ETag”为“被请求变量的实体值”。我们也可以把ETag理解为是一个客户端与服务器关联的记号。...如下，是我司站点的sitemap文件的头信息： ? 我们看到，ETag中包含了一连串的数据，这就是计算出来的一个值，如果它发生变化，说明其页面内容一定发生了变化。...站点服务器如何配置ETag？ 最好是对全站进行配置ETag，这样对于站点而言，在带宽消耗、爬虫抓取上的提升还是会有很大收益的。...以覆盖默认的Innode MTime Size的ETag，因为默认的ETag使用到的Innode会导致相同的文件在分布式服务器上产生的ETag不同。...打开Internet Information Services (IIS) Manager，如图双击HTTP响应头部(HTTPResponse Headers), ?
If-Match 比较实体标记（ETag）；如果对象的 ETag 没有改变，其实也就意味著对象没有改变，才执行请求的动作。...If-Range 资源未更新时发送实体 Byte 的范围请求；浏览器告诉 WEB 服务器，如果我请求的对象没有改变，就把我缺少的部分 给我，如果对象改变了，就把整个对象给我。...浏览器通过发送请求对象的 ETag 或者 自己所知道的最后修改时间给 WEB 服务器，让其判断对象是否 改变了。总是跟 Range 头部一起使用。...比如前一次请求某个 html 文件时，获得了其 ETag，当这次又请求这个文件时，浏览器就会把先前获得的 ETag 值发送给 WEB 服务器，然后 WEB 服务器会把这个 ETag 跟该文件的当前 ETag...例如：Vary：Accept-Encoding WWW-Authenticate 定义了使用何种验证方式去获取对资源的连接； X-XSS-Protection 当检测到跨站脚本攻击 (XSS)时，浏览器将停止加载页面
S：小客，我18岁了。=================================C：小服 ，你几岁了？我猜你18岁了。 S：靠，你知道还问我？...我猜你18岁了。 S：小客 ，我19岁了。（200） 为了让客户端与服务器之间能实现缓存文件是否更新的验证、提升缓存的复用率，Http1.1新增了几个首部字段来做这件事情。 1....那么客户端是如何把标记在资源上的 ETag 传回给服务器的呢？...2、F5/点击工具栏中的刷新按钮/右键菜单重新加载 F5的作用和直接在URI输入栏中输入然后回车是不一样的，F5会让浏览器无论如何都发一个HTTP Request给Server，即使先前的响应中有Expires...需要告诉他们，别用自己的Cache敷衍我，往Upstream的节点要一个最新的copy吧。
如何使用 next.js 创建一个网站应用什么是腾讯云的serverless腾讯云 Serverless 是腾讯云推出的一种无服务器计算服务。...这也是我选项Next.js框架的重要原因之一，另外一个我相信你已经猜到了，因为腾讯云serverless恰好支持这个框架的部署。...在App Router模式下如何开发一个接口开发一个接口的方式相当简单，只需要在app的目录下新建一个 api目录，然后在目录下新建一个 route.ts文件，在里面编写业务即可，其映射关系如下，我建议使用...有人可能会问，我如何给这个post方法传参数，以及我这个方法里面如何获取传递的参数，我的appid，secretKey等如何传入？我有多个业务请求，如何路由？对这个就是我下面要说的点。...有没有推荐的适合Next.js 的UI组件库我仔细对比了一下，发现 https://nextui.org/ 可能比较友好，因为 next.js 是支持服务端渲染的，而Nextui 这套框架恰好是为Next.js
S：小客，我18岁了。 ================================= C：小服 ，你几岁了？我猜你18岁了。 S：靠，你知道还问我？...我猜你18岁了。 S：小客 ，我19岁了。（200） 为了让客户端与服务器之间能实现缓存文件是否更新的验证、提升缓存的复用率，Http1.1新增了几个首部字段来做这件事情。 1....那么客户端是如何把标记在资源上的 ETag 传回给服务器的呢？...2、F5/点击工具栏中的刷新按钮/右键菜单重新加载 F5的作用和直接在URI输入栏中输入然后回车是不一样的，F5会让浏览器无论如何都发一个HTTP Request给Server，即使先前的响应中有Expires...需要告诉他们，别用自己的Cache敷衍我，往Upstream的节点要一个最新的copy吧。
S：小客，我18岁了。 ================================= C：小服 ，你几岁了？我猜你18岁了。 S：靠，你知道还问我？...我猜你18岁了。 S：小客 ，我19岁了。（200） 为了让客户端与服务器之间能实现缓存文件是否更新的验证、提升缓存的复用率，Http1.1新增了几个首部字段来做这件事情。 1....那么客户端是如何把标记在资源上的 ETag 传回给服务器的呢？...所以我们也能看到该资源的Size为from cache 2、F5/点击工具栏中的刷新按钮/右键菜单重新加载 F5的作用和直接在URI输入栏中输入然后回车是不一样的，F5会让浏览器无论如何都发一个HTTP...需要告诉他们，别用自己的Cache敷衍我，往Upstream的节点要一个最新的copy吧。
领取专属 10元无门槛券
手把手带您无忧上云
