专栏首页前端菜鸟变老鸟Webkit底层原理(2)--资源加载和网络栈

Webkit底层原理(2)--资源加载和网络栈

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。

本文链接:https://blog.csdn.net/caomage/article/details/101990551

资源加载和网络栈

使用网络栈下载网页和网页中的资源是渲染引擎工作的第一步,也是非常耗时间的一步。

一、Webkit资源加载机制

1. 资源

网页本身就是一种资源,例如图片、视频等。HTML支持的资源主要有以下类型:

  1. HTML:HTML元素;
  2. JavaScript:JavaScript代码,可以内嵌在HTML文件中,也可以单独以文件形式存在;
  3. CSS:层叠样式表,可以内嵌在HTML文件中,也可以单独以文件形式存在;
  4. 图片:各种编码格式的图片;
  5. SVG:用于绘制SVG的2D矢量图形表示;
  6. 字体文件:CSS3支持自定义字体; ……

2. 资源缓存

资源的缓存机制是提高资源使用效率的有效方法。它的基本思想是建立一个资源的缓存池,当Webkit需要请求资源的时候,先从资源池中查找相应的资源,如果存在,测从资源池中取,如果不存在,则发送请求到服务器获取。如下图:

3. 资源加载器

按照加载器的类型,Webkit一共有三种类型的加载器:

  1. 针对每种资源类型的特定加载器,其特点是仅加载某一种特定的资源。例如:图片加载器、字体加载器;
  2. 资源缓存机制的资源加载器,其特点是所有特定加载器都共享它来查找并插入缓存资源。特定加载器先通过缓存机制的资源加载器来查找是否有缓存资源;
  3. 通用资源加载器,Webkit需要从网络或者文件系统获取资源的时候使用它,因此它被所有的特定资源加载器共享。

4. 整个加载资源的过程

具体的加载过程可以看之前我写的一篇关于浏览器缓存原理的文章,很详细! 浏览器缓存详细介绍

二、Chromium多进程资源加载

资源的实际加载在各个Webkit移植中有不同的实现。Chromium采用的是多进程的资源加载机制。Renderer进程在网页的加载过程中需要获取资源,但是由于安全性和效率上的考虑,Renderer进程的资源获取实际上是通过进程间通信将任务交给Browser进程来完成,Browser进程有权限从网络或者本地获取资源。

三、网络栈

1. 网络栈的基本组成

网络栈的基本组成如下图:

2. 网络栈的调用过程

首先是URLRequest被上层调用并启动的时候,它会根据URL的scheme来决定需要创建什么类型的请求。scheme就是URL的协议类型,例如:“http://” 、“file://”,也可以是自定义的协议。其次,会创建一个对象URLRequestHttpJob,该对象从Cookie管理器获取与该URL相关联的信息。之后,开启一个HTTP连接的事务。再然后是建立套接字。如果用户设置了代理,则还需要其他代理相关的对象提供支持。

3. 域名解析(DNS)

通常情况下,用户都是使用域名来访问网络资源的,所以在建立TCP连接前需要解析域名。当然,Chromium使用一个单独的线程来处理它。同样,为了考虑效率,也会使用相应缓存对象对域名和地址映射关系进行保存。我们可以在地址栏输入:chrome://net-internals/#dns来清除Chrome浏览器的DNS缓存信息。

4. Cookie机制

Cookie是一项很古老的技术,因为简单易用,所以从诞生就收到广泛的应用。Cookie格式就是一系列的键值对,如下:

test=webkit;test2=chromium;Expires=2019-10-19T10:33:18.797Z;Domain=.test.con

其中test和test2是自定义关键字,Expires和Domain是预定义关键字,表示失效时间和该Cookie对应的域。基于安全性考虑,一个网页的Cookie只能被该网站自身访问。根据失效时间Cookie分为会话型(Session Cookie)和持久型(Persistent Cookie)。会话型当浏览器退出的时候即清除,没有失效时间的Cookie就是会话型。而持久型Cookie当浏览器退出的时候仍然保留,直到失效时间。在有效期内,每次访问服务器,浏览器都自动将Cookie带上。

5. 高性能网络栈-DNS预取和TCP预连接(preconnect)

DNS预取技术,主要思想是利用现有的DNS机制,提前解析网页中可能的网络连接。具体来讲,当用户正在浏览当前网页的时候,Chromium提取网页中的超链接,将域名抽取出来,利用比较少的CPU和网络带宽来解析这些域名或IP地址,用户根本感觉不到这一过程。当用户点击这些超链接的时候会省不少时间。 写网页的时候可以指定预取哪些域名,具体做法是: <link rel="dns-prefetch" href="http://test.com"> 当然,DNS预取技术不仅应用于网页中的超链接,当用户在地址栏中输入地址后,候选项同输入的地址很匹配的时候,在用户敲下回车键之前,Chromium已经开始使用DNS预取技术解析该域名了。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 浏览器缓存详细介绍

      我们拿百度首页来举例:   百度搜索输入框上面的logo是一张png图片,当我们浏览器请求这张图片的时候,会先检查该图片的HTTP头部字段,是这样的

    从入门到进错门
  • async/await 的错误捕获

    这样写可以正常打印getdata success 但是如果我们给getData传入的参数不是1,getData会返回一个reject的Promise,而这个地...

    从入门到进错门
  • JavaScript中数组排序sort深入理解(Array.prototype.sort)

    最近在看算法书的时候看到C++中的sort方法,书中介绍是使用的快速排序。于是想起来自己天天都在写的JavaScript中的sort排序,它使用的是什么排序算法...

    从入门到进错门
  • 硬盘1.08元/G,内存2G、4G不断地攀升,CPU也够猛了,自然而然到了虚拟机时代 博客分类: 心困网中央 虚拟机VmwareOracl

    在硬盘价格到了1.08元/G的时候,机器CPU也够猛了,内存也2G、4G不断地攀升时。。。

    阿敏总司令
  • [ASP.NET Core 3框架揭秘] 依赖注入[9]:实现概述

    《服务注册》、《服务消费》和《生命周期》主要从实现原理的角度对.NET Core的依赖注入框架进行了介绍,接下来更进一步,看看该框架的总体设计和实现。在过去的多...

    蒋金楠
  • 深入浅出 ClassLoader

    “加载”是类加载的时机的第一阶段。 类从被加载到虚拟机内存中开始,到卸载出内存为止,它的整个生命周期包括(5个阶段): ① 加载(Loading) ② 连...

    tomas家的小拨浪鼓
  • JavaSE 基础学习之一 —— Java 的简介

    版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/...

    剑影啸清寒
  • JVM面试题

    链接:https://blog.csdn.net/chenleixing/article/details/46706039/

    JAVA葵花宝典
  • SEO是件贼有意思的事情 golang入坑系列

    这两天迷上了SEO。真心看不起百度的竞价排名,但作为一个商业网站,赚钱是一件无可厚非的事情。只做活雷锋,没有大金主是做不长的。做完功课后,发现百度和google...

    随机来个数
  • 理解Java里面的jvm,jre,jdk的区别和联系

    我是攻城师

扫码关注云+社区

领取腾讯云代金券

玩转腾讯云 有奖征文活动