WebKit资源加载和网络栈
webkit笔记,主要来自 朱永盛 《WebKit技术内幕》 学习笔记,转载就注明原著,该书是国内仅有的Webkit内核的书籍,学习的好导师,推荐有兴趣的朋友可以购买
WebKit资源加载机制
HTML支持的资源主要包括:
HTML: HTML页面,包括各式各样的HTML元素
JavaScript: JavaScript代码,可以内嵌在HTML文件中,也可以单独的文件存在
CSS样式表: CSS样式资源,因为CSS代码除了可以内嵌在HTML文件之外,还可以以单独文件形式存在
图片: 各种编码格式的图片资源,包括 png、jpeg等。当然还有一些特殊的图片资源,例如 SVG 中所需要的图片资源
SVG : 用于绘制 SVG 的2D 矢量图形表示
CSS Shader: 支持 CSS Shader文件, 目前WebKit支持该功能
视频、音频和字幕: 多媒体资源及支持音视频的字幕文件( TextTrack )
字体文件: CSS支持自定义字体, CSS3 引入的自定义字体文件
XSL 样式表: 使用 XSLT语言编写的 XSLT代码文件
上面这些资源在 WebKit中均有不同的类表示它们,它们的公共基类是 CachedResource。
HTML 对应的类型为 MainResource类, 与其对应的资源类型叫 CachedRawResource 类
还有两个与资源密切关联的类:
CachedResourceClient: 监听资源加载状态信息的
CachedResourceLoader: 负责资源加载的策略
WebKit 资源缓存机制
WebKit利用MemoryCache和CachedResourceLoader来实现资源缓存机制,如下图所示
对于相同的URL,使用同一个 CacheResource
当资源占用的内存超过缓存空间的时候,使用 LRU机制释放缓存
资源加载器
Webkit 总共有三种类型的资源加载器
1,针对某种资源类型的特定加载器,仅加载某一种资源。 例如:对于 'image' 这个HTML元素,该元素需要图片资源,对应的特定资源加载器是 ImageLoader 类。对于 CSS 自定义字体,
它的特定资源加载器是 FontLoader类。这些资源加载器没有公共基类,其作用就是当需要请求资源时,由资源加载器负责加载并隐藏
背后的复杂逻辑。加载器属于它的调用者,如下图所示的图片加载器
2,资源缓存机制的资源加载器,特点:所有特定加载器都共享它来查找并插入缓存资源 --- CacheResourceLoader类。特定加载器 先 通过缓冲机制的资源加载器来查找是否有缓存资源
它属于 HTML 的文档对象, 如下图:
3,通用资源加载器 ----- ResourceLoader 类, 是在 WebKit需要从网络或者文件系统获取资源的时候使用该类 ,只负责获得资源的数据,因此被所有特定资源加载器所共享。
它属于 CachedResource 类,但它同 CacheResourceLoader 类没有继承关系,如下图所示:
之所以 WebKit这样设计加载器,主要还是因为 WebKit 想将其中的负载机制 逐渐简化为 若干简单步骤。
加载过程
加载过程如下图所示:
鉴于从网络获取资源时一个非常耗时的过程,通常一些资源的加载是异步执行的,也就是说资源的获取和加载不会阻碍 当前 WebKit的渲染过程,例如图片、CSS文件。当然,网页也存在某些特别的资源会阻碍主线程的渲染过程,例如 JavaScript 代码文件。这会严重影响 WebKit 下载资源的效率,因为后面可能还有许多需要下载的资源,WebKit会怎么做?
因为主线程被阻碍了,后面的解析工作没办法继续往下进行,所以对于 HTML 网页中后面使用的资源也没有办法知道并发送下载请求。
当遇到这种情况的时候,WebKit的做法是这样的:当前的主线程被阻碍时。WebKit会启动另外一个线程去遍历后面的HTML页面,收集需要的资源URL
,然后发送请求,这样就可以避免被阻碍。
与此同时,WebKit 能够并发下载这些资源,甚至并发下载 JavaScript 代码资源。
这种机制对于网页的加载提速很是明显。
WebKit资源加载和网络栈的更多相关文章
- Webkit之资源加载
一.webkit资源分类 webkit中有多种资源,大致分为以下几种: HTML文本 CSS样式文本 - CachedCSSStyleSheet 字体 - CachedFont 图片 - Cached ...
- 理解WebKit和Chromium: Chromium的多进程资源加载机制
转载请注明原文地址:http://blog.csdn.net/milado_nju ##概述 前面介绍了WebKit中的资源加载机制,其实它只是一个框架性的东西,实际的资源加载依赖于各个WebKit移 ...
- 聊聊浏览器(webkit)资源加载机制
一些准备 在开始这个话题之前,我们有必要简单回顾一下 浏览器(webkit)的网页渲染过程(如果想要详细了解这个过程,可以戳我几年前写的一篇文章.): 我们知道,浏览器在渲染过程中,如遇到节点需要依赖 ...
- 【原】从一个bug浅谈YUI3组件的资源加载
篇前声明:为了不涉及业务细节,篇内信息统一以某游戏,某功能代替 前不久,某游戏准备内测客户端,开发人员测试过程中发现某功能突然不灵了,之前的测试一切ok,没有发现任何异常,第一反应是,游戏内浏览器都是 ...
- 【Chromium中文文档】多进程资源加载
多进程资源加载(需要更新) 转载请注明出处:https://ahangchen.gitbooks.io/chromium_doc_zh/content/zh//General_Architecture ...
- Chrome设计文档-多进程资源加载
原文:Multi-process Resource Loading 背景 浏览器主进程及browser process处理所有的网络通信.原因有三点: Browser process可以控制每一个re ...
- Chromium多进程资源加载
webkit笔记,主要来自 朱永盛 <WebKit技术内幕> 学习笔记,转载就注明原著,该书是国内仅有的Webkit内核的书籍,学习的好导师,推荐有兴趣的朋友可以购买 多进程 资源的实际加 ...
- High Performance Networking in Google Chrome 进程间通讯(IPC) 多进程资源加载
小结: 1. 小文件存储于一个文件中: 在内部,磁盘缓存(disk cache)实现了它自己的一组数据结构, 它们被存储在一个单独的缓存目录里.其中有索引文件(在浏览器启动时加载到内存中),数据文件( ...
- 再谈DOMContentLoaded与渲染阻塞—分析html页面事件与资源加载
浏览器的多线程中,有的线程负责加载资源,有的线程负责执行脚本,有的线程负责渲染界面,有的线程负责轮询.监听用户事件. 这些线程,根据浏览器自身特点以及web标准等等,有的会被浏览器特意的阻塞.两个很明 ...
随机推荐
- web网络攻击解决方案
原文地址:https://www.xingkongbj.com/blog/http/web-attack.html 产生原因 HTTP 不具备安全功能. 在客户端可以篡改请求. 跨站脚本攻击 XSS ...
- 最长递增子序列(51Nod - 1134)
20180604 23:18 https://blog.csdn.net/joylnwang/article/details/6766317(写得很用心,膜拜dalao) 给出长度为N的数组,找出这个 ...
- thinkphp模板如何转换时间格式?
<!-- 如果有日期输出,即$data.time不为空且不为0,则格式化时间戳,否则默认当前时间戳,并格式化成日期格式 --> {$data.time|default=time()|dat ...
- Asp.Net Core 使用Docker进行容器化部署(二)使用Nginx进行反向代理
上一篇介绍了Asp.Net 程序在Docker中的部署,这篇介绍使用Nginx对Docker的实例进行反向代理 一.修改Nginx配置文件 使用winscp链接Liunx服务器,在/ect/nginx ...
- (转)老生常谈-从输入url到页面展示到底发生了什么
刚开始写这篇文章还是挺纠结的,因为网上搜索"从输入url到页面展示到底发生了什么",你可以搜到一大堆的资料.而且面试这道题基本是必考题,二月份面试的时候,虽然知道这个过程发生了什么 ...
- 一次 group by + order by 性能优化分析
一次 group by + order by 性能优化分析 最近通过一个日志表做排行的时候发现特别卡,最后问题得到了解决,梳理一些索引和MySQL执行过程的经验,但是最后还是有5个谜题没解开,希望大家 ...
- python爬虫:爬取链家深圳全部二手房的详细信息
1.问题描述: 爬取链家深圳全部二手房的详细信息,并将爬取的数据存储到CSV文件中 2.思路分析: (1)目标网址:https://sz.lianjia.com/ershoufang/ (2)代码结构 ...
- TensorFlow深层神经网络常用方法
深度学习所示深层神经网络的代名词,重要特性:多层.非线性. 若只通过线性变换,任意层的神经网络模型与单层神经网络模型的表达能力没有任何区别,这是线性模型的局限性.对于线性可分的问题中,线性模型可解决, ...
- Electron入门应用打包exe(windows)
最近在学习nodejs,得知Electron是通过将Chromium和Node.js合并到同一个运行时环境中,用HTML,CSS和JavaScript来构建跨平台桌面应用程序的一门技术.对于之前一直从 ...
- [Windows]_[C/C++]_[如何调试子进程]
场景 1.VC++ 的程序A在启动程序C时, 如果需要调试程序C的话一般有两种, 一种是通过菜单 调试->附加到进程的方式来调试程序, 缺点就是这个进程必须先启动, 但是一启动的话有可能就执行了 ...