云端架构下的手机浏览器内核演进

标签: 云计算 移动专区 高端视点 移动 | 发表时间:2012-03-06 16:07 | 作者:baiyuzhong
出处:http://www.programmer.com.cn

文/梁捷

自从2011年U3内核发布之后,就有人问我:“在终端性能和网络环境都越来越好的情况下,直接用客户端中的内核去进行解析就可以了,UC何必费这么大劲儿去挑战云端架构下的浏览器内核呢?”

其实浏览器和网络带宽之间相当于车和路的关系。路修宽了并不意味着不会塞车,修路的速度永远追不上人们买车的速度,更小巧和灵活的车永远更受欢迎。这正是我们一直在产品和技术创新上坚持“7S-3C原则”的原因。做移动应用方向上一定要重视“云”(Cloud)和“端”(Client)两种能力。具体到手机浏览器,还要打造自己的内核(Core)技术。

手机浏览器发展到今天,逐渐形成了两大阵营。一类是以Chrome、Safari、Firefox等为代表的阵营,这些浏览器都将内核完全放在终端里,大多使用开源的WebKit内核。这类浏览器的特点是可以高度还原页面特性,能解析渲染出和电脑版浏览器上一样的效果。另一类则是以UC浏览器(U2内核)、Opera Mini等浏览器为主要代表的阵营,采用服务器客户端混合运算(云端)架构,这类浏览器的内核实际在“云”里,是通过服务器对网页数据进行实时压缩处理,然后再下发到客户端,主要特点是可以快速获取页面内容,省钱省电省时间。

云/端架构让“ You Can Web”

2004年当我们决心做手机浏览器开发时,中国的移动互联网产业尚未启蒙。那时手机上网环境恶劣,硬件配置落后、网络带宽不足、标准繁杂不一。在很长一段时间,中国手机上网的数据传输速度基本是在10kb/s左右,主流手机的CPU最高是几百kHz不等,可用的RAM大多是几百KB,操作系统更是繁杂无比,Symbian是属于相对智能的。在这种环境下,使用旧有的设计思路进行手机软件开发异常艰难。尤其是想让手机上网,首先要解决的就是对不同协议网页的解析问题,HTML、WAP、XML、JavaScript等都需要面对。

为了能把产品做出来,我们设计了一种新的浏览器技术架构。与单机版软件不同,这种新架构将大部分复杂的运算放在服务器上完成,这样就可以顺利地在手机上解析Web页面。现在将这种技术架构称之为UC的云/端架构。UC浏览器以前叫UCweb,就是You Can Web的意思。

如图1所示,用户在使用UC浏览器浏览Web网页时,“云”会先将页面内容进行转码和重排。例如当页面出现JavaScript、CSS等手机端无法很好处理的元素时,服务器会采用高容错策略进行自动过滤。当页面需要显示图片时,服务器会根据终端返回的屏幕参数对图片进行匹配压缩。这样手机端需要处理的数据繁杂程度就大大降低,对标准协议的支持也提升不止一个档次。考虑到上网浏览页面的特性,所有服务器处理工作都是实时的,即:基于云端架构的手机浏览器,实际上将自己的一部分内核放在了“云”——也就是服务器里。

图1 U2内核架构

但挑战同时而至,由于手机终端和网络服务器混合运算的手机浏览模式前所未有,对“云”的设计、管理和优化对我们而言也完全是新的世界,其开发和管理的复杂程度大大超过了之前的单机版手机浏览器。比如对于终端和云端的分布式Cookie等会话机制的维护,涉及每台服务器对于会话保存、当服务中断后可跨集群的无缝的恢复、客户端以及服务端生命周期的同步等复杂技术。再比如对于经过中转的性能的保证,要确保单台服务器的单个事务在平均响应1秒以内,包括向网站拿网页、解析、排版、图片处理、会话等复杂过程。

现在回想起来,虽然初期的研发艰难,但正是这种当时看来很冒险的技术架构,改变了中国用户的手机上网体验,培育了中国第一批手机上网用户。后来,很多厂商实际上都采用了类似的架构做手机浏览器。

既在“云”,也在“端”

随着3G和WiFi网络环境日益普及,我们发现原有客户端解析引擎已不足以满足用户的需求。3G网络的上网数据传输速度可以达到数百kbps。主流终端厂商新发布的手机开始使用500MHz以上的CPU,RAM也大都在300MB以上,4寸左右的触摸屏已进入主流人群的手中。人们使用手机的习惯,以及对手机功能的需求都开始发生变化。

另一个重大变化是HTML5。HTML5一个很重要的特点是,要求浏览器能够直接支持以标签形式播放视频、音频,支持用标签形式制作动画等,这对浏览器在本地客户端的支持上提出了一个挑战。

正是预见到了这些可能的变化,我们从2008年起组织了一个单独的团队,历时3年打造了新一代手机浏览器内核U3。U3内核将原先主要放在“云”的页面解析功能,向本地客户端做了相应迁移。

图2 U3内核架构

如图2所示,第三代浏览器的云端架构采用了新的压缩技术——“无损云压缩引擎”,同时对页面的解析和渲染不再依靠服务器,而是依靠U3内核。与U2内核的云压缩引擎不同,无损云压缩引擎不会对页面进行转码,而只对页面中的部分可压缩元素进行处理,发送到“端”之后,U3内核再对压缩过的数据进行解包。可见通过“云”和“端”的能力增强,让使用U3内核的浏览器不仅可以对网页进行无损的完全解析,而且可以实现云端架构独有的省流量、高效等特点。在同等解析效果情况下,可以比不采用无损云压缩引擎的手机浏览器节省一半以上的流量。

U3取这样的架构也是希望能够搭建一个开放的Web App平台。U3可以将一些手机特有的系统功能接口开放给开发者,如摄像头、话筒、传感器、位置信息等。开发者可以直接通过Web方式调用,而无需研发复杂的客户端。这样就可以绕开系统和终端差异,让开发效率更高,更新部署更简单灵活。

浏览器内核之争之我见

在U3内核发布后,一些国内浏览器厂商也纷纷表示要打造自己的浏览器内核。而事实上,大多数手机浏览器产品都是基于WebKit做二次研发。这个问题始终让人一头雾水。

从本质上说,WebKit是由苹果首先推动的开源内核项目,源自于KDE。2005年,苹果宣布将WebKit完全开源。目前还有Google、Nokia、RIM等正在参与和推进WebKit项目。任何人都可以在遵守其协议的情况下将WebKit拿来做二次研发。当前应用于Chrome、Safari和大多数移动设备的系统浏览器内核都是基于WebKit内核开发的。很多国内手机浏览器厂商也都是在这么做的。

由于WebKit的存在,一个新生浏览器的“制作”流程,只需要设计好UI界面,将WebKit进行编译,就可以“做出”一个浏览器。可是仅仅将一个原生内核重新编译,就宣称自己有“自主内核”是不恰当的,这样最多只能起到一种包装作用。这些浏览器的性能仍然会受制于所使用的原生内核。

我认为,一款浏览器产品是否拥有“核能力”,需要考察以下几个实力:跨平台能力、技术创新力、产品国际化能力和安全能力。跨平台能力是任何一款内核级产品所必须具备的能力,可以针对不同的操作系统快速发布拥有一致体验的产品。技术创新力是企业能否针对新的终端特性、用户需求做出的创新性的产品,如无损云加速、系统自适应能力、语音控制等。

毫无疑问移动互联网是未来十年成长速度最快的行业之一,浏览器是这个行业中为数不多的平台级产品。作为一家源自中国的技术公司,我们希望能用我们的技术实力为中国的互联网公司在全球拼出一片市场。我也期望所有的浏览器公司都能多在自己内核上下功夫,打造真正的“核能力”。

 

作者梁捷,UC(优视科技)技术总裁。1998年毕业于华南理工大学计算机专业,后长期耕耘于中国的电信和互联网市场,在电信及网络计算领域拥有超过10年的技术研发和管理经验。

 

本文选自《程序员》杂志2012年03期,更多精彩内容敬请关注03期杂志

《程序员》2012年杂志订阅送好礼活动火热进行中

相关 [云端 架构 手机] 推荐:

云端架构下的手机浏览器内核演进

- - 技术改变世界 创新驱动中国 - 《程序员》官网
自从2011年U3内核发布之后,就有人问我:“在终端性能和网络环境都越来越好的情况下,直接用客户端中的内核去进行解析就可以了,UC何必费这么大劲儿去挑战云端架构下的浏览器内核呢. 其实浏览器和网络带宽之间相当于车和路的关系. 路修宽了并不意味着不会塞车,修路的速度永远追不上人们买车的速度,更小巧和灵活的车永远更受欢迎.

文章: 手机QQ浏览器技术架构

- - InfoQ cn
编者按:由InfoQ主办的 全球架构师峰会将于2012年8月10日-12日在深圳举行,为了更好地诠释架构的意义、方法和实践,InfoQ中文站近期会集中发布一批与架构相关的文章,本篇即为其中之一. InfoQ也欢迎读者亲身参与到本次 全球架构师峰会中,与来自国内外的顶尖架构师进行面对面的交流. 支付宝与乌云分享架构安全设计指南.

Shopee x JuiceFS:ClickHouse 冷热数据分离存储架构与实践 · JuiceFS 博客 - 面向云端的 POSIX 共享文件系统

- -
转载声明:本文转自 Shopee 技术团队微信公众号. Shopee ClickHouse 是一款基于开源数据库 ClickHouse 做二次开发、架构演进的高可用分布式分析型数据库. 本文将主要介绍 Shopee ClickHouse 的冷热分离存储架构和支持公司业务的实践. Shopee ClickHouse 的冷热分离存储架构使用 JuiceFS 客户端 mount 远端对象存储到本地机器路径,通过编写 ClickHouse 的存储策略,如同使用多卷存储一样使用远端对象存储.

架构

- - IT瘾-dev
网关:Nginx、Kong、Zuul. 缓存:Redis、MemCached、OsCache、EhCache. 搜索:ElasticSearch、Solr. 熔断:Hystrix、resilience4j. 负载均衡:DNS、F5、LVS、Nginx、OpenResty、HAproxy. 注册中心:Eureka、Zookeeper、Redis、Etcd、Consul.

在云端

- Linker Lin - YesKafei Daily
腾云驾雾的旅行似乎就要实现了. 每次搭乘航班,都会选靠窗的座位,为了欣赏永远看不厌烦的云层. Passing Cloud 仍然是一个飞艇的概念,他是由多个尼龙气球支撑的不锈钢结构. 但与飞艇不同,它没有内部空间,乘客通过楼梯爬上“云层”顶端,在寒意中欣赏旅行中的云层和地面. Passing Cloud 没有自身的动力,只依靠风速和风向.

信息架构

- Michael - Tony-懒得设计
写几篇关于信息架构的文章,系统地输出我理解的信息架构. 发了一篇关于招信息架构实习生的博客,收到不少简历. 但谈起信息架构,多数不了解,稍微了解的扯了很多很偏的东西. 随手搜索了一下,我发现了原因:. 1 《web信息架构》这本书太概念,太学术. 2 有人绑架了“信息架构”这个词,拿出去唬人,内容都是皮毛或者是根本和信息架构不沾边的东西.

CSS架构

- - 博客 - 伯乐在线
英文原文: CSS Architecture,编译: CSDN-张红月. Philip Walton 在AppFolio担任前端工程师,他在Santa Barbara on Rails的聚会上提出了CSS架构和一些最佳实践,并且在工作中一直沿用. 擅长CSS的Web开发人员不仅可以从视觉上复制实物原型,还可以用代码进行完美的呈现.

Linux的架构

- - 博客园_首页
作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明. 我们以下图为基础,说明Linux的架构(architecture). (该图参考《 Advanced Programming in Unix Environment》). 最内层是我们的硬件,最外层是我们常用的各种应用,比如说使用firefox浏览器,打开evolution查看邮件,运行一个计算流体模型等等.

LMAX架构(转)

- - 企业架构 - ITeye博客
LMAX是一种新型零售金融交易平台,它能够以很低的延迟(latency)产生大量交易(吞吐量). 这个系统是建立在JVM平台上,核心是一个业务逻辑处理器,它能够在一个线程里每秒处理6百万订单. 业务逻辑处理器完全是运行在内存中(in-memory),使用事件源驱动方式(event sourcing).