Google+开发团队分享经验
大家好,我是Google+基础架构团队的工程师。早在7月份,当Joseph Smarr开发出了Ask Me Anything栏目后,很多人都想知道一些关于Google+技术架构方面的信息。我们几个工程师觉得应该写一些关于这个题目的文章,给大家分享。
对于Google+团队,我们头一个要认真处理的问题就是:页面生成速度。在谷歌,我们十分在意速度,下面就是我们用来提升速度的5项技术。
1. 我们喜欢Closure
我们喜欢Closure。非常的。我们使用Closure类库,模板以及编译器来生成Google+所有页面上的所有元素――包括驱动这些页面的JavaScript。但真正让我们获得速度的是以下几点:
― Closure模板即能用于Java也能用于JavaScript,生成的页面即能在Server端运行,也能在浏览器里运行。通过这种方式,内容总是能理解展现,我们还可以在后台加载JavaScript(“修饰”页面,在页面元素上挂载事件监听器)
― Closure能让我们在写JavaScript脚本时仍然可以享用严格的类型和错误检查,死代码清除,跨模块提示,以及其它的很多辅助优化便利。
(访问 http://code.google.com/closure/ 来获取更多关于Closure的信息)
2. 在正确的时间正确的使用JavaScript
为了管理驱动Google+的JavaScript,我们把它分割成小的模块,这样可以异步的分别加载它们。你只需要下载最少的必须的模块。由两种技术来实现这些:
― 客户端保存历史浏览记录的信息(URL里的字符串信息代表这你当前处在某个页面上),用这种方法来调配JavaScript模块。
― 如果JavaScript没有加载完成,这个页面上的任何操作都会被禁止,直到加载完成。
这种技术框架也是Google+在客户端页面导航时避免重新加载页面的技术基础。
3. 页面之间切换时避免刷新页面
一旦JavaScript被加载,所有的页面内容都使用JavaScript生成,不需要再到服务器端去取,这样做效率更高些。我们设置了一个全局的监听器,监听所有标记的点击事件。如果允许的话,我们会把点击转化成页面内部的切换。如果条件不允许,客户端会生成这个页面,如果你在链接上使用鼠标中键或控制键的点击,我们会让浏览器按常规链接打开这个页面。
页面上锚标记总是指向一个常规的URL(例如,你在HTML5里的历史记录里的URL),这样,你能容易的拷贝/分享这个页面链接。
4. 部分(HTML)页面块刷新
在客户端,一旦我们接收到部分数据,我们就立即生成这块内容,让它可见,不必等到整个页面加载后才能显示。
为了实现这些,我们通过:
― 首次请求时,我们就把所有数据异步的取回
― 只有在需要生成这部分页面数据时,才会遇到延迟现象
这种技术也能让我们尽早的加载CSS,JavaScript,图片以及其它资源,使网站更快,响应效果更好。
5. iFrame是我们的朋友
为了能并行的加载JavaScript,避免浏览器卡住(http://goo.gl/lzGq8),我在页面的body标记的顶部的一个Iframe里加载JavaScript。在iframe里加载JavaScript增加了代码的复杂度(通过Closure,我们很好的解决了这个问题),但是为了速度的提升,值得这样做。
做一个解释,你们也许注意到了我们是使用XHR,而不是使用style标记来加载CSS的 - 这并不是我们做的优化,这是做是因为我们达到了IE浏览器里每个样式表文件里CSS选择器的上限!
最后注解
这些只是整个Google+面纱下事情如何运转的一小部分介绍,我们以后会写更多像这样的文章。请在评论里留下你的想法!
译者注:Mark Knichel发布了这篇文章后,很多人在评论里表达了不同的观点,有些人认为iFrame是一种应该被淘汰的技术,有些人认为Closure template影响了程序的可维护性。但我反过来一些,这似乎正说明了谷歌的程序员在开发上享有很高的自由度,他们可以使用任何他们自己喜欢的技术。
建议继续学习:
- iframe大小自适应 (阅读:8815)
- iframe里src="about:blank"的问题。 (阅读:6849)
- 跨域请求的iframe解决方案(1) (阅读:5392)
- BO报表系统嵌入Iframe在firefox下的错误修改 (阅读:4632)
- ie下iframe输入框焦点丢失解决方案 (阅读:4298)
- 总结的一些PHP开发中的tips (阅读:4167)
- 三谈Iframe自适应高度 (阅读:3640)
- 使用document.domain和iframe实现站内AJAX跨域 (阅读:3314)
- 跨域请求的iframe解决方案(2) (阅读:3146)
- 几点学习经验 (阅读:3159)
扫一扫订阅我的微信号:IT技术博客大学习
- 作者:Aqee 来源: 外刊IT评论
- 标签: Iframe 经验
- 发布时间:2011-12-18 22:24:10
- [42] 如何拿下简短的域名
- [42] IOS安全–浅谈关于IOS加固的几种方法
- [41] 图书馆的世界纪录
- [41] Oracle MTS模式下 进程地址与会话信
- [41] 界面设计速成
- [39] android 开发入门
- [38] 【社会化设计】自我(self)部分――欢迎区
- [36] 读书笔记-壹百度:百度十年千倍的29条法则
- [36] 视觉调整-设计师 vs. 逻辑
- [33] 程序员技术练级攻略