关闭

[置顶] 浏览器渲染流水线解析与网页动画性能优化

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

[置顶] How Rendering Work (in WebKit and Blink)

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

[置顶] High Performance Canvas Game for Android(高性能Android Canvas游戏开发)

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

[置顶] 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...
阅读(3518) 评论(0)

浏览器渲染流水线解析(四)

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

浏览器渲染流水线解析(三)

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

浏览器渲染流水线解析(二)

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

浏览器渲染流水线解析(一)

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

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

WebView Ancestor View 不可见/可见 WebView 不可见/可见 WebView Window 不可见/可见 WebView Detach/Attach WebView Pause/Resume  系统 WebView (Android 5.0+) 没有影响 没有影响 更新 WebView 可见性状态,影...
阅读(582) 评论(0)

对页端开发高性能(交互/动画) Mobile WebApp 的一些思考

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

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

写一篇流水账,记得什么就写什么,大概就是参加 Google 开发者日,与开发者关系团队交流的一些内容和想法的记录。...
阅读(615) 评论(0)

手机腾讯网渲染性能分析

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

Transform Animation, Inline Transform and Overlap

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

Page Rendering - Main Frame and Impl Frame

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

理解 Embedder,理解 Chromium 的系统层次结构

理解 Embedder,理解 Chromium 的系统层次结构标签: Chromium作者:易旭昕在 Chromium 官方的文档里面,我们经常会看到 blink’s embedder 或者 content’s embedder 这样的称谓,理解 embedder 的概念,对我们理解 Chromium 的系统层次结构是十分重要的。...
阅读(1926) 评论(1)

Chromium 代码研究的一些感想

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

Debugging of Chrome Android WebView

Debugging of Chrome Android WebView Chrome Android WebView Debugging 作者: 易旭昕 (@roger2yi) 本文主要描述如何将 Chrome Android WebView (下文简称CAW)的代码从 AOSP 中抽离出来,编译成独立的应用,方便对 CAW 的 Java/C++ 代码进行跟踪调试。 相...
阅读(3706) 评论(0)

关于 Apple Metal API 的一些想法

在看完 Metal 的开发文档后,除了官方所宣称的一些优点外(比如说更容易理解和使用的 API,更直接和精细的硬件控制,减少 GPU 使用过程中的 CPU 额外开销等等),从我有限的 GLES 开发经验看来,以下一些方面更让人兴奋。 更方便和友好的多线程 GPU 渲染支持 GLES 的设计,所有东西都必须跟一个 GL Context 绑定,由 GL Context 内部所控制的状态机驱使,...
阅读(4176) 评论(2)
71条 共5页1 2 3 4 5 ... 下一页 尾页
    个人资料
    • 访问:242310次
    • 积分:3328
    • 等级:
    • 排名:第11225名
    • 原创:69篇
    • 转载:0篇
    • 译文:2篇
    • 评论:99条
    文章分类
    最新评论