新浪微博新版中的Bigpipe-Server端的php实现.ppt

Click to edit the title text format,Click to edit the outline text format,Second Outline Level,Third Outline Level,Fourth Outline Level,Fifth Outline Level,Sixth Outline Level,Seventh Outline Level,Eighth Outline Level,Ninth Outline Level,11/23/11,*,微博新版中的,BigPipe,技术后端实现分享,史罗丹,Rodin,高级开发工程师,新浪微博,luodan,日程,概念,实现,实战问题,展望,概念,BigPipe,是,重新设计的,Web,服务处理过程,利用流水线思想降低网页的用户感知延迟,AJAX,模块化方式的性能加强版,概念,概念,概念,概念,传统页面处理过程,概念,AJAX,模块化处理过程,概念,BigPipe,处理过程,概念,输出示例,-,普通模式,左侧内容,主要内容,概念,输出示例,-BigPipe,模式,bp.pagelet(id:pl_left,html:,左侧内容,),bp.pagelet(id:pl_main,html:,主要内容,),概念,传统模式,(BP,关闭,),流水线模式,(BP,开启,),248ms=70 ms,概念,好处,用户更快看到部分内容,减少,HTTP,请求,Pagelet,处理可并发,坏处,强制页面模块化,数据请求层封装,部分运算移动到浏览器端,浏览器兼容性,概念,伴生技术,Quickling,将所有点击加载异步化,PageCache,浏览器端缓存内容,广告,#Velocity China 2011#,使用,BigPipe,提升浏览速度流水线技术在新浪微博的实践,吴侃,v4ria,前端技术经理,日程,概念,实现,实战问题,展望,实现,服务器端任务,组织,Pagelets,管理,Pagelet,依赖,获取数据,判断输出模式,生成,HTTP,响应,前端任务,JS/CSS,拆分,JS/CSS,加载卸载,Dom,处理,Quickling,历史管理,实现,树形组织,Pagelets,Pagelet,储存自身依赖,Pagelet,提供数据获取方法,Pagelet,结构与处理逻辑分离,实现,树形组织,Pagelets(Composite),实现,实现,Pagelet,类,依赖的,css,依赖的,js,脚本,所需,html,模板,数据准备方法,实现,内容处理与容器分离,(Visitor),实现,模板处理,HTML,模板中包含子,pagelet,占位符,实现,输出模式,传统,Traditonal,流水线,Streamline,随机流水线,Random,实现,输出模式,传统,流水线,随机,访问次序,先子后父,先父后子,任意,输出方式,同时输出,父先输出,子后输出,父先输出,子后输出,深度优先遍历,实现,总结,树形组织,Pagelets,Pagelet,储存自身依赖,Pagelet,提供数据获取方法,Pagelet,容器与处理逻辑分离,深度优先遍历,日程,概念,实现,实战问题,展望,问题,页面区域需要单独划分成,pagelet,以便重用和调整,同时又作为页面框架的一部分直接输出,静态,pagelet,问题,跨页面更新内容或仅更新部分内容,不需要输出脚本框架和页面框架,ScriptOnly,模式,问题,随机流水线模式输出,数据并行处理,异步,IO+,事件回调（纯,PHP,实现）,socket_select/curl_multi_select,问题,IE6 Bug,：脚本中止错误,强制,IE6,用户使用传统模式,问题,Pagelet,数据获取失败,单,Pagelet,失效,问题,Pagelet,的数据希望可以继承到子,Pagelet,但对父,Pagelet,不可见,数据“伪作用域”,问题,其他琐碎,输出模式判断,浏览器检测,Noscript,标签跳转,Cookie,识别,gzip,模块不影响输出,HTTP 1.1&1.0,兼容,日程,概念,实现,实战问题,展望,展望,全站,BigPipe,Pagelet,优先级,随机模式输出,(,待上线,),JS/CSS,资源的全局管理,Q&A,THANKS,Q?,讨论,适用场景？,BigPipe,改进方案？,