听facebook网站 ajax化,缓存 流水线技术 视频 笔记
视频地址: http://v.youku.com/v_show/id_XMjI5MDc1NjA0.html
在一个页面最终展现在用户的浏览器之前分析,可能造成的延迟时间分析:
服务器渲染页面的时间
服务器把页面传到客户浏览器的时间
浏览器渲染页面的时间
- 基于为用户提供快速展示页面的用户体验,以及减轻服务器端的服务压力,同时考虑到facebook的每个页面都有一个共同的导航栏部分以及一些公有的页面部分,所以没有必要 每跳转一个页面都要重新渲染那些公有的页面控件,facebook把用户的所有请求都转化为ajax请求,技术实现上的话则要截获用户所有的浏览器事件,然后再把它转化为ajax请求发向服务器。 获取每个页面需要更新的那部分页面内容来展示
- pagecache技术。由于facebook的个人主页是用户最常访问的页面,但是有可能用户会访问了几个用户的页面时,又回到了个人主页,也就是说,个人主页是一个被经常访问的页面(时间局部性和空间局部性),所以为了加快在客户端的渲染速度,可以把用户最常访问的页面内容缓存到前台js的一个变量里面,当用户再次访问这个页面的时候可以直接从页面缓存中读取内容。 但是这样的缓存带来的问题就是 数据实时性,以及数据一致性的问题, 例如,当用户修改了个人主页的设置,但是原先的个人主页已经缓存在了客户端,那么如何保证数据的一致性呢? 这时候的方法是在这些可能对缓存造成修改的方法中加入一个回调函数,也就是说当修改了可能 是缓存中的内容时,也要通过回调函数同步修改缓存中的内容。 同时考虑到跨页面的修改,那么还要监控到涉及数据库中修改的时候,及时的通知前台进行缓存内容的同步。
- bigpipe技术。在分析可能造成页面延迟的时间时,主要是 服务器的渲染页面时间,传输时间,浏览器渲染时间,而且整个流程是串行,这就造成 如果服务器没有渲染好页面,那么页面就不可能在网络中传输,更不可能在浏览器渲染,借助微处理器中流水线的思路,可以把整个串行的流程,做成流水线的并行传输,分析facebook页面特征,可以把整个页面进行拆分,分模块的把页面传输到客户端浏览器, 每个模块都要经历 服务器生成 网络传输,客户端渲染的流程,但由于把以前整个大的页面分成了几个小的模块,而且各个模块之间互不影响,也就是a模块一旦在服务器端生成就马上网络传输给客户端渲染,b模块也同时在进行服务器端生成的流程,整个流水线的模式,为用户提供了良好的用户体验,特别是网络状况比较差的环境下,效果就更明显。
- 关于时间的测量,因为每个用户所处的网络环境部一致,为了能够真实的反应业务逻辑的响应时间,可以在关键模块上加关键的定时测试代码,进行代码级别上的时间测量