前端全链路优化实战课--极客时间课程推荐/优惠
养成全链路思维,突破前端天花板
专栏 | 33讲 | 2047人已学习
优惠价¥59原价:99
官网优惠购买
版权声明
本站非极客时间官网,与官方无任何关系。我们不提供课程下载或详细内容,仅作为课程分享和推荐平台。我们鼓励大家支持正版,尊重创作者的劳动成果,这样不仅能帮助创作者持续产出优质内容,也能让自己获得更好的学习体验。请通过官方渠道购买和学习课程,感谢您的理解与支持。
课程详情
你将获得:
- 一套简洁实用的数据指标参考;
- 打造实时监控与故障预警体系;
- 搞定 10+ 前端开发高频难题;
- 解锁你的前端必备提效指南。
课程介绍
随着Web技术的不断进步,前端工程师所承担的责任也在扩展。我们不仅要负责页面的布局和样式,优化用户交互体验,还要承担后端服务的通信工作。能力上,我们需要具备跨平台、跨设备的适应能力,同时学习不断更新的框架和工具。
不过,前端生态愈发繁荣的同时,我们遇到的问题也在增多。比如:
- 页面性能,处理各种兼容性和网络问题种类不断增加。
- 学了很多种数据指标设计方案,但无法适配业务。
- 反馈杂乱,多任务并行。用户反馈的问题虽然原则上不严重,但必须处理,且排查起来耗时耗力,总是打断平时的开发流程。
- 技术债务。项目中可能存在大量非本人编写的代码,导致代码质量参差不齐,排查问题困难。
基于此,我们邀请到了唐俊开老师开设这门课程。他会结合20年来的前端开发经验,带你搭建一套属于自己的全链路问题解决方案,轻松应对用户问题和线上故障,突破能力天花板。
课程设计
课程内容分为四个部分。
-
基础理论篇:带你学习前端全链路基础理论知识。将全链路拆解为3种要素和它们对应的14条核心路径,你会得到一份后续学习的路线图。
-
全链路核心指标:学习设计日志数据格式的方法,把前端出现的各种异常、页面交互问题以及性能问题关联起来,让你在处理线上问题的时候更快地定位全链路场景的日志。
-
全链路监控:基于前一章设计的指标,继续设计一套故障通知体系,做到及时通知系统故障,再由人为分析、整理,判断每个问题是否需要解决。
-
优化实战篇:综合前面日志埋点和监控的知识,解决高频的页面故障、性能、交互等等问题。
课程目录
开篇词
- 开篇词|前端全链路是提升解决问题效率的关键
基础理论
- 01|前世今生:前端全链路的演进历程
- 02|重要性:为什么要对前端服务做全链路的监控和优化?
- 03|全链路流程:前端全链路的关键路径有哪些?
全链路核心指标
- 04|数据结构(上):如何设计全链路数据模型
- 05|数据结构(下):如何设计页面业务问题相关的数据结构?
- 06|指纹ID:如何通过指纹ID关联全链路日志?
- 07|网页指标:为何要用WebVitals分析Web应用的用户体验?
- 08|网页指标:如何快速把Web Vitals集成到实际项目?
- 09|接口指标:监听接口状态,收集页面接口异常数据
- 10|资源和脚本异常指标:监听资源和脚本状态,收集异常数据
- 11|用户行为指标:如何有效监听用户交互行为?
- 12|自定义指标:如何通过自定义指标,监控前端页面更多状态
- 13|关联后端:如何通过Skywalking把接口关联到后端服务?
- 14|数据上报方案:如何在不影响用户体验下实现数据上报?
全链路监控
- 15|何为监控:让监控成为快速发现问题的重要方法
- 16 | 监控规则:设定有效的查询条件规则
- 17|数据可视化:可视化监控真的重要吗?
- 18|告警与决策:如何解决监控警告中焦虑的问题?
优化实战篇
- 19 | 卡顿:页面响应卡顿是什么原因造成的?
- 20|渲染: 如何优化布局和渲染,提升网页响应速度?
- 21|首字节: 有效衡量网页首字节时间指标
- 22|加载速度: 提升网页首字节时间的问题
- 23|白屏:如何优化APP内前端白屏时间?
- 24|跳出率:如何快速显示页面内容,降低跳出率?
- 25|字体:解决自定义字体加载问题
- 26|视口:可视内容对全链路的重要性
- 27|图片:调整策略,优化图片加载问题
- 28|视觉:避免发生布局偏移影响用户交互
- 29|经验:优化就是减少请求数量和质量
- 30|工具:最容易被忽视的工具和定位问题路径
结束语
- 结束语|持续成长,成为最好的自己
- 结课测试|来赴一场满分之约
作者介绍
唐俊开,网名三桥,HTML5标准技术推行者、布道者。著有《HTML5移动Web开发指南》《通吃iOS及Android:用HTML5+Script就能开发AP》,《HTML5技术与移动出版》协作者。
从事前端技术开发工作已经超过20年,专注研究前端技术生态。深度参与过企业软件、App产品、PC产品、海外信息流产品的开发,参与过技术推广的工作。最近几年一直专注研究小众市场ToC产品的前端技术,也带领团队解决过项目历史技术债。