[WebKit]WebCore之页面加载的设计与实现(二)

简介: 从上次学习WebKit加载已经过去了大半年了,终于又有时间理一次加载流程。期望逐步完善细节,最后能有一个系统的总结。 首先可以这样理解WebKit的加载逻辑,涉及三个主要的组件, 其中HTTP stack为各个平台下使用的HTTP协议模块,WebCore Loaders则依据页面加载及解析过程对加载不同HTML Element的控制,Loading Controller则具体实现了资源加载的行为控制: 虽然从WebKit整体结构上这样理解不太严谨的,但单纯站在加载的角度来看,却有利于理解加载流程。

从上次学习WebKit加载已经过去了大半年了,终于又有时间理一次加载流程。期望逐步完善细节,最后能有一个系统的总结。


首先可以这样理解WebKit的加载逻辑,涉及三个主要的组件, 其中HTTP stack为各个平台下使用的HTTP协议模块,WebCore Loaders则依据页面加载及解析过程对加载不同HTML Element的控制,Loading Controller则具体实现了资源加载的行为控制:


虽然从WebKit整体结构上这样理解不太严谨的,但单纯站在加载的角度来看,却有利于理解加载流程。因为HTTP Stack依赖平台实现,这里从中间的Loading Controller说起。


Loading Controller提供了两个重要的接口类,一个是供WebCore调用以加载各个资源的类CachedResourceLoader, 另一个是对接HTTP模块的ResourceHandle。



1. 加载不同的资源

不同的资源的加载其差异在于数据的处理方式不同,比如主文档要提交到Document Parser里去进行解析,图片则要显示出来,但它们的网络加载流程是相同的,所以它们有不同的CachedResourceClient实现,复用了SubresourceLoader的加载流程。


下图可以看到DcoumentLoader及ScriptElement如何关联到CachedResource:


开始加载资源包含两个重要过程:一是创建CachedResource, 二是调用CachedResource::addClient注册CachedResourceClient实例。


下图是ScriptElement的加载序列图:



CachedResourceHandle可以视为CachedResource的一个封装,提供给WebCore Loaders使用。


CachedResourceHandle是一个模板类

template <class R> class CachedResourceHandle


CachedResourceLoader为不同类型的资源提供了不同的接口函数,比如Script对应的加载函数:


CachedResourceHandle<CachedScript> CachedResourceLoader::requestScript(CachedResourceRequest& request)

{

    return static_cast<CachedScript*>( requestResource(CachedResource::Script, request).get() );

}


当收到数据时,从CachedResource派生出来的子类,会通过data函数及时获得已加载的数据,再通过注册的clients完成相应的操作。


上一篇已经提到加载的发起流程,下面是收到数据后,HTTP Stack回调的过程:




  *出错时,则调用到CachedResource::error()

下图是主文档(CachedRawResource)收到数据后的处理流程(DocumentLoader就是CachedRawResource的client):


以下是CachedRawResource::data的代码片段:

if (incrementalDataLength) {

        CachedResourceClientWalker<CachedRawResourceClient> w(m_clients);

        while (CachedRawResourceClient* c = w.next())

            c->dataReceived(this, incrementalData, incrementalDataLength);

    }



2. ResourceHandle的跨平台

关于WebKit的跨平台机制,可以参考<<WebKit模块化分析>>中"兼容并蓄 - WebKit的跨平台方案"。

ResourceHandle,ResourceHandleInternal及NetworkingContext都定义在platform/network目录下. ReourceHandle针对不同平台有部分函数有不同的实现,实现的单元文件在platform/network目录下具体平台port的子目录下。


     

*在使用的HTTP Stack中,除curl等平台实现外,WebKit源代码还提到了SOUP, 这也是一个为GNOME应用提供HTTP支持的库,简介如下:

Soup uses GObjects and the glib main loop, and is designed to work well with Gtk/GNOME applications. This enables GNOME applications to access HTTP servers on the network in a completely asynchronous fashion, very similar to the Gtk+ programming model (a synchronous operation mode is also supported for those who want it).

转载请注明出处: http://blog.csdn.net/horkychen

本系列上一篇:

  [WebKit]WebCore之页面加载的设计与实现(一)

UML图档下载地址(GitHub):

  WebKit-Documentation

目录
相关文章
|
5月前
|
前端开发 JavaScript UED
过渡效果的艺术:CSS transition 让网页交互更平滑(上)
过渡效果的艺术:CSS transition 让网页交互更平滑(上)
|
Android开发
SwiftUI—使用WebKit里的网页视图
SwiftUI—使用WebKit里的网页视图
701 0
SwiftUI—使用WebKit里的网页视图
|
Web App开发 JavaScript 前端开发
CSS3动画卡顿性能优化解决方案
CSS3动画卡顿性能优化解决方案
CSS3动画卡顿性能优化解决方案
|
12天前
|
缓存 前端开发 JavaScript
网页布局中,如何增加页面加载速度?
## 提升网页加载速度的关键策略 网页加载速度对用户体验和网站性能至关重要。本文介绍六种优化方法:优化图片与媒体文件(如使用WebP格式和懒加载),精简代码并压缩CSS/JavaScript,利用CDN加速;减少HTTP请求,如合并文件和使用CSS Sprites;合理配置浏览器缓存;优化服务器响应,选择高性能服务器并使用Gzip压缩;谨慎管理外部资源,考虑异步加载。根据网站具体情况调整这些策略,可显著提升加载速度。
|
2月前
|
编解码 移动开发 前端开发
浏览器兼容性
浏览器兼容性
|
3月前
|
移动开发 前端开发 JavaScript
解决浏览器兼容性问题的方法
解决浏览器兼容性问题的方法
|
5月前
|
前端开发 UED
深入理解CSS过渡效果(Transition):提升网页动画体验
深入理解CSS过渡效果(Transition):提升网页动画体验
297 1
|
5月前
|
Web App开发 前端开发 JavaScript
过渡效果的艺术:CSS transition 让网页交互更平滑(下)
过渡效果的艺术:CSS transition 让网页交互更平滑(下)
|
JavaScript C++
给Webkit内核的浏览器控件增加互交功能
转载请说明出处,谢谢~~       昨天封装了基于webkit的wke浏览器内核,做成了duilib的浏览器控件,实现了浏览功能,但是单单的浏览功能还不满足需求,在我的仿酷狗项目中乐库的功能需要与浏览器互交。
1783 0
|
前端开发 JavaScript 内存技术
CSS交互动画指南之keyframes
过去 WEB 需要实现交互动画效果是使用 flash 、javascript、Gif,近年来随着 flash 的淘汰,javascript 和 CSS 功能的增强,使得现代 WEB 应用的交互越来越丰富。借此总结一下 CSS 交互动画实现的基础,关键的知识点是 keyframes ,文章涉及的代码示例效果可以点击查看动画效果。
194 0