浏览器的那些事

Chrome对GPU的使用–(3)网页的加速合成

网页渲染是浏览器内核最基本的任务,这一篇让我们研究一下,Chrome是如何利用GPU对这个过程进行加速的。

Webkit渲染基础

首先,来回顾一下Webkit内核的网页渲染流程。当Webkit拿到网页数据后,会根据网页结构生成DOM树,然后每一个DOM节点会生成对应的RenderObject,构成另一棵树RenderObject Tree。那些在同一个CSS转换坐标系下的节点,会被合并到一起,构成一个RenderLayer,像一些半透明的、独立CSS Filter的、Canvas、Video等有特殊渲染需求的RenderObject会生成单独的RenderLayer。关系如下图: read more

Continue Reading
浏览器的那些事

Chrome对GPU的使用——(2)底层实现

这一篇,我们来研究一下GPU进程的实现细节,首先是GPU对外暴露的接口形式:
GPU Command Buffer
在GPU独立进程的架构中,Command Buffer作为GPU Server 与 Client的通信协议扮演着重要角色。它将对GPU图形接口(OpenGL ES 2.0)转化成一条条命令,用来支持跨进程调用。提高了GPU调用的安全性、通用性、和并发性。其定义的协议与直接调用GPU图形接口相比,裁剪掉了一些不通用的特性,例如GLSL的高级特性。同步改为异步,这种改造对glUniform 、glDrawArrays这种比较费的接口效果尤为明显。这样,就大大提高了GPU的并行程度,而这恰好比较适合GPU的特性——善于处理并行任务。
Command Buffer本质上是一块共享内存,用于跨进程传输数据,根据OpenGL ES2接口的不同,有三种方式:
1、直接通过Command Buffer传输,这种直接将调用参数写到Command Buffer,由于Command Buffer有固定的长度,因此,参数的数据量不能太大,像glBlendColor这种调用可以采用。
2、通过共享内存,当调用需要传输大数据时,例如传送图片。就会先将图片数据拷贝如Shared memory,然后用Command传送shared memory id和便宜即可。
3、抽象的bucket,这个实际上是对共享内存的封装,它要解决的问题是如果需要传输大量数据,而shared memory不能一次传输时,bucket可以用多次传输的方式完成。而对我暴露的接口时一次调用完成的。使用起来比较方便。
下图是一个典型的跨进程调用结构: read more

Continue Reading
浏览器的那些事

Chrome对GPU的使用——(1)总体架构

GPU在Chrome中扮演着重要的角色,主要体现在两个方面:对WebGL的支持和加速绘制的合成。我们将从几个方面来看一下Chrome对GPU的使用:

1)Chrome中GPU部分的总体架构,弄清楚GPU是如何整合到Chrome的整体结构的。
2)底层实现,学习Chrome是如何将GPU封装成平台无关的Command Buffer提供给上层使用的。
3)网页绘制中的加速合成,理解GPU是如何在网页绘制中起到加速效果。

先从第一个开始。Chrome采用了独立的GPU进程结构,如下图: read more

Continue Reading
浏览器的那些事

浏览器的那些事(7)——新交互方式的尝试

一直在思考一个问题,浏览器越做越雷同,按钮,地址栏,Tab,已经定型,而且屏幕空间要更多的让给页面显示。这样,留给设计师的空间越来越小。 有没有什么方法能突破这些限制?在我平常用来做研究的demo上,做了一下新交互方式的尝试。 先上图: ibrowser_2 尝试思路: 一、蒙层UI 1、除去主界面的所有UI,这样就给页面显示让出了最大可能的空间。 其实,在用户浏览网页的绝大部分时间内,这些UI是没有用的,既然没用又为什么摆在那里占地方呢? 工具不用的时候可以收到工具箱里,但我们浏览器的工具就一直摆在桌面上。而且在一段历史时期内,我们还以桌面上的工具多为荣,这不科学! 2、把UI元素放在一个半透明的蒙层窗口上,当用户需要的时候,就用快捷键或者鼠标手势调出来。而且透明度可以通过鼠标滚轮调节。 当我把几个常用的UI元素放到这个窗口时,第一感觉就是:天地广阔兮,无所适从! 太开阔了,以至于大到不知道该怎么摆了。我Hold不住是因为我水平不行,但是我相信有水平的设计师会有如鱼得水的感觉。 3、可以看到,蒙层窗口上也是一个内核窗口,上面的UI元素全是网页。 这就意味着可以用方便快捷的Web开发UI! 这意味着可以把UI配置到线上! 这意味着换一套皮肤就是换一个网页! 这意味这全网页的显示可以让皮肤拥有无尽的可能! 4、取得上面的优势是有代价的,那就是用户需要多一步操作。因此需要将这一步的成本尽量变低。现在用的是,快捷键 或者 鼠标手势。可能有更方便的途径,可以再探索。 5、第一界面既然没有UI,那鼠标手势就成了必须之物,要是之成为习惯。如果实在适应不了,那还是换个浏览器吧。 6、这中交互在平板或者移动设备上,或许优势更大一些。手机上的浏览器非常困惑我一点的是UI太小,手指头经常戳不到位置。 这种交互方式将不存在这种问题,因为UI可以做的很大。而且用手指实现手势,用起来更方便。想调UI出来就画个圈圈诅咒你! 7、一旦UI的大小和数量被解放出来,我《工匠模式》那篇日志提到的小众浏览模式,就可以很方便的实现。在蒙层UI上可以实现各种特定的功能。 可以在音乐模式上做一个酷酷的调音UI,甚至DJ打碟机。在游戏模式的UI上方很多实用的小工具。等等等等,而且切换模式就是让蒙层UI上换一个页面的事! 二、Tab染色 要说去掉所有UI也不现实,因为有一种按钮去不掉,那就是Tab按钮,且换Tab还是保持原来的一步到位要好一些。 但是,我对Tab做了一些改动,上图: ibrowser_1 那就是为Tab染色,根据不同的host,将Tab染成不同的颜色,这样,用户在切换标签叶时,类别更加清晰更加直观。 1、人对颜色的敏感度要先于文字,因为文字是需要一个阅读+理解的过程。虽然最后选中具体的Tab还是需要读Tab上的标题,但是至少可以先根据颜色排除掉一部分不需要读的。 当然,这是一个瞬间过程,不容易体会。 2、每当我看到行政小姑娘桌子上贴着各色Tab的材料时,都会感受到一种纷乱又有序的美。或许是姑娘的美被转移了,但这不重要,我想把这种美表现出来,传达给用户。 于是,我觉得浏览器的Tab也应该是这个样子的,用另一种方式为你的网站归类! 3、如果你问我,Tab为啥要用不同的颜色,我会问你,为啥要有同一种颜色? 仅仅是个demo,也是业余时间做的,还不太成型。但这些尝试和思考,会持续下去。
Continue Reading
浏览器的那些事

浏览器的那些事(6)–QQ浏览器的登陆方案

今天早上让老婆的吹风机吵醒了,看了下贴吧,看到了这个消息 QQ浏览器内测新功能:支持Chromium组件 http://tieba.baidu.com/p/2357480980 立刻睡意全无,在我前面的blog里提到过,QQ在第七代推到重来之后,一直走的是单核路线。把工作重点放在了追求用户基础浏览的体验上。从外表看来,他们采用的是windows比较原生态的技术框架。因为这样不需要连接那么多外部库,安装包可以做的很小。跟chromium更是扯不上任何关系,如果想在这种框架下植入chromium内核,是一个很费力的事,这不太符合QQ的一贯作风。因此猜到他们可能采用了一个取巧的技术方案,那就是chromeframe。 http://code.google.com/chrome/chromeframe chromeframe是google为了抢夺ie的市场而打造的利器,把chrome包成一个IE BHO插件,插入到IE中。当用户开启这个插件后,chrome就会在IE上替代ie内核渲染。虽然这种强奸式的攻击方式很犀利,但是在国内市场不太奏效。首先,官方下载被墙了,其次,可能是因为法律上或者其他原因,即使安装了,开启也很费劲。但是这个方案很适合像QQ这种以IE内核为基础的浏览器植入,不需要触动原有框架的根基,只需要把chrome当作一个内置的BHO插件打包进来就可以。当然,要加入智能切核之类的功能,也是需要做一些工作的。 从床上爬起来,装了一个网友分享的版本来验证一下我的猜想。 1、安装包还是原来的4M,并没有增大,那一定是采用后安装的方式。默认并不开启这个功能,而是当作一个扩展工具,要用户手动开启。 qqbrowser_chromeframe_2 2、点击安装之后,会把这个组件下载到%appdata%TencentQQBrowserChromeTab,其实就是个完整的chrome。安装完了,他们竟然在用户桌面上生成一个chromium的快捷方式,不知道是出于厚道,还是其他什么原因。 qqbrowser_chromeframe_3 3、粗略观察了一下他们的进程模型和窗口结构,果然跟chromeframe一模一样 qqbrowser_chrome_frame qqbrowser_chromeframe_1 4、试了一下银行网站,他们会自动切换成ie内核,看来智能切核的工作还是做了,但是没有找到手动切换的入口。 他们的做法跟猎豹恰好相反,不过都是以其中一个内核作为基础,插入另外一个,这种“偏特化”的方案可能是最省力的。既然是内测,这应该还是一个不太完善的方案,入口还是比较深只适应高端用户。QQ7刚推出时,一度以为他们要放弃在chrome内核的世界登陆,而是只把IE内核的用户体验做到极致。 看来,跟世界接轨还是必要的。
Continue Reading
浏览器的那些事

浏览器那些事(5)——工匠模式

1364434638286 老罗的锤子发布了,说好说差都有理由。在这不再评论了,老罗将自己比作手机的“工匠”,这个比方让我产生了一些联想。 一直以来,开发浏览器的一个比较重要的思路就是不断扩充浏览器的功能。在浏览器上可以有邮件提醒、截图、游戏、电视剧、刷微薄、刷火车票、听音乐、存文件….等等的功能。甚至为了堆积更多功能,浏览器都会有开发的扩展体系,让第三方也参与到功能的开发中。我们的产品决策者无法弄清楚哪些用户需要哪些功能,就用了最省力最保守的办法——这些功能都给你,你们自己选吧。这是一个很挫的做法,理由有2 1、选择太多等于没有选择 今天看了一篇文章《网络让我们变蠢了?》http://djt.qq.com/article-434-1.html?ADTAG=email.InnerAD.weekly.20130331 有一个论点我是深信不疑的,那就当信息多到你无法甄别出有用的那一部分,也就等于没有信息。浏览器的功能也一样,IE的BHO不计其数,Chrome的扩展已经堆满了应用商店,国内浏览器也把内置玲琅满目的功能作为了卖点,其实用户真的需要吗? 一个网民的上网习惯稳定下来之后,使用浏览器的需求也会收敛到一个很小的范围里。 以玩网页游戏为主的用户,可能永远也用不到邮件提醒。 酷爱音乐的用户可能更希望把音乐的入口放在明显的位置,而不是小说。而且他们希望有更优质的音源和播放体验。 对热爱摄影和秀图的用户来说,集成一些图像处理能力,会显得更有意义。 …… 而即使我们有能力把这些功能都做好,用户从如此多的功能里面让用把真正需要的功能挑拣出来,本身就是一个很大的负担。 2、傻大全就无法做到精致 相信无论多大的公司,它的资源和优势都是有限的。要想做好一件事,必须做到集中精力。如果想用散兵游勇打游击的形式做功能,用一两个程序员去开发一个功能,开发完了就不再深加工,转战下一个。这种模式是无法打造出精致的体验的。最后只能做到满足基本“傻大全”,啥功能都有,啥功能都不好用。 温饱思“淫欲”,浏览器做到这个程度,满足本能的、基本的需求已经不是问题了。下一步的目标应该是把使用浏览器的体验做成一种享受,不同用户群,不同爱好者的享受。而这一个目标不应该是一个公司,一个团队的目标。再牛逼的产品经理恐怕也不能理解所有爱好者的情怀。 这种目标的实现依赖于另一种的开发模式,或者说生态系统。下面开始意淫: 未来的浏览器生态系统 未来的浏览器开发会更加趋向专业化,就像由两种内核分化出不同的浏览器产品来一样,浏览器本身也会产生再次的分化。而分化的依据就是用户群体。 浏览器会有两种形态,由一些大公司负责产出满足基本需求的浏览器母体,所谓的基本需求就是我们现在看到的一些浏览器厂商的主打特性:高效、安全、稳定、扩展性等等。到那个时候,这些已经不再是浏览器的亮点,而是对浏览器最基本的要求。但要实现这些并不容易,需要由这些有实力的大公司来不断维护、完善。 最终安装到用户机器上的版本应该是根据不同的用户群定制的版本,一些在某些领域更加专业的小公司或民间团体负责这些定制版本的开发工作。他们对这个领域会更专业、更有热情、更懂他们的目标群体。 例如:音乐爱好者会以发烧友的标准来打造浏览器,会集成专业的播放器带来更好的播放体验,会推送优质的音乐资源和社区入口,会更方便他们在音乐爱好者这个圈子里的交流。还有游戏圈、摄影圈、小说圈、购物圈…..总之,一旦用户被圈定范围,那目标就会更明确。 这些小团体会通过这个浏览器构建自己的盈利模式,从而在圈子内产生小的生态圈。例如:目标更明确的广告投放,为匹配类型的Web服务提供商的推广导流,Web服务的合作运营等等,都可以养活这样一个小而精的团体。而这些以兴趣结合在一起的团体干的会更加舒心。 对于开发母体的大公司,他们可以在互联网的大生态圈获利。像百度的搜索,腾讯的增值服务,淘宝的电子商务。这样围绕浏览器就会产生一个兼有大、小生态圈的生态系统。当然,在利益面前一定会有破坏生态系统的行为,但是我觉得通过长期的博弈会达到理想中的平衡。 用户群体会有交叉,这是肯定的。但是如果体验足够好,我宁愿多装几个浏览器,或者在同一个母体上进行模式转换。相当于在手机上多装了几个可以上网的APP而已嘛。 我在《浏览器的那些事》第一篇里说过,浏览器的一大特点就是通用性。因此开发浏览器的一个惯性思维就是要通用,希望能够让自己的产品适合所有的用户。如果把浏览器当做一个浏览网页的工具,那只要做到普适的高效、安全、稳定就可以了。但是如果把浏览器看做一个网络服务的延伸,要用功能打动用户,那做到这些是远远不够的。还要像顶级工匠一样把体验做到极致,而这一切要想长久,就需要演化出一个上面提到的生态系统。 PS:同事推荐了一个iPad上的看片利器——多屏互动浏览器。这个东西尽管不太成熟,但我觉得思路是对的。
Continue Reading
浏览器的那些事

浏览器的那些事(4)—关于切核

115025177_11n-1-300x217

首先热烈祝贺习总书记当选国家主席!一定要紧紧的团结在以习主席为核心的党中央周围,做好浏览器!

————–以下是跟我有关系的———————————————— 在前面的文章里,我已经吐槽过关于双核的看法。这篇说点细节的东西。 由于国产浏览器是起源于对IE控件的包壳实现的,所以Webkit当年是作为一个“高级货”引进而来,于是就产生了“高速内核”这个概念,于是同时拥有Webkit和IE内核就成了国产浏览器的标配。随着Chrome的崛起和微软的日薄西山,Webkit这个后来者渐渐的取代了原来IE的主力位置。像360,猎豹都已经将Webkit作为默认内核使用。而IE就成了为支持网银等老古董才有辅助内核了。 切换内核的策略这几家浏览器大同小异,首先,切换内核有两种形式——手动切换和自动切换 先说说手动切换: 早期的切核形式就像搜狗和傲游,在地址栏的右侧有一个按钮,上面用一个闪电和IE图标区分内核类型,只要点击一下就可以切换内核。后来出现的双核如360极速和安全浏览器6.0以后的版本,交互增加了一步,点击按钮后会先弹出如下图的选择菜单让用户选择内核类型,猎豹干脆把切核操作放到了右键菜单中。 关于切核 为什么会出现这样的变化呢? ———–以下全是猜测———————————– 首先,是双核的地位:当这个概念刚刚推出的时候,是作为很大的亮点力推的。像搜狗就用了很多推广资源来描述双核有多好,所以,他们希望用户能够尽可能方便的使用这个特性。因此在地址栏这样一个重要的位置上,加入一个点击一次就可以响应的入口。但随着产品的演化,人们发现双核的优势并没有那么大,而且在用户实际应用的时候,应该很少有人回去手动切来切去。双核手动切换的功能回归到它应有的地位上——一个不常用的功能而已。 还有,细究搜狗这种切核按钮的交互,其实这是一个很傻的设计。一个按钮上表示了一个内核类型,作为用户会有一种困惑:到底这个按钮是说当前的内核类型是IE呢还是我点了这个按钮之后会是IE?当然,搜狗的答案是前者,他表示了当前的内核类型。 搜狗切核按钮 搜狗切核按钮 但是我们来看看我们最常用的按钮:  播放器按钮3播放按钮 还有我们常用的按钮,例如播放、暂停、保存、提交、关闭……。你会发现,所有的Button都有一个共性,那就是上边的文字或者图标表征的都是点击后的状态。而什么控件是用来表征当前的状态呢?我们可以从最原始的Windows控件里面找,会发现一个最常用的——Select,也就是选择框。这也就是360的选择,也是最符合传统交互习惯的选择。另外,为了让用户能够理解,搜狗使用了鼠标指上后的Tips来解释,但谁又愿意盯着你的Tips去弄明白啥叫双核呢? 最后,从技术上讲,切核操作需要将原有内核停止、销毁,创建新的内核并同步原有内核的状态。这个过程是比较复杂的,如果快速不停的切换,内核状态很难维护。而在其中增加一个交互步骤,回避了很多有此带来的技术难题。 所以,360采用了另外一种交互,点击以后先弹出一个框,让用户做单选题。这个框有两个作用: 1、为手动切核增加了一步,减少了用户由于误操作而造成的手动切核,而且增加难度也预示着不鼓励用户进行手动切核。 2、在弹出的框中做充分的解释,这种解释效果要比Tips强100倍。猎豹做的更绝,直接藏在了右键菜单里。意思更是不言而喻。 再说说自动切核 自动切核才是双核浏览器中比较重要的部分,自动切核的策略决定了页面的内核类型,手动切核只不过是留给高端用户的万不得已的选择而已。自动切核的策略大家都差不多,一般都是在访问一个页面时,根据不同的优先级来决定这个页面应该用什么核打开。 第一优先级应该是手动切核的结果,用户手动切过核,那就把结果记下来,下一次打开会用户的最后决定选择内核类型。之所以这么做,是为了尊重用户的选择,人家就是想用这个内核打开这个页面,浏览器要记住。但是也有副作用,例如有的用户都不是本着这种目的点的切核,只是想点点试试,或者是误操作。也会按照这个决定访问页面。这样就很有可能出现用Webkit访问网银页面,不能支付。而这类用户往往又不了解双核的概念,事情就变的很麻烦。这也是为啥手动切核入口要深一些的原因。 第二优先级一般都是靠网址列表判断的,像网银类的这些“老古董”网址会收集到IE内核列表中,如果网页符合这个列表的规则,那就会自动切换到IE内核上。而这一层的用户体验拼的就是谁的列表更加细致,这才是对普通用户最有用的部分。 列表以外网址应该选择一个默认内核,这就取决于具体浏览器的决策了。像360、猎豹这种拿Chrome改出来浏览器当然默认是Chrome(Webkit)内核,比较保守的浏览器一般会选择IE作为默认内核。
Continue Reading
浏览器的那些事

浏览器的那些事(3)

3、烽火诸侯  浏览器之争硝烟正劲,来说说弥漫在战争迷雾中的各路诸侯吧。 360 上一篇说道了,360已经成为了国内浏览器的一把手。能做到这一点确实不容易。首先,作为安全起家的公司,客户端的技术实力自然是一流的,敢跟腾讯叫板就说明了这一点。其次,360在浏览器上的产品策略也是很有意思的。他以“安全”为主题主推一个单IE核的浏览器版本,这个版本从里到外透着四个字“实用主义”。问大家一个问题,如果你费了九牛二虎之力研发了一个产品,会不会把别人的logo改个颜色就当成自己的logo?你肯定不会,因为毕竟他倾注了我们团队的心血,我们当然会有自己的想法浓缩成logo,展示给用户。就像自己生的孩子能取个别人的名字吗?人家360就越过了这个心理障碍,就用IE的图标改成绿色,原因也很容易想。很多普通用户都不知道浏览器是个啥东西,他就知道点那个“大e”就能上网。绿色的“大e”和蓝色的“大e”都是“大e”。这样,新用户对360浏览器的认知成本就降了很多。这个版本他们更注重的是“安全、稳定”。对新技术的投入也是围绕着这两个特点,像自带IE8核、防假死等,他们比较用功。而对于另一些技术如双核、HTML5、硬件加速等都没有在这个版本上得到体现。 有普通用户就有高端用户,这个群体更喜欢尝试新生事物,更追求简洁、美、速度、扩展性等等。360用另一个版本来满足这种用户的需求——极速版。这个版本拥有高端用户想要的一切,因为他就是一个装置了IE内核的chrome。这是一个既省力又见效的方案,我们后面会说。但360有一点做的比较厚道,就是在关于对话框里保留了对chromium社区的感谢,这点比金山强。 安全啊,安全,要说生活在丛林般的社会里,谁又不看重安全呢?今天你安全了吗?360的安全套装真的适合每一个人吗?那也不见得。想我们这种天天生活在网络上的老油条,其实受骗的可能性很低。不仅不会随便支付,连骗子发来QQ让我充值我都要泡他一会,不骗别人已经不错了。至于木马,我们想想当今还有那些需求这些大公司的软件和Web应用满足不了呢?非要去下一些小网站或者安装不知名的盗版软件?只要保持警觉,再加一个非IE内核浏览器。其实真的没必要杞人忧天。 再者,最近360也陷入了“隐私门”,有人说他们收集用户数据,还有每隔5分钟就会收一道圣旨,在你机器上干任何事。当然我没有去研究过360到底是不是干过这些事,但是可以肯定的是他们有这个能力。而且又无法自证清白,这个事就比较难办。除非公开源代码,但这恐怕也突破了他们的接受极限。他们现在是通过让政府部门托管源代码的方式证明,这个办法也不见得有效,政府办事,谁又说得清?哎。 腾讯 要说在腾讯在客户端软件上的实力,那是见谁灭谁,唯独在浏览器的称霸之路上显得比较坎坷。从最初的TT,到QQ浏览器,再到推到重来的QQ7,一路走来,磕磕绊绊,直到现在也没有完成像其他客户端软件那样的霸业。这个从侧面也印证了我上一篇日志中说的“做好浏览器,真的不容易”。我开始关注浏览器是从他们的QQ浏览器开始的,这个版本应该是由腾讯研究院受命开发的。在架构上也采取了当时比较流行的双核多进程。第一眼看去做的比较花哨,增加了侧边栏加入了很多腾讯的已有服务入口,像QQ空间等等。可以看出其产品思路就是想把腾讯的一站式服务入口集成到浏览器上,这样用户可以更快速的一键直达,而且可以在上网的同时收到服务端推送的信息。但从效果上来看,用户并不太买账。我也想了这么几个原因:1、浏览器的核心体验不够好,后面我会提到,双核是一个大坑,特别是把Webkit插入到自己的框架内的这种做法,想在短时间内做好很不容易。记得我在处理一些内核相关的Bug时,总是喜欢看看其他产品的表现,发现当时我们产品有的问题,QQ浏览器基本上都有。也就是说,他们并没有花费太多的精力去填平这些有关浏览器核心体验的坑。2、集成腾讯服务入口的吸引力值得商榷,我们来思考这样一个问题,用户真的需要一个浏览器的入口直达QQ空间吗?或者用户真的需要QQ空间的信息提醒到浏览器上吗?其实也不见得,要怪就乖QQ的体验做的太好了,大家已经习惯了以QQ上的按钮作为入口,而这样只比直接在浏览器上点击增加了一步把QQ唤出的的过程。习惯,是一个很顽强的敌人,要想消灭他,就要耐心培养。但QQ浏览器的基础体验又不能支撑他们在用户机器上待那么长时间。 今年,在腾讯内部的大动荡中,他们做了一件很有勇气的事,至今也让我很佩服——推到重来。无线部门接管了PC浏览器的开发,而不再属于腾讯研究院。从产品思路上就做了很大的调整,技术架构当然也全推翻了。然后推出了新版的QQ浏览器7。为啥说这需要勇气呢?因为就一个大工程而言,如果不小心做烂了,人们的习惯性做法是亡羊补牢。因为如果要推翻,那就要有人为浪费的资源负责任,就要走人。这个也是谁都不愿意看到的结果。所以,最中庸的做法就是修修补补,不断改良而不是革命,直到发现已经走不下去了。无论是技术工程,还是政治工程,道理都一样。单从QQ7这款产品而言,我个人是比较欣赏的。因为他们的产品思路很清晰,吸取了上一个版本的教训,就是主打浏览器的核心体验,稳定、快速。其他乱七八糟的功能和花里胡哨的界面先往后放。因为这些东西对任何一个大公司都不是难事,而打磨核心体验确是真正要下功夫的。当时Beta版出来之后,我也做了一些拆解分析,细节可以以后再讨论,提几个有意思的点:回归单IE核安装包4M,UI绘制很快,防假死比较到位,仿office的地址栏便捷按钮很便捷。 另外,对所有的竞争对手来讲,腾讯的浏览器是一个暗藏杀机的对手。他们的杀手锏就在于他们的推广渠道。之所以一直藏而未露,我想是因为他们一直没有产出一个自信的产品。一旦有了,那可能对整个浏览器市场又会带来一场动荡。 路对了,很重要。怎么走,次之。 搜狗 曾经看过一篇文章,说搜狗浏览器是王小川想借输入法推搜索的一个桥梁。这个说法从战略上讲是说的通的。但是从搜狗在浏览器上下得功夫上讲,这玩意没有“桥梁”那么简单。用一句话来为搜狗浏览器定个调:他们做的很用心。有好多浏览器中的概念是从搜狗浏览器上第一次看到的,尽管不一定是他们先做的。像双核、视频弹窗、教育网加速等等。 在这里我主要想说说双核。作为国内第一个发布双核浏览器的厂商,这个特性一直是搜狗引以为傲的。直到双核遍地的今天,他们的欢迎页依然是在重点突出“双引擎”。给人的感觉是浏览器内核跟汽车引擎一样,两个当然要比一个好。其实,这里面的真实情况是值得讨论的。搜狗最初的结构是把的Webkit内核引入了浏览器中,当然技术架构也一直在沿着这条路走。其实这是一条不平坦的路,真正尝试过这么做的人就明白其中的艰辛。IE跟Webkit虽然都是浏览器内核,其中的概念也是大同小异。但是无论从接口还是从一些细节的设计理念还是有很大差别的。如果要把两种内核有机的包装起来,向上提供一个内核无关的接口,就要对两种内核有比较深入的了解,还要对其中的不同点做很多处理,举个很小的例子:浏览器的前进后退列表,两个内核的处理细节上就有很大的区别。只有不懈的研究、尝试、填坑,才能搞明白这些东西。这也就是为什么双核浏览器更需要耐心打磨的原因。它带来的复杂度并不是单核的两倍,而是很多倍。我之所以说搜狗做的很用心,就是说他们的这些坑填的还算不错,有好多问题都已经解决了。 关于双核的种种,接下来我想单独写一篇详细说说,在这里我想说的是,双核对用户而言其实重要性并不高,因为用户并不关心页面是用哪个内核渲染的。可以从用户点击双核切换的数量上看出这个结论。而且渲染速度上的差异,需要先解决网络速度这个主要瓶颈之后才能表现的更明显。 尽管选的是一条不平坦的路,但他们一直在坚持。还有,他们还没有上市,那帮年轻人还有梦想。有梦想,能坚持,嗯。 遨游 将浏览器内核包壳,重新设计UI交互,遨游这种产品形式最早受益者。在这些大公司发力之前,遨游也是火极一时。像鼠标手势,同步收藏,这些功能也是最早从遨游身上看到的。从这个角度上讲,现在国内搞浏览器的人应该向这些前辈们致敬。不知是公司运营的问题还是其他原因,在各大公司把浏览器定位为战略级产品后,遨游就漫漫被淹没在红海中了。记得当时在Gameloft实习的时候,跟遨游在一个楼上,去偷偷瞄过一眼才发现,原来公司这么小,对比当时遨游的用户量,立刻对他们肃然起敬。 后来浏览器的发展,应该说遨游从技术上都没有落后。我觉得他们应该是输在资本和渠道上。可能是他们把过多的精力放在了技术上,如果公司没有很好的商业模式做支撑,这么做是不明智的。就像前段时间他们把主打点放在了HTML5跑分上,最后竟然魔杖到了作弊的程度,仅仅把Webkit的接口打开,没有实现去骗HTML5Test页面,最后让人家给列入了黑名单(还有搜狗)。在HTML5还没有广泛应用的今天,能做出这样的决策,那决策者对技术得痴迷到什么程度? 长江后浪推前浪,要想不被拍在沙滩上,除了先知先觉,还要懂得转弯。 金山 要说国内客户端最老牌,最有功底的应该算金山。猎豹浏览器是付盛接手金山网络后的一个力作,当时一推出让我感觉眼前一亮。虽然一眼就能看出是拿chromium改的,但是在包装上做足了文章。从宣传视频到安装界面,再到UI展现,都很用心。如果把猎豹浏览器比喻成一个女人,那么她打扮的很妖艳,但是不耐看。试用了不长时间就有点厌烦了,UI虽然很炫但是不够精致。内核的内力也不够纯熟,问题比较多。最让我感到不满意的是关于对话框竟然没有对chromium社区的感谢。太不厚道了。 作为后来者,他们选择了一条很聪明的路。集中优势兵力消灭敌人,这是一款面向高端用户的产品。但是需要注意的是,高端用户对道德有更高的要求。 其他 阿里云神马的,不说了,都是浮云。
Continue Reading
浏览器的那些事

浏览器的那些事(2)

2 兵家必争之地 要说PC端上竞争最激烈的软件,那肯定是浏览器。放眼大大小小的互联网公司,无论是否擅长客户端软件,必做的一个软件就是浏览器。原因其实不言自明,他是互联网的入口。只要占据了这个入口,接下来产品上的战略部署就水到渠成了。 目前来看,从这个点上的最大获利者是360。浏览器不仅可以通过通过自带的默认导航导流量,而且能够直接在UI上推荐运营游戏来直接变现。以前马云说的“让百度睡不好觉”,阿里没做到,360做到了,靠的就是浏览器。 其实这些战略层面的道理大家早就很清楚了,想多了没啥意思。还是来聊聊战术层面的交锋比较有意思。 在浏览器炙手可热之前,争夺的最激烈的是另一种产品形态——工具栏。这种用IE开放或不开放的接口开发IE插件扩展了IE原有的功能,而且产品形态也是短小精悍,仅仅在IE上添加了一个小条而已。像百度工具栏、QQ工具栏、各种工具栏。这些产品一方面为用户提供原生IE没有的功能像搜索、广告拦截、截图、音视频保存等等,另一方面也有与浏览器同样的收益就是导流和通过推荐直接变现。大家为了抢用户的默认网页、默认搜索入口在IE上打的不可开交,各种Hook,甚至把抢夺做到驱动层(这是可能导致蓝屏的)。推广方式上也是五花八门,到最后搞的一个不懂“拒绝”的普通用户的IE工具栏上挂满了各种各样的小条,甚至占了半个屏幕…… 跟工具栏这种产品相比,直接做浏览器更容易控制。虽然技术上用到的接口差不多(单指IE核),但是不需要再进行工具栏那样的争夺战,你可以独占你创建的这个内核。当然这种产品形态的工程量要比工具栏大的多,因为不能只关心内核,你需要接管一个浏览器的完整的功能,像收藏、历史、帐户、UI、进程模型等等。 在这里有一个误区,有的朋友总是觉得搞个浏览器是很简单的事,因为内核不用你写,你只是搞一个漂亮的UI出来,加上点像工具栏那样的附加功能,然后套在人家的内核上浏览器就做成了。说来简单,其实做起来完全不是那么回事。浏览器跟其他软件不太一样,就如我的上一篇日志说的,他是一个引擎,要面对各式各样的复杂环境,所以它是一个需要打磨的产品。要想让他真正做到稳定、高效、安全不是一日之功。凡是想三下五除二用短时间,小代价就做一个优秀的浏览器,都是不现实的。打开一些电脑管家之类装机推荐工具,浏览器那一栏里的产品多的令人发指。但是真能够通过市场和用户考验的又有几款呢?大千世界无奇不有,从网站,到用户行为都是不可预测的。什么样的情况会导致内核本身崩溃,什么样的插件在什么情况下会崩溃,什么样的情况会导致JS失效。内核切换策略、防假死等等这些都是需要慢慢摸索,积极处理用户反馈,慢慢去完善的。当然要说捷径也有,比如直接拿已经很完备的开源浏览器(chrome)改,这些后面会讨论。 话说兵贵神速,浏览器浏览器之争早已白热化的今天,为了在用户机器上抢滩登陆,各出奇招。但是有一点需要注意,登陆不是目的,目的是要占据要塞。在不停的演练登陆冲击速度的同时,是否也考虑到了有足够坚固的防御工事,应对敌人的反扑?
Continue Reading
浏览器的那些事

浏览器的那些事(1)

从事浏览器开发已经有一段时间了,逐渐对浏览器有了一些新的认识。在这里记一些我自己的想法吧。 1、浏览器与游戏引擎 在搞浏览器之前,曾经在游戏引擎上投入了很多精力和感情,以至于我现在的博客域名都是wantgame.net。最后阴差阳错,没有去做游戏,而是来到了一个互联网公司搞起了浏览器。 每当“游戏情结”开始在脑海里作乱时,都会用“干啥都是写代码”来安慰自己。但是,在逐渐深入到浏览器开发一段时间后,却渐渐发现其实浏览器其实跟游戏引擎有很多相似之处。从输入输出的角度上讲,游戏引擎输入的是美术资源、逻辑脚本,而浏览器输入的html, css决定了网页的布局,很像游戏中的场景文件;浏览器输入的图片、音视频就相当于游戏中的艺术资源;浏览器中运行JS脚本就相当于游戏引擎中逻辑脚本。浏览器输出的网页也不过是一个更为复杂多变的游戏画面而已。在阅读浏览器内核代码时,有很多概念也似曾相识,因为流程是一致的,读文件,解析,布局,渲染。 后来“游戏情结”就很少作乱了,因为我认识到了,其实我在做的(更确切的说是维护)是一个世界上最大的游戏引擎,全世界数以百万记的web开发者在使用这几个游戏引擎(Trident Gecko Webkit)设计游戏场景(html css),输出艺术资源(img video audio),编写游戏逻辑(javascript)。有数以亿万计的“玩家”在欣赏着这几个游戏引擎渲染的画面,与浏览器中的游戏互动。这种规模是任何一个游戏引擎都无法比拟的。 当然,浏览器有一个很重要的性质,决定了它与游戏引擎的很大不同。那就是开放性。 浏览器以标准的形式将接口公布给全世界的开发者,然后再以捆绑操作系统的方式部署到了全世界所有的智能终端。这样就为信息的输出者和输入者建立起了桥梁。而不是像游戏引擎那样,以授权的方式提供给某一些程序员使用。因该说“开放性”是浏览器最大的价值所在,也是我欣赏Chrome很重要的原因,他们把开放性做到了极致,连源代码都开放出来,这在是最根本的互联网精神。 当然要做到开放性并不是有意愿和决心就行的,要开放就先要意识到开放的后果。世界上的Web开发者五花八门, 有好人,有坏人,所以要考虑到安全性; 有高手,有初学者,所以要考虑到易用性和各种语法容错; 有各种硬件和操作系统,所以要考虑到兼容性; 有小白用户,有高端用户,所以要考虑到突出核心功能和扩展性。 当然,这些游戏引擎也是需要考虑的,但是力度要小得多。例如语法容错,我们在写html时的一些小失误例如漏个>啥的都会被浏览器“大度”的接受,因为这无伤大局。很难想象如果我们的游戏场景文件中出现这种语法错误,我们的游戏引擎也会根据自己的猜测建立出游戏场景。因为总的来说,游戏引擎还是封闭的,他提供专业的工具给专业的开发者,一切按照我的套路来就不会出错。实在搞不定的坑,我可以通过技术支持帮你填平,因为授权规模是可控的。没有必要在开放性这点上动太多的脑筋。 游戏引擎的动人之处在于对速度和美的追求,浏览器的动人之处在于大气。
Continue Reading
浏览器的那些事

探望受伤的HTML5

今天看到一个消息Facebook放弃的用HTML5开发客户端应用的方案,转用ios6的API开发苹果的客户端。链接在这 http://www.csdn.net/article/2012-08-24/2809122 一个公司选择放弃了一个技术方案,这种事情天天都在发生,没什么好奇怪的。但是这件事恰恰发生在Facebook和HTML5两者身上,就变的比较有看头了,因为一个是当前比较热门的技术标准,一个是走在技术前沿的热门大公司。 作为一个浏览器开发者,一直在关注HTML5,也在我们的浏览器上做过HTML5标准的支持开发工作。想谈一谈对HTML5的一点看法。 1、HTML5吸引力 有人说,勤快人当不了好程序员,一个好的程序员总是想尽办法写出高效的、通用的、易维护的程序。同一套业务逻辑,用C++写一遍,再用java写一遍,再用Object C写一遍,这对怕麻烦程序员来说是不可接受的,即便有方便的工具转,程序员们也更愿意把时间省下来干点他们认为有意义的事。统一的平台,统一的语言,统一的字符集…这些好比国家统一,在大牛、大公司们的利益和价值观面前,只是吊丝程序员的一厢情愿罢了。java,C#这些号称跨平台的玩意儿逐渐也都变成了平台之一。HTML5的出现给这个事带来了希望,因为它是一个标准,是标准大家就都应该遵守。不管你的服务器是Apache还是IIS,不管你的浏览器是IE还是Chrome都要通过HTTP协议通信。而且多年以来,HTML标准还是维护的比较单纯。在本来就统一的标准上做扩展,就成了建立统一平台的可行方案。这样程序员们只要开发一套代码,就可以在不同硬件、不同系统、不同浏览器上运行。 另外,作为Web的开发标准还有一条天然的优势,那就是部署在服务端,这样非常方便维护,升级迭代的效率会非常高。如果开发过客户端软件的升级模块,就能体会到这一点有多美好! 有了以上两点,HTML5就成了技术界的美人胚子,尽管还没发育完整,但是含苞未放的小萝莉以让我等技术宅男们垂涎三尺。原来的HTML之所以被限定在开发传统网站上,是因为脚本能力被死死的限定住了,只能控制很少的东西。就像非要把身材热火的女郎捆在十分保守的棉袄棉裤里。好了,现在HTML5的核心思想就是要解放脚本的能力,撕碎女郎上的破棉袄,让她穿上比基尼。让她可以控制本地存储,控制图形绘制,控制媒体播放,控制摄像头…最好是能把Native代码干的事全干了(当然这是不可能的)。还有现在牛逼哄哄的硬件配上牛逼哄哄的JS引擎,效率问题似乎也不需要像原来那样关注了。 我们可以畅想一下以后的程序员,大多数人只会JS脚本就可以了,留下少数精于底层的“老顽固”维护基础设施。大量的精力被从平台相关的工作中解放出来,只去关注业务、算法、创新。这一切多么美好! 2、目前HTML5的局限性 这次Facebook做出这个“艰难的决定”我想是经过深思熟虑的,起初对HTML5投入的热情也不得不暂时收回。 1> 信任 Web应用于本地软件有一个最本质的区别,那就是信任程度。通过网络下载到的脚本,保守的来看是不应该被信任的。因为他不同于软件,用户在安装软件的时候就相当于给了这份软件授权,让他可以在自己的操作系统上做事,我们可以认为这个过程是比较慎重的,即便它是在做坏事。而Web服务不同,用户只需要轻轻一点,甚至不用点就可以跳转到一个网页。这种加载运行脚本的频率要远远高于用户安装本地软件的频率。所以,无论浏览器如何明显地提醒用户注意安全,都会“习以为常”得忽略掉。这样,开放更大的权限给配置在服务端的脚本就变成了双刃剑。当然,那些制定标准的大牛们很注重安全性,在读那些标准文档的时候,你就会深切感受到这一点。例如,为了防止缓冲区溢出导致的不安全,在WebGL的白皮书中重点说明了对定点缓冲区的索引要进行检查,虽然这样做会影响渲染效率。在Geolocation的标准中,多次强调标准的实现者(浏览器),在为脚本提供用户的地理位置前,一定要明显的提示用户让用户授权。在FileSystem中,要求做到不同Origin的文件系统要隔离,要将虚拟化,等等等等。 这一切的防御措施都源自一点,那就是Web脚本的不被信任性。惹火女郎的性感被解放出来,但是也要保证护住关键位置,一不小心露点了那就变成了有伤风化。 2> 统一 HTML5的标准是由权威的W3C和WHATWG共同维护的,但是实际上的编辑都是Mozilla、Apple、Google、Microsoft这些大公司的牛人,大家的终极目标是一致的,但是具体实施起来恐怕就不是那么回事了。中国有句古话叫文人相轻,其实,不光是文人,码农也是一样的。只要人混到了一定的层次,自信建立起来之后,多多少少都会排斥别人的想法。无论外表表现的多么谦逊,内心都会有一种高傲的东西在撩拨那帮牛人的理智。再加上为不同公司的商业利益考虑,标准的制定者不可能铁板一块。而且这已经得到了印证WHATWG已经宣布与W3C分家,各自维护自己的标准。而且从各大浏览器生产商公开的讨论和邮件来看,争论一直没有停止过,连共同维护Webkit内核的Apple和Google也在不停的扯皮。还有由于标准的制定战线拉的太长,从2004年提出这个想法以来,已经8年的时间了。有很多前瞻性的尝试也被那些喜欢尝鲜的程序员被广泛应用。例如Webkit中带Webkit前缀的API已经被用滥了,当Webkit想去掉的时候发现已经无能为力了,一旦去掉新版的Webkit将有很多网站和应用出现异常,尤其是移动平台。可以看到统一大业真的不那么容易,除了要征服敌人,最重要的还要克服自己。 总结总是要积极向上的: 不管怎么样,HTML5还是一项很伟大的事业,它代表了码农界最先进生产力的发展要求,代表了码农先进文化的前进方向,代表了最广大码农的根本利益。历史的车轮是不会停滞不前的,Facebook这事只是革命浪潮的一朵小浪花。
Continue Reading
浏览器的那些事

adBlock下的互联网生态

adBlock adBlock是一个强大的组件,用来过滤网页中的广告,在广大网友的共同维护下,过滤及其精准。百度的推广链接,侧边广告,优酷视频播放前的广告,新浪的浮动广告和弹出广告。全都可以被block掉,只剩下干干净净的网络内容。作为个体用户,这东西用的很爽,但是作为互联网从业人员,可能想的要更多一些。 这是一个隐藏多年的杀手,由于他以浏览器插件的形式存在,注定了它只能在高端用户的圈子流通。不会对大众的网络环境产生太大的影响,但这不能说明它没有这个能力。它的存在对现有的互联网生态圈是一个很大的威胁。目前互联网的盈利模式无非就那几种,而广告仍然是最稳定的盈利模式。因此可以想象一旦adBlock被推广到大多数客户端,对这些网站的营收会有多大的冲击,进而对整个互联网有多大的冲击。而这并不是很难实现,目前国内任何一个普及率较高的浏览器都可以很容易得将此功能内置到浏览器中。无法想象,一旦这位老总脑子一热这么干了,会在业内掀起多大的波澜。 当然从战略上分析,没有一家浏览器公司会这么干,因为毕竟大家都是一根绳上的蚂蚱。虽然有一些小摩擦,但是更应该看重的是共同利益,把别人干倒了自己也没有好日子过,和气生财才是硬道理。 ———-强行插入故事————– 远古时候有一只猴子,有一天他突然获得神的启示,神向他描述了几百万年以后他们的子孙进化成人类,他们过着幸福的生活。他看到了美好的未来,进化后的猴子已经蜕掉了绝大部分体毛,显得更加娇嫩而优雅,也不再招那么多恼人的虱子。于是猴子震惊了,疯狂了,他迫不及待得想过上几百万年后的好日子,他已经等不及了。于是他拔掉了自己身上的毛,又去强行拔掉其他猴子身上的毛。结果可想而知,会被其他猴子群殴致死。 ————故事结束—————- 如果我是那只猴子,我不会伤自己身上的一根毛,我会在在吃饱喝足后懒懒得躺在河边的石头上晒肚皮。一边抓着身上的虱子,一边畅想着几百万年后子孙们的生活场景: 那个时候,人们已经无法忍受像强行插入故事一样,强行插入广告,他们都安装了adBlock。因为互联网不同于电视机,他们可以通过技术把真正想获取的信息过滤出来,他们有能力这么干,有权利这么干。当然大的互联网公司不甘心失去这个传统的盈利模式。因此,同所有的革命历史一样,当年的激进派变成了现在的保守派,因为新的激进派触动了他们的利益。他们利用强大的公关能力与adBlock的官方组织达成了某种平衡。但是,他们发现这东西已成燎原之势,连adBlock官方都无法控制这种过滤方式的传播。因为无数的吊丝想在革命中改变命运,几个吊丝就可以完整复制adBlock模式提供给那些不再相信adBlock官方的人们。 于是,出现了adKiller、adFucker等等等等。 于是,网络上没有了类似于“恒源祥,羊羊羊”这类的弱智广告,广告的质量开始提高,做成了一个个有剧情的小短片,或温暖,或励志,或刺激。广告本身也成了人们真正需要的信息。广告展现的手段也出现了大规模的更新换代,他们被植入到了信息中,显得更加自然,更加亲切。 于是,那些守旧的广告媒体开始或倒闭,或转型。 于是,大家开始真正关注信息本身的质量,当年那种占据入口就可以躺着数钱的想法已经不复存在。 于是,真正创造内容的人有了收益。 想着想着就睡着了,无忧无虑的酣睡。 被虱子要了一口,醒了,挠了挠虱子咬过的地方。 爬到树上摘了一个几百万年后永远不可能吃到的果子。 咬了一口,很甜。
Continue Reading