浏览器原理
文章平均质量分 96
爱吃炫迈
这个作者很懒,什么都没留下…
展开
-
浏览器缓存机制
如果不命中则根据头信息向服务器发起请求,使用协商缓存,如果协商缓存命中的话,则服务器不返回资源,浏览器直接使用本地资源的副本,如果协商缓存不命中,则服务器返回最新的资源给浏览器。浏览器第一次向服务器发起该请求后拿到结果,会根据响应报文中HTTP头的缓存标识,决定是否缓存结果,如果是就将请求结果和缓存标识存入浏览器缓存中。所谓浏览器缓存值得是浏览器将用户请求过的静态资源,存储到电脑本地磁盘中,当浏览器再次访问时,就可以直接从本地加载,不需要在向服务端请求了,这样就大大减少了请求的次数,提高了网站的性能。原创 2023-10-05 16:53:54 · 155 阅读 · 0 评论 -
深入理解浏览器渲染原理
reflow的本质就是重新计算layout树。当进行了会影响布局树的操作后,需要重新计算布局树,会引发布局。为了避免连续的多次操作导致布局树反复计算,浏览器会合并这些操作,当JS代码全部完成后再进行统一计算。所以,改动属性造成的reflow是异步完成的。也同样因为如此,当JS获取布局属性时,就可能造成无法获取到最新的布局信息。浏览器在反复权衡下,最终决定获取属性立即reflow。原创 2023-10-04 20:51:42 · 348 阅读 · 0 评论 -
初步理解浏览器渲染原理
显然这样子的效率更高,毕竟这个是在非主线程上合成的,没有占用主线程资源,另外也避开了布局和绘制两个子阶段,所以相对于重排和重绘,合成能大大提升绘制效率。浏览器会将所有的回流、重绘的操作放在一个队列中,当队列中的操作到了一定的数量或者到了一定的时间间隔,浏览器就会对队列进行批处理。外部样式如果长时间没有加载完毕,浏览器为了用户体验,会使用浏览器会默认样式,确保首次渲染的速度。还有一种情况:就是更改了一个既不要布局也不要绘制的属性,那么渲染引擎会跳过布局和绘制,直接执行后续的合成操作,这个过程就叫合成。原创 2023-02-28 10:46:24 · 1176 阅读 · 0 评论