易旭昕-CSDN博客

原创 Chrome 渲染流水线演化的未来

前段时间我写了一篇文章浏览器渲染流水线解析与网页动画性能优化，对目前 60 左右版本的 Chrome 的渲染流水线进行解析，文末也讨论了当前渲染流水线的一些不足和未来演化的方向。当前的渲染流水线过于复杂和冗长，特别是对于非合成器动画来说，过多的线程/进程间交互增加了不少额外开销，异步光栅化的机制也是有利于合成器动画而不利于非合成器动画。而未来的演化理应需要简化渲染流水线，减少线程/进程间交互，

2017-12-11 15:54:25 1815

原创浏览器渲染流水线解析与网页动画性能优化

若干年前，我写过一篇介绍浏览器渲染流水线的文章 - How Rendering Work (in WebKit and Blink)，这篇文章，一来部分内容已经过时，二来缺少一个全局视角来对流水线整体进行分析，所以打算重新写一篇新的文章，从一个更高抽象层次和高度简化的方式对浏览器的渲染流水线进行解析，能让大部分页端同学都能够看的明白，并以此作为指引来分析和优化页面的渲染／动画性能。有些基本概念

2017-10-28 17:13:44 2366 1

原创 How Rendering Work (in WebKit and Blink)

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

2014-04-14 16:18:44 10391 3

原创 Why your Android Apps Suck

Why I wrote this article?When I learn more about Android's graphics system, and do more work about how to use CPU/GPU in more paralleled way to improve the graphics performance in Android, I start

2013-03-26 23:06:19 3770

原创微信小游戏 - 小游戏 vs H5 游戏性能对比和分析

这是个人关于微信小游戏系列文章的第三篇，在这系列文章里会描述 —— 如何把一些 Canvas/WebGL Demo 移植到小游戏环境并支持双端运行；对小游戏在 Android 平台的运行时架构进行分析；通过对移植的 Canvas/WebGL Demo 在小游戏和 Chrome for Android 浏览器上做 Benchmarking，对 H5 游戏 vs 小游戏的渲染性能进行对比和分析；

2018-03-06 18:12:53 7952

原创微信小游戏 - 运行时分析

这是个人关于微信小游戏系列文章的第二篇，在这系列文章里会描述 —— 如何把一些 Canvas/WebGL Demo 移植到小游戏环境并支持双端运行；对小游戏在 Android 平台的运行时架构进行分析；通过对移植的 Canvas/WebGL Demo 在小游戏和 Chrome for Android 浏览器上做 Benchmarking，对 H5 游戏 vs 小游戏的渲染性能进行对比和分...

2018-02-13 15:33:48 3638 2

原创微信小游戏 - Canvas/WebGL Demo 移植

这是个人关于微信小游戏系列文章的第一篇，在这系列文章里会描述 —— 如何把一些 Canvas/WebGL Demo 移植到小游戏环境并支持双端运行；对小游戏在 Android 平台的运行时架构进行分析；通过对移植的 Canvas/WebGL Demo 在小游戏和 Chrome for Android 浏览器上做 Benchmarking，对 H5 游戏 vs 小游戏的渲染性能进行对比和分...

2018-02-12 15:30:02 5609

5 非合成器动画性能分析和优化指南前面已经我们已经把非合成器动画区分为 Blink 触发，无法由合成器运行的动画和由 Timer/RAF 驱动的 JS 动画两类，因为前者可以认为是后者的一个简化版本，所以这一章主要讨论 Timer/RAF 驱动的 JS 动画。5.1 动画流水线从上图可以看出非合成器动画的流水线比合成器动画更长更复杂，并且非合成器动画的后半段跟合成器动画是一致的。JavaScipt

2017-10-27 11:09:02 1058

原创浏览器渲染流水线解析（三）

4 合成器动画性能分析和优化指南4.1 动画流水线上图显示了合成器动画的渲染流水线示意图，根据 Android WebView 平台的实现进行绘制，其它平台可能略微不同，但对后面的性能分析，在大部分情况下影响不大整个流水线的大概过程是：位于 Browser 进程 UI 线程的窗口管理器接收到来自操作系统的屏幕刷新垂直同步信号（VSync），开始准备输出新的一帧，它首先给位于 Rendere

2017-10-21 17:04:50 994

原创浏览器渲染流水线解析（二）

2. 网页动画动画可以看做是一个连续的帧序列的组合。我们把网页的动画分成两大类 —— 一类是合成器动画，一类是非合成器动画（UC 内部也将其称为内核动画，虽然这不是 Chrome 官方的术语）。合成器动画顾名思义，动画的每一帧都是由 Layer Compositor 生成并输出的，合成器自身驱动着整个动画的运行，在动画的过程中，不需要新的 Main Frame 输入；内核动画，每一帧都是由 Bl

2017-10-16 16:14:54 1046

原创浏览器渲染流水线解析（一）

浏览器渲染流水线解析若干年前，我写过一篇介绍浏览器渲染流水线的文章 - [How Rendering Work (in WebKit and Blink)][1]，这篇文章，一来部分内容已经过时，二来缺少一个全局视角来对流水线整体进行分析，所以打算重新写一篇新的文章，从一个更高抽象层次和高度简化的方式对浏览器的渲染流水线进行解析，能让大部分页端同学都能够看的明白，并以此作为指引来分析和优化页面的渲染

2017-09-26 19:51:03 1540

原创 Android 5.0+ 系统 WebView 可见性及合成器内存管理

WebViewAncestor View 不可见/可见WebView不可见/可见WebView Window 不可见/可见WebView Detach/AttachWebView Pause/Resume 系统 WebView (Android 5.0+)没有影响没有影响更新 WebView 可见性状态，影

2017-03-08 16:38:20 1575

原创对页端开发高性能（交互/动画） Mobile WebApp 的一些思考

我个人相信，基于 Open Web 技术开发的 Mobile WebApp 应用，按当前现状的普遍质量而言，在交互/动画方面还有很大的提高空间。但是这需要内核开发者和页端开发者的共同努力。

2017-01-20 16:56:03 2382 1

原创参加 Google 开发者日，与开发者关系团队交流的一些记录

写一篇流水账，记得什么就写什么，大概就是参加 Google 开发者日，与开发者关系团队交流的一些内容和想法的记录。

2016-12-12 18:53:07 1479

原创手机腾讯网渲染性能分析

手机腾讯网可以说是渲染性能优化的典范，可以作为所有手机新闻门户首页的模板。1. 它使用合成图层非常有目的性，一分不多一分不少；2. 整个合成图层树结构十分合理，并且非常稳定，变化极少；网页即使在较低端的手机上运行，无论是上下/左右划动，惯性滚动，图片轮播动画等都能够达到让人满意的流畅度。

2016-10-29 16:19:06 1702

原创 Transform Animation, Inline Transform and Overlap

这篇文章的目的在于说明在 Chrome 里面 Transform Animation 和 Inline Transform 对 Layer Overlap 计算的影响，而这个影响又会对一个 Render Layer 是否生成 Composited Layer（合成图层）产生难以察觉的微妙影响，而最终可能导致网页的渲染性能的明显变化。文章的末尾会考察一个手机凤凰网的例子并给出一些页端优化的建议。

2016-10-28 14:39:27 2119 2

原创 Page Rendering - Main Frame and Impl Frame

这是准备在内核组技术分享会上做的一次技术分享，主要是介绍网页渲染里面 Main Frame 和 Impl Frame 的含义，从而让读者对网页绘制的完整过程有一个基本概念。另外还略略说明了 Chromium 正在进行中的一些较大的架构/性能优化项目，说明它们是如何通过减少 Main Frame 和 Impl Frame 来提升渲染性能。

2016-01-28 14:39:24 2375

原创理解 Embedder，理解 Chromium 的系统层次结构

理解 Embedder，理解 Chromium 的系统层次结构标签： Chromium作者：易旭昕在 Chromium 官方的文档里面，我们经常会看到 blink’s embedder 或者 content’s embedder 这样的称谓，理解 embedder 的概念，对我们理解 Chromium 的系统层次结构是十分重要的。

2015-09-02 16:13:51 4299 1

原创 Chromium 代码研究的一些感想

自己研究 Chromium 的代码（主要是 Android WebView 这个平台的代码），也有相当长的一段时间了，在这里把自己的一些感想记录下来，如果对他人有所帮助，也算是有些益处。在研究过程中最大的感受，Chromium 非常重视架构的合理性和灵活性，每一个模块内聚性，独立性，还有接口和实现的分离都做的很好，对外的接口十分清晰，包括供外部调用的接口，需要外部提供实现的抽象接口（XXX

2015-04-27 15:11:33 4443 2

原创 Debugging of Chrome Android WebView

Debugging of Chrome Android WebViewChrome Android WebView Debugging作者: 易旭昕 (@roger2yi)本文主要描述如何将 Chrome Android WebView （下文简称CAW）的代码从 AOSP 中抽离出来，编译成独立的应用，方便对 CAW 的 Java/C++ 代码进行跟踪调试。相关的代码位于 GitHub Chro...

2014-08-16 18:21:40 4797

原创关于 Apple Metal API 的一些想法

在看完 Metal 的开发文档后，除了官方所宣称的一些优点外（比如说更容易理解和使用的 API，更直接和精细的硬件控制，减少 GPU 使用过程中的 CPU 额外开销等等），从我有限的 GLES 开发经验看来，以下一些方面更让人兴奋。更方便和友好的多线程 GPU 渲染支持GLES 的设计，所有东西都必须跟一个 GL Context 绑定，由 GL Context 内部所控制的状态机驱使，而 GL C...

2014-06-05 13:12:01 6284 2

原创 Android 4.4 meminfo 实现分析

Android提供了一个名为meminfo的小工具帮助应用分析自身的内存占用，并且在4.4还新增了memtrack HAL模块，SoC厂商通过实现memtrack模块，让meminfo可以获取GPU相关的一些内存分配状况。了解meminfo的实现，对我们更深入了解应用的内存占用状况是很有帮助的。而这篇文章的目的就是分析Android 4.4 meminfo的内部实现源码，让开发者通过这些信息可以更了解自己应用的内存占用状况。

2014-03-24 13:35:15 13684 4

原创我的2013 - 年终总结 + 浏览器渲染发展的一些思考

下半年开始，在和主管的工作总结中，还有职业等级评定的答辩会议上，都不断地被问到下面这两个问题，同时自己也在不断地进行思考。浏览器的渲染架构还有没有可能有更大的性能突破？浏览器能不能够成为一个承载游戏运行的良好平台，使得H5游戏能够跟原生游戏在同一层面竞争？

2013-12-29 20:14:24 4867

原创 High Performance Canvas Game for Android（高性能Android Canvas游戏开发）

Rule #0 为移动平台进行优化为移动平台进行优化是十分重要的，因为移动平台的性能大概只有桌面平台的1/10左右（*1），它通常意味着：更慢的CPU速度，这意味着不经过优化的JavaScript代码，性能会十分糟糕；更小的内存，没有虚拟内存的支持，这意味着加载太多的资源容易导致内存不足，JSVM更容易引发GC，并且GC造成的停顿时间也越长；更慢的GPU速度，没有独

2013-08-31 18:13:00 6194

翻译关于移动Web性能的5个神话

译者前言这篇文章（http://www.sencha.com/blog/5-myths-about-mobile-web-performance/）由Sencha的CEO Michael Mullany所写，主要是回应早前的一篇引起较多关于移动Web性能讨论的文章“Why mobile web apps are slow”（原文，译文），作者的主要观点是“Why mobile

2013-08-12 21:05:07 6723 3

原创 New Graphics Improvement in Android 4.3

下一个版本的Android，姑且认为是4.3，图形性能会有哪些提升？Android团队的图形专家Chet Haase和Romain Guy在Google IO 2013的演讲Android Graphics Performance上为我们透露了部分信息，演讲的内容包括架构性能提升，性能分析工具的改善和应用优化的一些建议，本文根据演讲内容写成，希望对做Android图形性能研究的朋友有所帮助。

2013-05-20 18:29:30 3862 2

原创 Why Blink and Why not Blink

清明放假的第一天，Mozilla 和 Google同时宣布了他们新的浏览器引擎的开发计划 —— Servo 和 Blink。Servo 早前其实就一直有消息了，而 Blink 的发布则是相当突然，因为工作的原因，我自然是对 Blink 更感兴趣（放个假都不得安生，苦逼的程序员），更希望了解 Google 为什么要从 WebKit fork 出一个新的浏览器引擎（Why Blink），这样的做法

2013-04-04 16:36:46 3927 1

原创 Introduce My Work 2

早前写了一篇文章“Introduce My Work”，用一个例子 —— HTML5 Canvas的一个简单实现，介绍自己工作的内容，而这篇文章试图去描绘自己工作内容所需的一个完整的知识体系的层次结构（见下图），并对其进行简单介绍。Browser App基于系统的GUI框架开发完整的浏览器应用。Android GUI Framework了解Android

2013-03-25 11:52:08 3384 4

原创 Introduce My Work

我在LinkedIn上面的个人简介是：Roger at UC Mobile Ltd. (www.uc.cn), focus on graphics stack (rendering architecture) research of WebKit based Browser in Android platform, include the graphics stack of WebKit

2013-02-02 11:35:52 4045

原创 Ubuntu for Phone

新年伊始最大的IT新闻莫过于Ubuntu for Phone的发布，系统的亮点除了全手势操作外，最让人感兴趣的就是插上底座后可以转换成桌面模式，作为一台thin PC来用，官方宣传语是Introducing the superphone that’s also a full PC。（其实自己一直期望Android和Chrome OS能够在底层进行融合，两者可以共存并且共享数据，分别运用于移动模

2013-01-03 18:49:51 3091

原创 “不明觉厉”的“远景战略规划”

以前一直觉得公司高层所谓的“远景战略规划”是一个相当“不明觉厉”的东西，可是去年年会老总的两艘航母与一群护卫舰的理论言犹在耳，不到年底，护卫舰就已经沉得七七八八，两艘航母也只剩下一艘（还好另外一艘还算康健），再往前追溯，直到2011年公司还认为塞班平台仍然大有作为，一个重量级的产品到了第三季度还把研发的重心放在塞班，直到第四季度才皤然醒悟，从这就可以知道所谓高层的“远景战略规划”其实也是一个相当不

2013-01-02 15:56:36 3383

原创如何编译 Chrome for Android

如何编译 Chrome for Android

2012-12-11 12:22:48 10869 5

原创 Android 4.1 - 如何使用systrace做性能分析

systrace是Android 4.1引入的一套用于做性能分析的工具，它基于Linux内核的ftrace机制（用于跟踪Linux内核的函数调用），可以输出各个线程当前的函数调用状态，并且可以跟当前CPU的线程运行状态，Display VSYNC间隔，SurfaceFlinger Window Composite间隔等系统信息在同一个时间轴上进行对比，让我们分析程序在某个时间点在当前系统上下文上的

2012-11-30 10:06:57 21388 1

原创 Android 4.1 - 将系统浏览器编译成独立应用

为了方便在手机上（Galaxy Note with CM10），调试Android4.1 系统浏览器的代码，进行代码研究，我把系统浏览器编译成了一个独立的应用，不会跟ROM原来的系统浏览器产生冲突，可以很方便地在Eclipse自己建立的工程里面对Java部分的代码进行跟踪调试，理论上C++的部分也可以通过GDB进行调试。自己编译的库，显示Layer边界和信息首先系统

2012-10-13 09:47:52 9325 12

原创伤仲永 - 公司人才培养感悟

金溪民方仲永,世隶耕.仲永生五年,未尝识书具,忽啼求之.父异焉,借旁近与之,即书诗四句,并自为其名.其诗以养父母,收族为意,传一乡秀才观之.自是指物作诗,立就.其文理皆有可观者.邑人奇之,稍稍宾客其父,或以钱币乞之.父利其然也,日扳仲永环谒于邑人,不使学.余闻之也久.明道中,从先人还家,于舅家见之.十二三矣.令作诗,不能称前时之闻.又七年,还自扬州,复到舅家问焉.曰:"泯然众人矣!"

2012-09-08 18:21:19 4672 2

原创 Web Page Rendering and Accelerated Compositing

这是最近在公司做的一次技术分享，介绍了WebKit里面的Accelerated Compositing机制，Accelerated Compositing（图层混合加速）主要用于CSS3动画的加速，由Apple首先引入WebKit并在Safari上实现，而目前，包括Qt，Chrome，Android等其它主要的WebKit Port也都提供了各自的实现。讲义内容包括：1，网页的基本渲染流程

2012-04-25 09:26:04 2208

原创 Google了解我多少？

Google CEO Larry Page在就职满周年后，发布了一篇周年回顾及展望未来的文章（2012 Update from CEO）。文中提到一个重要的观点是，通过了解您的身份和关系，为您输入的搜索词赋予一个可能的上下文语境，Google才能为您提供更精准的搜索结果，而不是一个仅仅通过Page Ranking得到的大众化的结果。Understanding identity and

2012-04-07 11:14:39 1887

原创阅读源代码的一些体会

最近一个月的时间，差不多都在看Android 4.0系统和它的WebKit实现的代码。面对庞大的代码库，复杂的系统，从一开始毫无头绪到后来慢慢厘清主要的流程和摸清系统的结构。体会到有一些方法对阅读源代码是非常有帮助的。需要可以编译，运行和调试如果只是光看代码，没办法编译，运行和调试，那对系统的理解总是只能停留在概念性的表面而无法深入。最好是能够下断点和单步跟踪，如果很难实现

2012-03-02 20:12:47 2155

原创 Going Native? Or Going Script?

赖勇浩写了一篇文章，叫做”2012 不宜进入的三个技术点“，其中最后一个就是C++。而陈皓的”Why C++？王者归来“则表达的不同的意见，文中引述了C++界的大牛Herb Sutter的观点，认为随着计算能力再次集中在大公司构建的数据中心里面，而这些公司为了能够节约电力和机器的开销，它们有意愿，也有能力聘请高水平的工程师，使用C/C++这样的本地代码来编写它们服务端的软件堆栈。另外因为移动设备的

2012-02-04 12:29:22 1945 1

原创 Qt 4.6 技术预览版

Qt 4.6 终于出了第一个技术预览版，Qt Creator也出了基于Qt 4.6的预览版。可惜最感兴趣的QML不知道要到那个版本才会正式发布。正在用我的Atom小本编译中，也许一觉醒来，明早就编译完了.................

2009-09-12 03:53:00 1156

错误处理的基础指南

错误处理的基础指南

LCMS色彩转换分析

LCMS Introduction

空空如也