Android 浏览器内核浅谈[通俗易懂]

Android 浏览器内核浅谈[通俗易懂]目前,移动设备浏览器上常用的内核有Webkit,Blink,Trident,Gecko等,其中iPhone和iPad等苹果iOS平台主要是WebKit,Android 4.4之前的android系统浏览器内核是WebKit,Android4.4系统浏览器切换到了Chromium(内核是Webkit的分支Blink),WindowsPhone8系统浏览器内核是Trident。 1.W

大家好,又见面了,我是你们的朋友全栈君。

 目前,移动设备浏览器上常用的内核有Webkit,Blink,Trident,Gecko等,其中iPhone和iPad等苹果iOS平台主要是WebKit,Android 4.4之前的android系统浏览器内核是WebKit,Android4.4系统浏览器切换到了Chromium(内核是Webkit的分支Blink),Windows Phone 8系统浏览器内核是Trident。

 1.WebKit项目 

(1)项目简介:WebKit项目是苹果公司在2005年发起的一个新的开源项目,是Safari浏览器的内核,是目前的主流浏览器渲染引擎。WebKit项目具有结构清晰、易于维护等优点,WebKit简单灵活和便于引入新移植的特性,使其迅速称为主流的渲染引擎。

 (2)WebKit架构   

WebCore部分:包含了目前被各个浏览器所使用的WebKit共享部分,是加载和渲染网页的基础部分,具体包括HTML解释器、CSS解释器等。  

JavaScriptCore引擎:是WebKit中的默认JavaScript引擎。在Google的Chromium项目中,它被替换为V8引擎。

WebKit Ports部分:是WebKit红的非共享部分,属于WebKit被移植的模块。由于不同浏览器使得平台差异、依赖的第三方库和需求不同,从而导致多种WebKit版本。

WebKit嵌入式接口:指在WebCore和javascript引擎之上的一层绑定和嵌入式编程接口,可以被各种浏览器调用。 Android 浏览器内核浅谈[通俗易懂]

 2.Chromuim项目 

(1)项目简介

  Chromuim项目是Google公司以苹果开源项目WebKit作为内核,创建的一个新的项目,该项目的目标是创建一个快速的、支持众多操作系统的浏览器。在Chromium项目基础上,Google发布了自己的浏览器产品Chrome。与使用WebKit作为内核的Safari浏览器不同,Chromium本身就是一个浏览器,而不是Chrome浏览器的内核,再未从WebKit项目分离之前,Chrome浏览器使用的是WebKit内核。2013年4月,Google宣布从Webkit复制出来并独立运作Blink项目,该项目也就是目前Android4.4及以上系统浏览器采用的内核。

 (2)Blink内核     

Blink项目从WebKit分离出来后,其本身也是源于WebKit项目,只是Google将除Chromium浏览器需要之外的其他移植的代码都删除了,并且在Blink项目中加入了很多新的技术,部分技术如下: 实现跨进程的iframe。iframe允许网页中嵌入其他页面,为了解决潜在的安全问题,为iframe创建一个单独的沙箱进程。 重新整理和修改WebKit关于网络方面的架构和接口。

将DOM树引入JavaScript引擎中。


针对各种技术的性能优化,包括图形、JavaScript引擎、内存使用、编译的二进制文件大小等。

(3)基于Blink引擎的Chromium浏览器结构 

  下图描述了Chromium的架构和主要模块,可知Blink只是其中的一个模块,和它并列的还有众多的Chromium模块,包括GPU/CommandBuffer(硬件加速架构)、V8 JavaScript引擎、沙箱模型、CC(Chromium合成器)、IPC、UI等。”Content模块”和”Content API(接口)”

  “Content模块”和”Content API”将下面的渲染机制、安全机制和插件机制等隐藏起来,提供一个接口层,是Chromium对渲染网页功能的抽象,被内部的Chromium浏览器、Content Shell调用,是用来渲染网页内容的模块。
“Chromium浏览和”Content Shell”

 “Chromium浏览和”Content Shell”是构建在Content API之上的两个”浏览器”,Chromium具有浏览器的完成功能。

“Content Shell”是使用Content API包装的一层简单的”壳”,用户可以使用Content模块来渲染和显示网页内容。Android WebView模块

  Android WebView模块是希望利用Chromiuim的实现来替换原来的Android系统默认的WebView. Android 浏览器内核浅谈[通俗易懂]

 3.浏览器内核 

(1)内核介绍     

在浏览器中,有一个最重要的模块,它主要的作用是将页面转变成可视化的图像结果,这就是浏览器内核,也被称为渲染引擎。所谓渲染,就是根据描述或者定义构建数学模型,通过模型生成图像的过程。浏览器的渲染引擎就是能够将HTML/CSS/JavaScript文本及其相应的资源文件转换成图像结果的模块。 Android 浏览器内核浅谈[通俗易懂]

 (2)内核特征    

一个渲染引擎主要包括HTML解释器、CSS解释器、布局和JavaScript引擎、绘图等。 HTML解释器:解释HTML文本的解释器,主要作用是将HTML文本解释成DOM(文档对象模型)树,DOM是一种文档的表示方法.

CSS解释器:级联样式表的解释器,主要作用是为DOM中各个元素对象计算出样式信息,从而为计算最后网页的布局提供基础设施。


布局:在DOM创建之后,WebKit需要将其中的元素对象同样式信息结合起来,计算他们的大小位置等布局信息,形成一个能够表示这所有信息的内部表示模型。


JavaScript引擎:使用JavaScript代码可以修改网页的内容,也能修改CSS的信息,JS引擎能够解释JS代码并通过DOM接口和CSSOM接口来修改网页内容和样式信息,从而改变渲染的结果。


绘图:使用图形库将布局计算后的各个网页的节点绘制成图形结果。


 
Android 浏览器内核浅谈[通俗易懂]

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/146426.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • matlab如何随机选颜色,Matlab 画图修饰-随机线条和随机颜色

    matlab如何随机选颜色,Matlab 画图修饰-随机线条和随机颜色转载自:http://www.zhaoyanpeng.cn/archives/237当需要对同一曲线不同参数下进行模拟时需要不同的颜色来加以区分:上例根据RGB颜色,来实现不同颜色曲线的组合,考虑到matlab画图中,颜色分量是以1/255的步长变化的,但是相邻颜色过于接近,因此我们可以选取rand随机数的形式,来实现颜色的随机变化;延伸:MATLAB有一个叫颜色映象的数据结构来代表颜色值。颜色映…

    2022年5月8日
    222
  • visual C++ 项目和解决方案的区别

    项目:项目是构成某个程序的全部组件的容器,该程序可能是控制台程序、基于窗口的程序或某种别的程序。程序通常由一个或多个包含用户代码的源文件,可能还要加上包含其它辅助数据的文件组成。某个项目的所有文件都

    2021年12月24日
    50
  • We Make AI-Ops Happen 杭州云栖大会——智能运维专场即将开启

    We Make AI-Ops Happen 杭州云栖大会——智能运维专场即将开启

    2021年6月12日
    152
  • java中的多行注释快捷键_eclipse多行注释快捷键「建议收藏」

    java中的多行注释快捷键_eclipse多行注释快捷键「建议收藏」eclipse为多行添加注释是有快捷方式可用的,了解了这个快捷方式相信很多网友都会大大提高编码效率,其实同时为多行添加注释可以分别添加“/**/”和“//”样式的,样式不同快捷键也会不同,下面我们可以一起看看具体的添加注释方法。eclipse多行注释快捷键方法一、使用Ctrl+Shift+C快捷键1、在Eclipse中拖动鼠标,选中需要注释的代码。2、按住Ctrl+Shift+C快捷键,如图所示…

    2022年8月15日
    8
  • VSCode运行Python教程「建议收藏」

    VSCode运行Python教程「建议收藏」1)首先在自己电脑新建一个专门写Python代码的文件夹(建议使用英文命名)然后打开VSCode,点击在弹出的界面,点击“打开文件夹”(或者点击顶端菜单栏的“文件”,再选择“打开文件夹”),选择你创建的文件夹。2)打开你刚刚建立的文件夹—>新建文件,编写Python代码。参考下面操作。每次新建Python文件,点击你文件夹旁边的**“新建文件”按钮**—>输入“文件名.py…

    2025年8月1日
    3
  • vue报错:Navigation cancelled from “/userIndex“ to “/blank/login“ with a new navigati

    vue报错:Navigation cancelled from “/userIndex“ to “/blank/login“ with a new navigati最近在弄一个vue项目时碰到这么一个报错,查了下资料,记录一下:这个错误是vue-router的内部错误,是因为没有进行catch处理,导致的编程式导航跳转问题,往同一个地址跳转时,会报错。解决方法如下:在路由文件中进行配置:router/index.jsimportVuefrom’vue’importRouterfrom’vue-router’Vue.use(Router)//解决报错constoriginalPush=Router.prototype.pushco

    2022年7月26日
    27

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号