在移动互联网时代,由于设备资源受限、网络不稳等因素,Web性能优化显得尤为重要,... 展开 >
尹立,百度App内核和搜索优化技术负责人,2014年加入百度,负责百度App渲染引擎T7内核的研发和优化工作,推进Web页面浏览速度和流畅度大幅度提升;随后负责百度App搜索全流程速度和体验优化,建立用户可感知的速度和体验指标,并完成全链路监控、拆解和优化;曾就职于Intel公司开源技术中心,负责Chromium/WebKit开源社区HTML5支持和优化工作,2014年被Google公司和Apple公司分别任命为Chromium和WebKit开源社区Committer。
在移动互联网时代,由于设备资源受限、网络不稳等因素,Web性能优化显得尤为重要,从用户感知的首屏指标建立到关键耗时路径拆解和优化都有类似的经验可以借鉴。本专场将邀请在Web前端、渲染引擎和特定场景下有速度优化经验的技术专家,分享实践经验。
随着中国互联网的蓬勃发展,越来越多的企业势必要走向国际化,而性能是前端避不开的一个话题。大型电商网站的性能优化是一个非常复杂的事情,一是开发团队众多牵涉广;二是用户面向全球,用户分散、用户物理距离遥远、地区间发展不平衡。在白纸上画图是最容易的,小网站实在不行就整体重构,但我们很难对网站做整体重构,因为需要消耗巨量的人力资源。面对各种复杂的环境,我们如何发现及定位问题,如何找到适合用户的性能优化方案?
演讲提纲:
1. 国际化性能优化的挑战
2. 国际化性能优化的度量与分析
(1) 首屏定义
(2) 秒开率、分位数、平均值、极值等分析方法对性能数据的影响
(3) 分析的维度(国家、设备、分层)、散点图、全球性能地图
(4) 利用数据来指导性能优化
3. 国际化性能优化的方案
(1) 使用 AMP 优化来自 Google 的流量
(2) 利用边缘节点流式渲染解决首跳性能
(3) 快速将网站 SPA 化解决二跳的性能问题
(4) 异步渲染 API 的性能优化
听众收益:
1. 快速发现及定位问题
2. 在各种复杂的环境下找到适合于用户的性能优化方案
前沿亮点:
1. 面向全球用户的性能优化
2. 大型电商网站的性能优化
知识储备:
1. 有一定的 Web 开发经验
2. 有一定的性能优化的知识
通过对百度App H5网页速度数据做详细分析发现,H5页面展现时间超过4秒,毫无疑问,在这个用户体验至上的时代,H5展现速度会极大影响百度App的用户体验,而且数据显示57%的用户选择离开。因此,H5页面的首屏性能变得十分重要,要争取做到秒开。
本次分享,会详细介绍百度App性能监控体系的建立过程,包括通过监控及时发现线上H5页面打开慢的原因,并提供定位具体问题原因的能力。还将分享到百度T7内核网页渲染优化算法以及精准首屏标准化的推进。
演讲提纲:
1.性能监控体系的建立
(1)前端JS监控存在的问题
(2)首屏指标的建立
(3)辅助指标建设
2.百度T7内核网页渲染优化
(1)首屏关键路径拆解
(2)渲染引擎布局算法存在的性能问题
(3)精准首屏加速算法
3.精准首屏标准化
(1)首屏firstpaint标签定义
(2)介绍网页开发者如何使用首屏标签
听众收益:
提高网页速度,提升H5浏览体验,进而可以带来网站流量增长
前沿亮点:
H5页面用户可感知速度监控和渲染引擎首屏速度优化
随着网络的飞速发展,大的网络环境越来越好,但是通过调研我们发现网站性能越来越差。如何通过真实用户体验来定义网站性能指标显得十分重要,本次主题将会分享 Google 性能工具如何定义效能指标。
同时,对于网络环境或硬件条件不佳的用户,开发人员通常使用不同装置基准(“桌面”“移动”)建构组件和路由。因为用户所处的环境通常更加细微,如:CPU 速度、网络速度变化、内存大小,所以常用的构建组建显得不符合时宜。那我们如何通过网络平台可用的信号来迅速满足客户的需求?希望本次分享能给你带来一些参考。
演讲提纲:
1. Google 性能工具
(1) Google 性能指标定义及更新
(2) 有效利用 Lighthouse 的可拓展性
(3) 接入 Google 性能工具到持续集成内
2. 自适应加载
(1) 自适应加载的重要性
(2) 前端框架如何实现自适应加载
(3) 如何根据不同硬件条件加载资源
(4) 大型公司如何采用自适应加载
听众收益:
1. 如何定义效能指标及使用 Google 效能工具
2. 根据网络环境及不同装置硬件采用自适应加
知识储备:
1. Web 开发经验
2. 性能优化知识