QQ互联中优化经验分享.pdf

如何进行多终端Web前端优化 QQ互联中的优化经验分享 腾讯高级工程师任旻 个人经历概述 • 2004年-2005年在北京工业大学任教 • 2005年-2009年在微软， – .Net相关的技术工作 • 2009年加入腾讯，负责开发QQ概念版 • 2011年——今 – 开放平台：Q+，QQ互联 • O’Reilly 《HTML5 Canvas》译者 目录  为什么要对QQ互联进行性能优化？  QQ互联优化实践 • Web与客户端本地应用的综合优化 • Web前端优化中的平衡和取舍 • 利用Webkit的新特性，突破传统优化手段 • 尝试新技术，利用云平台提速 什么是QQ互联？ QQ互联是腾讯公司通过开放QQ账户体系，帮助第三方网站、媒体、终端进行社会化营 销推广的开放平台，主要包括QQ登录、分享等社交组件及OpenAPI等功能。 / 什么是QQ互联？ QQ互联是腾讯公司通过开放QQ账户体系，帮助第三方网站、媒体、终端进行社会化营 销推广的开放平台，主要包括QQ登录、分享等社交组件及OpenAPI等功能。 • QQ帐号登录的认知度更高，且便于记忆 什么是QQ互联？ QQ互联是腾讯公司通过开放QQ账户体系，帮助第三方网站、媒体、终端进行社会化营 销推广的开放平台，主要包括QQ登录、分享等社交组件及OpenAPI等功能。 • 强关系社交平台的分享API ：QQ好友、群、QQ空间、腾讯微博 QQ互联的优势 • QQ帐号登录的认知度更高，且便于记忆 • 强关系社交平台的分享API ：QQ好友、群、QQ空间、腾讯微博 • 庞大的QQ在线用户群体：手机QQ日活跃用户4亿 为什么性能对QQ互联如此重 要？  影响用户操作的成功率和转化率  转化率降低是对合作伙伴的伤害： • 搜狐微博客户端：每天新增注册用户中，QQ用户登录超过 40% • “唱吧”有超过50%的用户都来自QQ帐号登录 • 美图秀秀：每天分享至不同社交平台的照片总数中，分享到 QQ空间的照片占94% QQ互联的性能优化难点 • 多种设备 • 多种操作系统 • 多种登录方法 • 多个android的版本 使用QQ帐号登录 是否安装手机QQ PC HTML5 页面 Android 手机 SSO 4.0 以上 1.3以下 目录  为什么要对QQ互联进行性能优化？  QQ互联优化实践 前端优化≠优化前端 • 登录和SSO – Web与Mobile本地应用的综合优化 • 定向分享 – Web前端优化中的平衡和取舍 • QQ查找 – 利用Webkit 的新特性，突破传统优化手段 • 后台综合优化 – 尝试新技术，利用云平台提速 一、QQ帐号登录优化实践  登录场景  PC网站、应用使用QQ帐号登录 • 网页形式：Discuz!等网站 • 客户端应用：金山快盘  手机应用 • iOS、Android • 支持手机QQ、手机Qzone的SSO形式登录 • 唤起系统浏览器登录 PC端QQ登录页OAuth流程优化 • OAuth2.0登录流程 输入帐号 获得Token