Displaying A Web Page In Chrome

概念化的应用分层

参见原文档:http://goo.gl/MsEJX

每一个box代表一个抽象层。下层不依赖于上层。

  • WebKit:渲染引擎。Safari,Chrome / Chromium均在使用。国内的则有百度浏览器,QQ浏览器,猎豹等。Port(即移植)是webkit的一部分,它负责整合与系统相关的服务,如资源下载,图像解码等。
  • Glue:胶水层。负责把WebKit的数据类型转换为Chromium的数据类型(与android平台中的glue含义一致)。他属于webkit嵌入层。正是这一层的作用使得webkit可以嵌入到系统中。它也是Chromium和test_shell的基础。
  • Renderer/Render host:Chromium的多进程部件。它处理通知及命令。
  • WebContents:Content模块的主类,一个可以利用的组件。使用他就可以实现多进程渲染。更多细节请点击content module pages
  • Browser:代表浏览器窗口。它包含多个WebContent。
  • Tab Helpers:一群独立对象。它们可以附着到一个WebContents上。

WebKit

我们使用开源的WebKit实现网页布局。这部分代码是从Apple拉取的,放在third_party/WebKit目录下(启用blink后不一样了亲。。。)。WebKit由两个引擎构成:WebCore和JavaScriptCore。WebCore负责网页布局;JavaScriptCore负责运行js代码。我们仅在测试的情况下才会运行JavascriptCore。正常情况,我们使用我们自己的V8引擎。它的性能比JavaScriptCore要好的多。我们没有使用WebKit这一层(Apple的称呼)。

WebKit Port (移植或适配层)

在底层,我们有自己的WebKit适配层(port)。与平台相关的功能接口均在这里面实现。这些代码位于WebKit目录下的chromium目录。其实,许多的移植是与os无关的。但像字体渲染是必须和平台绑定在一起的。

  • 网络流量由多进程资源加载系统处理,而不是依赖于os。
  • 图像使用为Android开发的Skia图形库。这是一个跨平台的图形库,处理所有的图像和图形。Skia代码位于/third_party/skia目录下。图形操作的入口位于/webkit/port/platform/graphics/GraphicsContextSkia.cpp中。

WebKit glue (胶水层)

Chromium应用使用不同于WebKit源代码的数据类型,代码风格,以及代码布局。WebKit glue提供一个更加方便的嵌入API。该API使用google代码类型,比如,我们使用std:string代替WebCore::String,使用GURL替换KURL。glue代码位于/webkit/glue目录下。glue的对象命名与WebKit的对象类似,但均以”Web”开头。比如,WebCore::Frame变成WebFrame。

WebKit glue层将Chromium代码与WebCore的数据类型分离,把WebCore对Chromium的影响降到最低。所以,WebCore中的数据类型绝对不会被Chromium直接使用。

“test shell”应用是一个“裸”的web浏览器,仅用于测试WebKit移植和glue代码。它使用glue接口与WebKit通信。Chromium也是这样做的。它向开发者提供一个更简便的测试新代码的方式,不需要关注众多复杂的浏览器feature,线程及进程。WebKit的自动化测试也是由这个应用跑的。但是,test shell的缺点就是它毕竟和Chromium不一样。content模块嵌入到一个叫“content shell”的应用中。

Render进程

Chromium的render进程通过glue接口嵌入WebKit port。它没有太多的代码:它的首要职责是作为连接browser的IPC channel另一端 - Renderer。

Renderer中最为重要的类是RenderView,位于/content/renderer/render_view_impl.cc。这个对象代表一个web页面(web page)。它处理所有的navigation相关的命令。这些命令可以来自Browser进程或者发向Browser进程。RenderView类继承自RenderWidget。RenderWidget提供绘制和输入事件的处理。RenderView与Browser进程间通过全局对象RenderProcess通信。

FAQ:RenderWidget和RenderView两者间有什么不同?

RenderWidget实现了glue层的抽象接口WebWidgetDelegate,以此映射到WebCore::Widget。这是屏幕上最基本的一个窗口。该窗口会接收输入事件并且绘制的结果也送到该窗口中。RenderView继承自RenderWidget。它是一个tab或一个弹出窗口的内容。它处理navigational性质的命令(导航命令??)。RenderWidget仅在一种情况下可以独立于RenderView存在:web页面上的选择框。这些框通常带有向下的箭头。这个箭头用于弹出可选项。这个选择框性友用native窗口渲染。因为只有这样,选择框才能出现在其他元素的上面。这些窗口需要接收输入事件,但并没有一个分离的“web page”(即RenderView)来做这件事。

Renderer中的线程

每一个Renderer有两个线程。一个是render thread(即渲染线程);另一个是主线程。像RenderView和WebKit代码均运行在这个线程里面。当Renderer需要与Browser通信时,消息先被发给主线程。主线程负责把消息转发给Browser进程。除了别的之外,这种机制也允许我们以同步方式向Browser发送消息。这种情况发生在一小部分操作时。这些操作通常需要等待浏览器的返回结果才可以继续。比如,通过js获取一个page的cookies。此时,Renderer线程就会阻塞。主线程把收到的所有消息入队直到收到正确的响应。这期间收到的任何消息均会被送到Renderer线程,走正常的处理流程。

Browser进程

低级对象(low-level browser process objects)

所有Renderer进程的IPC通信都是在Browser的I/O线程中完成的。这个线程也处理网络通信。该方案可以避免对用户交互的影响。

当主线程初始化完一个RenderProcessHost对象后,该对象会创建一个新的Renderer进程并分配一个ChannelProxy给Renderer(以命名管道方式)。该对象运行在浏览器的I/O线程里,监听该命名管道并自动把消息转发给RenderProcessHost对象(该对象在UI线程,即主线程里)。一个ResourceMessageFilter对象会被安装到Channel上,用于过虑特定的消息。这些特定的消息可以被I/O线程直接处理,如网络请求。这种过滤行为发生在ResourceMessageFilter::OnMessageReceived里。UI线程里的RenderProcessHost负责分发所有view相关的消息给相应的RenderViewHost。这种分发行为发生在RenderProcessHost::OnMessageReceived里。

高级浏览进程对象(High-level browser process objects)

View相关的消息来到RenderViewHost::OnMessageReceived中。这些消息有大部分在这里被处理掉。剩下的则被转发给RenderWidgetHost基类。这两个类分别映射到Renderer中的RenderView和RenderWidget。每一个平台均会有一个view class(RenderWidgetHostView[Aura|Gtk|Mac|Win]),实现到native view系统的整合。

WebContents对象位于RenderView/Widget之上。大多数消息在这个对象被方法调用消费掉。一个WebContents代表一个web page的内容。它是content模块的顶层对象。它负责在一个矩形视图(view)里显示一个web page。要查阅细节,请点击“Content Module Pages”。

WebContents对象被一个叫做TabContentsWrapper包含。该类位于chrome目录,代表一个tab(即标签页)。

两个说明性示例

Set Cursor(光标)消息的生命周期

暂无

鼠标点击消息的生命周期

暂无

Chromium如何显示Web页面的更多相关文章

  1. web页面请求历程

    web页面请求历程 1)准备DHCP,UDP,IP和以太网 客户端要访问www.google.com的网站. 首先客户端要与网络相接,没有IP地址地址就不能做什么事情,所以客户端采取的一个网络相关的动 ...

  2. 如何把报表放到网页中显示(Web页面与报表简单集成例子)

    1.问题描述 现在用户开发的系统基本上趋向于BS架构的浏览器/服务器模式,这些系统可能由不同的语言开发,如HTML.ASP.JSP.PHP等,因此需要将制作好的报表嵌入到这些页面中. FineRepo ...

  3. [置顶] 读取pdf并且在web页面中显示

    读取pdf并且在web页面中显示 if (System.IO.File.Exists(f)) { Response.ContentType = "applicationpdf"; ...

  4. ios访问web页面<div>点击事件不起效果,以及alert()显示url的解决办法

    ios访问web页面<div>点击不起效果,在其div上添加style=”cursor:pointer:“ jquery web页面动态append()事件调用方法:$(document) ...

  5. [Hadoop异常处理] Namenode和Datanode都正常启动,但是web页面不显示

    异常 namenode和data都正常启动 但是web页面却不显示,都为零 解决办法一: 在hdfs-site.xml配置文件中,加入 <property> <name>dfs ...

  6. php中调用这个功能可以在web页面中显示hello world这个经典单词

    php程序写的时间长了,自然对他所提供的功能了如指掌,他所提供的一大堆功能,真是觉得很好用,但有时候会发现php也缺少一些功能,自己总是会产生为php添加一些自定义的功能的想法.久而久之,终于今天憋不 ...

  7. 怎样把报表放到网页中显示(Web页面与报表简单集成样例)

    1.问题描写叙述 如今用户开发的系统基本上趋向于BS架构的浏览器/server模式.这些系统可能由不同的语言开发.如HTML.ASP.JSP.PHP等.因此须要将制作好的报表嵌入到这些页面中. Fin ...

  8. QT使用插件QAxWidget来展示web页面

    要求:用qt版开发一个桌面程序,该程序有一个界面,用来显示一个采用silverlight开发的web页面. 分析:在qt中实现web显示,根据qt的版本和对应编译器的版本,有如下选择: (1)5.6以 ...

  9. ASP.NET Core应用针对静态文件请求的处理[5]: DefaultFilesMiddleware中间件如何显示默认页面

    DefaultFilesMiddleware中间件的目的在于将目标目录下的默认文件作为响应内容.我们知道,如果直接请求的就是这个默认文件,那么前面介绍的StaticFileMiddleware中间件会 ...

随机推荐

  1. android环境下解决java.io.IOException: Malformed ipv6异常的方法

    今天做客户端想服务端提交信息的时候,报出了如标题所显示的方法 方法以及参数如下: 输入的参数为:http://192.168.1.173:8080/Api/petinfo/petinfo?flag=a ...

  2. linux之screen命令

    linux平台下想同时运行多个操作,执行多个程序或命令:命令行就一个,要想同时执行多个命令如何操作? 一个screen命令即可: Centos操作系统默认没有安装screen: 安装方法: Cento ...

  3. SQL Server 2008 错误 233 的解决办法

    问题一.忘记了登录Microsoft SQL Server 2008 的sa的登录密码 解决方法:先用windows身份验证的方式登录进去,然后在‘安全性’-‘登录’-右键单击‘sa’-‘属性’,修改 ...

  4. sql server中关于批处理与脚本的简单介绍

    1.批处理 批处理指的是包含一条或多条T-SQL语句的语句组,这组语句从应用程序一次性地发送到SQL Server服务器执行.SQL Server服务器将批处理语句编译成一个可执行单元(即执行计划), ...

  5. USACO Section 5.3 Big Barn(dp)

    USACO前面好像有类似的题目..dp(i,j)=min(dp(i+1,j),dp(i+1,j+1),dp(i,j+1))+1  (坐标(i,j)处无tree;有tree自然dp(i,j)=0) .d ...

  6. BZOJ 1208: [HNOI2004]宠物收养所(BST)

    本来想先用set写一遍,再自己写个splay或treap,不过用set过了之后就懒得去写了....以后有空再来写吧..(不会有空的吧= = ------------------------------ ...

  7. 嵌入式linux的网络编程(1)--TCP/IP协议概述

    嵌入式linux的网络编程(1)--TCP/IP协议概述 1.OSI参考模型及TCP/IP参考模型 通信协议用于协调不同网络设备之间的信息交换,它们建立了设备之间互相识别的信息机制.大家一定都听说过著 ...

  8. [置顶] 两主机搭建MySQL主从复制后,show slave status显示:Last_IO_Error: error connecting to master ……

    两台主机A.B搭建mysql主从复制关系(A为master,B为slave)后,在slave上执行show slave status,结果中显示Last_IO_Error: error connect ...

  9. Android 开发笔记 “java.util.Calendar.compareTo()”

     java.util.Calendar.compareTo() 方法比较Calendar对象和anotherCalendar对象之间的时间值(毫秒偏移量). 声明 以下是java.util.Calen ...

  10. sqlserver 在将 nvarchar 值 'XXX' 转换成数据类型 int 时失败

    最近做oracle和sqlserver数据库兼容,感觉sqlserver真心没oracle好用,存储过程竟然只能返回int类型,疯了 疯了 存储过程的output及return的区别 sql取整 ce ...