blink渲染知识8 - 软渲染

我觉的软件渲染的关键点:ui线程软件raster,并且软件合成。

http://blog.youkuaiyun.com/hongbomin/article/details/17931223

摘要

渲染过程可以形象地理解为用一支笔将特定的内容在一张纸上画出来,然后呈现在屏幕上,而对笔和纸张的选择决定了渲染的方式。在Chromiumon Android: 认识ChromiumWebView一文中我们提到,新版的WebView同时支持两种渲染模式,即软件渲染和硬件渲染。简单的说,软件渲染方式就是用“CPU”这支“笔”将页面内容绘制到以位图Bitmap为材质的“纸张”上,而硬件渲染方式则是用GPU这支笔(当然也需要借助CPU)将页面内容绘制到以Texture为材质的“纸张”上。本文将深入分析新版WebView的软件渲染过程,后续将对硬件渲染做进一步讨论。

为什么支持软件渲染

从Android3.0(APILevel 11)开始,2D渲染过程就全面支持硬件加速了,也就是说所有在View的Canvas上执行的绘制操作都是使用GPU了。同时,Android平台为在不同的层次为应用程序提供了配置接口或API接口,用来指定程序是否启用硬件加速。比如,你可以在manifest文件中显式设置android:hardwareAccelerated值

<applicationandroid:hardwareAccelerated="true" ...>

表示整个应用程序都将启用硬件加速,也可以为某个Activity或者View设置hardwareAccelerated属性。关于设定硬件加速的方式,详细信息请参考[1]。

那么,既然有了系统级别的硬件加速支持,新版WebView为什么还要支持软件渲染方式呢?原因有二:

  • WebView是Android系统的内置组件,对组件的升级必须保证对应用程序的兼容性。换句话说,那些使用了WebView但没有启用硬件加速的应用程序也能够在Android4.4上正常工作。这是最主要的原因。

  • 硬件加速方式虽然看上去“高端大气上档次“,但相应地应用程序会耗费更多的系统内存,例如需要加载OpenGL的动态库,会占用一定的内容空间(~8M?)。因此,软件渲染方式提供了另一种备选方案,应用程序可以根据Android设备配置选择是否启用硬件加速,确保正常的运行。

WebView的软件渲染过程

WebView的渲染是个较为复杂的过程,但只要将其中的关键步骤抽取出来,提纲挈领,再复杂的过程也可以一目了然,跃然纸上。如下这幅框架图尝试简化WebView渲染过程,只描述关键模块和步骤,接下来会逐一解读。 




关键的6大步骤

  1. 页面内容的更新导致包含WebViewChromium的ViewGroup失效,也就是WebView失效。触发HTML页面更新原因很多,比如DOM树变化,CSS动画以及相应快速滚动或缩放手势等等;

  2. View系统收到失效消息后,要求WebView部件重新绘制。如上所述,调用WebView.onDraw方法,继而触发AwContents.onDraw方法;

  3. AwContents请求native端对象InProcessViewRenderer(现在成了browserviewrender)调用OnDraw方法

  4. InProcessViewRenderer对象请求同步合成器(SynchronousCompositor)以软件模式合成页面内容;

  5. 页面中的内容层首先会被绘制一个SkPicture中,这个绘制操作只是记录绘制的命令

  6. 同步合成器的软件渲染子会re-play记录在SkPicture中的命令,将内容真正地绘制在WebView对应的Canvas上。这个过程被称为“光栅化”。

    关键点:软渲染的特点:软件raster,软件合成。当然,不排除光栅化,以及向skpicture里绘制和软件合成不是在一个线程完成的。但都是软件完成的。

参考资源:

[1]应用程序如何开启硬件加速,http://developer.android.com/guide/topics/graphics/hardware-accel.html#controlling

[2]Android视图系统的绘制模型,http://developer.android.com/guide/topics/graphics/hardware-accel.html#model





9.Chromium指纹浏览器开发教程之Blink渲染引擎 Chromium指纹浏览器开发教程之Blink渲染引擎 阅读详情

相关推荐

How Blink Works

在 Blink 上开发绝非易事。对于新接触 Blink的开发者来说,要实现一个高效的渲染引擎,需要了解大量Blink特有的概念和编码约定。对于经验丰富的开发者来说亦非易事,因为 Blink 非常庞大,对性能、内存和安全性极为敏感。关于Blink开发的更多内容, 参考这里。

weixin_48560325的博客 1340

blink渲染知识(二) - webcore rendering basics

Dom tree和Rendertree是独立的tree. Render tree由renderobject构成,并且renderobject并不和DOMnode 一一对应。有些dommode可能没有renderobject. 比如有些节点的css属性标记为display:none不显示。 Domtree的节点可以通过renderer()函数得到对应的rendertree中的renderOb

451

How Rendering Work (in WebKit and Blink)

文章包括的主要内容如下 — 渲染基础 - DOM & RenderObject & RenderLayer WebView,绘制与混合,多线程渲染 硬件加速 分块渲染 图层混合加速 网页游戏渲染 - Canvas & WebGL

THINK . DESIGN . CODE 1万+

浏览器渲染原理

浏览器渲染流程

sc19951004的博客 1215

C++ 层拦截:修改 Blink 引擎与 V8 绑定的底层逻辑

本文深入探讨了从JS层Hook转向C++底层修改来实现指纹浏览器的关键技术。文章指出,基于JS的拦截(如Object.defineProperty或Proxy)容易被风控系统检测,而真正的工业级解决方案需要深入Chromium的Blink渲染引擎和V8绑定层进行改造。主要内容包括: 剖析Blink与V8的协作机制,解释JS调用(如navigator.platform)时底层的C++调用链 通过修改Web IDL文件彻底删除webdriver等敏感属性 实战演示在Blink的C++实现层伪装platform、

数据知道的博客 540

基于单片机智能家居控制系统设计

*单片机设计介绍,基于单片机智能家居控制系统设计。

QQ2193276455的博客 1717

记录--浏览器渲染流程解析

这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 大家可能经常会听到 css 动画比 js动画性能更好这样的论断,或者是“硬件加速”,“层提升” 这样的字眼;要了解这些内容就需要对浏览器的渲染流程有个大致的了解,本文就是我个人对这些内容的一个总结梳理 需要注意的是: 本文仅个人学习总结梳理,如有错漏,望指正 本文以谷歌浏览器Blink内核为例 随着谷歌浏览器的更新迭代,有些渲...

林恒的博客 413

脑机接口技术介绍、应用与挑战

脑机接口的概念最先于1973年提出,伴随着计算机性能的飞速提高,在美国“人类脑计划”的资金支持下,脑机接口的研究进入了高速发展期。去年年末,我国科技部会议透露:中国将拿出540亿元,推进中国脑计划的发展。同时,这一举措也推动了我国脑机接口的研究发展。 脑机接口属于多学科交叉科技,涉及神经科学、计算机科学、认知科学、控制与信息科学技术、医学等多个学科。技术实现方式是通过信号采集设备从大脑皮层采集脑电信号,经过放大、滤波、A/D转换等处理,转换为可以被计算机识别的信号,然后对信号进行预处理,提取特征信号,再利

weixin_44603934的博客 9132

blink渲染知识(一)

http://dev.chromium.org/developers/design-documents/gpu-accelerated-compositing-in-chrome 4大trees: TheDOM tree, whichis our fundamental retained model TheRenderObject tree,which has a 1:1m

1082

【若依(ruoyi)】BootstrapTable列宽定制实战:突破width属性限制的两种方案

本文针对若依(RuoYi)框架中BootstrapTable组件列宽设置失效的常见问题,提供了两种实战解决方案。通过CSS样式覆盖法强制定义列宽,或利用formatter函数进行动态HTML包裹,有效突破width属性限制,实现精准的表格列宽定制。

weixin_29013129的博客 175

AD5940阻抗测量开发板实战:从源码获取到工程调试全解析

本文详细解析了AD5940阻抗测量开发板的实战应用,从源码获取到工程调试的全过程。AD5940作为ADI公司的高精度阻抗测量前端芯片,适用于生物阻抗分析、电化学传感器等领域。文章提供了开发环境搭建、工程配置、常见问题排查及进阶调试技巧,帮助开发者快速掌握AD5940开发板的使用方法。

weixin_30919429的博客 214

渲染引擎Blink整体架构讲解

本文系统介绍了Blink引擎的架构与工作原理。Blink作为Chromium核心渲染引擎,采用多进程架构运行在渲染进程中。其核心模块包括DOM、CSSOM、样式解析、布局、绘制和合成等。页面渲染流程涵盖HTML解析、CSS解析、构建渲染树、布局计算、分层合成和最终绘制显示等关键阶段。Blink通过分层合成、GPU加速和增量更新等机制优化性能。文章还对比了Blink与WebKit的区别,详解了布局算法和绘制流程,分析了性能瓶颈与优化实践,并展望了WebGPU集成和多线程优化等前沿发展方向。

onlymscn的博客 1804

Matlab实战:5分钟搞定脉冲多普勒雷达信号处理仿真(附完整代码)

本文详细介绍了如何使用Matlab在5分钟内完成脉冲多普勒雷达信号处理仿真,包括环境配置、线性调频信号生成、数字下变频处理、动目标检测及性能优化技巧。通过完整代码示例和实用技巧,帮助工程师快速验证算法可行性,提升雷达信号处理效率。

nokia的博客 946

Blink: Chromium的新渲染引擎

编自http://www.chromium.org/blink 关于blink  Google Chrome/Chromium 从创始至今一直使用 WebKit(WebCore) 作为 HTML/CSS 渲染引擎。WebKit 早先由 Apple 由 KHTML 项目 fork 出来,用于 Safari 浏览器的 Web 引擎。由于宽松的协议、轻量级的设计和便捷的应用程序内嵌

doon的专栏 4460

从零构建C++ Gerber解析器:以PCB缺陷检测为目标的实战指南

本文是一份面向PCB缺陷检测项目的实战指南,详细介绍了如何从零开始使用C++构建高性能的Gerber文件解析器。文章深入剖析了Gerber RS-274X格式,并提供了完整的开发环境搭建、核心数据结构设计、解析步骤实现以及为缺陷检测优化的具体方案,旨在帮助开发者获得对PCB制造数据的深度控制与极致性能。

weixin_29291185的博客 184

车载面试题目(ADAS)

多数功能都是依靠的前置传感器(经过Lidar、Radar、Camera融合),比如ACC、AEB、LKA、NOA、TJA、FCW等,只有少数涉及周视传感器,比如BSD、CVW、DOW。③如果前面有车切速度小于自车车速,自车减速对减速度有要求,比如3.5m/m2,④如果前车静止了,自车有个跟停距离要求,比如2-3m。试验场有不同曲率的弯道,比如125m、250m、500m的,根据需求跟车行驶,看是否会减速,能不能驶出弯道等。迭代内容:底层通讯、网络管理、诊断、刷写、信息安全、OTA。

qq_43475097的博客 2298

【谷歌浏览器Blink 引擎和V8 引擎】

谷歌浏览器使用Blink 引擎和V8 引擎,下面详细介绍它解析 HTML 、CSS、JS解析代码的过程。

niefuqiang的博客 1215

26届数字IC秋招笔试面试全攻略

《数字IC面试技巧指南》摘要:本文由资深专家团队打造,系统讲解数字IC设计岗位面试三大核心环节。1)自我介绍:强调1-2分钟结构化表达,需包含背景、项目经验、技能特长和职业规划,建议使用量化成果并突出岗位匹配度;2)项目介绍:提供"背景-职责-技术-难点-成果"五步框架,以AXI总线验证平台为例展示技术细节与个人贡献的呈现技巧;3)技术问题应答:提出"理解-结构-举例-坦诚"四步策略,涵盖数字设计、验证方法学等常见问题类型,并附时序违例等典型问题的回答模板。全文配有结

2301_79143213的博客 416

Chromium 系列之(5) blink相关知识

Chromium 系列之(5) blink相关知识 因为这段时间找工作,问的内核的相关问题比较多,所以记录下这些blink的相关的基础知识,一是帮助自己更好的理解blink,另一方面也当作笔记记录下来。 Blink的层级结构 一方面是HTML和CSS以及布局和JavaScript引擎部分,注意Blink中的JavaScript引擎为V8引擎。 另一方面是和系统相关的接口层,例如调用openGL等和音视频解码。Blink中的2D使用的是Skia,音频和视频是重点。 所以就会变成下面的样子。 Blink调用

wqqgtao的专栏 1732

C# WinForm 基于DirectShow.dll编写的程序,可边预览边保存视频,音频和图片

基于微软的DirectShow.dll的二次开发1.自动识别连接的摄像头跟麦克风且可以对其进行选择(默认选中第一个)2.可录制wmv和avi两种格式的视频并且都带有音频,avi可以录制的分辨率和帧数进行选择,wmv默认进行了淸晰度优化如不喜欢可去除代码中有相关提示3.可在预览点开之后进行拍照,也可边录制视频边拍照4.添加了视频和音频的压缩功能(酌情使用)这次二次开发发现C#对DirectShow的相关信息太少,这次做完也不敢藏私共享出来,还望大家指正

efm32 入门.pdf

本PDF共计22页,介绍的是操作驱动API,下载与否自己斟酌。

Blink是如何工作的

概述 Blink开发并不简单。对于Blink开发新手,不简单是因为,为了实现一个非常快的渲染引擎,已经引入了许多Blink特定的概念和编程约定。 即使对于经验丰富的 Blink 开发人员来说,这也并不容易,因为 Blink 非常庞大,而且对性能、内存和安全性极为敏感。 本文旨在从“3千米”高空视角来描述“Blink如何工作”,希望能够帮助Blink开发者快速熟悉Blink的架构: 本文档不是关于Blink细节构成和编码规则(可能变动与过时)的手册、指南。相反,该文档简明地描述了 Blink 的基本原

2962

TMS_WebGMaps_1.9.8.0_Full_Source

TMS_WebGMaps_1.9.8.0_Full_Source 全源码 delphi cbuilder

Chromium浏览器之渲染引擎Blink

Blink是谷歌公司的浏览器Chromium使用的渲染引擎。 Blink处于一个包容性的开源社区里,它欢迎任何人分享其使命。 Blink是在一种抽象的平台上实现的, 因此本身不能运行。 Chromium Content module提供这个抽象平台运行所需的Blink的实现。 Content模块的开发有专门的文档描述。有关调试Blink一些提示和建议,请参阅入门Blink调试页面。

不积跬步无以至千里,不积小流无以成江海 5729

LinePhone3.2.7(android端最新版本) sip客户端

SIP客户端For android:LinePhone3.2.7(最新版本),官网地址:http://www.linphone.org/

Blink和V8的关系

Blink 和 V8 是 Chromium 浏览器(以及基于 Chromium 的浏览器,如 Chrome、Edge 等)中两个核心但职责不同的组件,它们共同协作以实现网页的渲染和执行。(Rendering Engine),负责解析 HTML、CSS 并管理网页的布局(Layout)、绘制(Painting)和合成(Compositing)。(接口描述语言)定义 DOM API,并自动生成 V8 可调用的绑定代码,实现 JavaScript 与 C++(Blink 的实现语言)的交互。

liangshanbo1215的博客 685

WebKit/Blink 渲染网页的主要步骤

1.  发送网络资源请求。      WebKit在渲染网页之前,首先需要从网络上下载资源文件,这里把资源文件分为两类,一类称为主资源文件,比如Frame,另外一类成为子资源文件,比如图片,JavaScript脚本,CSS脚本,字体,音频视频文件等等。以前WebKit在加载这两种资源文件时采用不同的路径,主资源文件通过DocumentLoader类来加载,子资源文件通过DocLoader类来加载

HTML5, Chromium和WebKit技术 3783

Blink源码解析

《Blink渲染引擎架构与核心流程解析》摘要:Blink作为Chromium核心渲染引擎,主要负责HTML/CSS/JS解析(生成DOM/CSSOM)、布局计算、绘制渲染和事件处理。其架构包含DOM、Layout、Paint等模块,通过多阶段处理将网页转化为可视化内容:从DOM树构建、样式计算到RenderTree生成,再到分层绘制与GPU合成。关键特性包括增量式布局优化、硬件加速合成,以及与Chromium多进程架构的深度集成(运行在Renderer进程)。

onlymscn的博客 2220

使用blink内核_一文读懂浏览器内核工作原理

Chromium 的工程师们写了两篇技术文章How Blink Works和How cc Works,分别介绍了 Chrome 浏览器内核内部的两个重要模块 Blink 和 cc 内部设计和实现的一些细节。对于想要了解 Chrome 内核内部实现的同学,这两篇文章提供了不错的入门指引。在征得作者同意后,我将其翻译成中文,以馈读者。文中部分术语觉得难以翻译成合适的中文的,我会保留原文...

weixin_29532367的博客 6640

How Blink works

How Blink works 原文链接:https://docs.google.com/document/d/1aitSOucL0VHZa9Z2vbRJSyAIsAz24kX8LFByQ5xQnUg/edit Blink是Web平台的渲染引擎。 简单地说,Blink实现了所有在浏览器选项卡中呈现的内容: 实施网络平台的规范(例如HTML标准),包括DOM,CSS和Web IDL 嵌入V8并运行JavaScript 从基础网络堆栈请求资源建立DOM树 计算样式和布局 嵌入Chrome合成器并...

LIJIWEI0611的博客 584
上一篇: blink渲染知识7-webview和android的交互
下一篇: blink渲染知识9-chromium webview硬件渲染的演进
csshell2002
博客等级 码龄11年 30粉丝 41原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值