全面揭秘!大前端工程实践与性能优化实操案例

1,359 阅读7分钟

=>戳我报名,稀土开发者大会 2022 震撼来袭!

降本增效已经成为前端工程领域绕不开的话题,不管是用 Webpack 还是 Vite,亦或是是其他前端构建工具,所有前端工程都要考虑如何更好地支撑业务需求。

众所周知,当下互联网技术趋势中,前端工程的复杂程度正在以一种突飞猛进的速度迭代更新,同时随之而来的,却是用户对互联网系统功能体验的更高要求:更快的网站响应、更人性化的用户体验以及更一站式的服务质量,而这些更高要求的用户诉求往往也对应着一个根本问题:前端工程到底该如何进行性能优化。

确实,前端工程变得越来越庞大,性能却要求越来越优化,此消彼长,看似成为了悖论。但这却是实际的生产环境中每天都要面临的问题,如何高效地解决这些问题,成了前端开发工程师通往卓越的必经之路。

7 月 22 日、23 日即将举办的 2022 稀土开发者大会上,由快手 Web 开发中心负责人方超作为出品人的《大前端工程实践与性能优化》专场,将为前端开发工程师们带来各个大厂在前端工程与性能优化实践中的技术分享,本届开发者大会免费报名中,点击文末阅读原文或识别海报二维码即可与各位牛人分享交流。

四大高手,巅峰论剑!

演讲主题:快手增长团队的前端工程化思考

工程化一直是业内比较热门的话题,工程化的各个子领域也有很多优秀的技术和工具产生,快手前端团队是如何在快速更新的技术大潮立于不败之地,这位高手带你一探究竟。

演讲大纲:

  • 快手前端的价值思考

  • 快手增长前端团队的工程化大图(Init/Update, Coding, Commit, Build, Test, Preview, Depoly, Measure)

  • 重点项目阐述

  • 流水线能力(代码准入及性能准出)

  • 团队资产沉淀(组件市场,playground)

  • 项目管线优化(场景编辑器、动效平台、故障恢复体系)

演讲嘉宾:

徐辛承 快手前端工程师

10 年前端开发经验,曾先后就职于百度、阿里、贝壳、猿辅导等公司,目前在快手负责增长业务用户激励方向的前端开发工作。

演讲主题:转转 Web 性能优化与监控实践

转转前端的页面主要是 Web 形态,并且 Hybrid 场景占绝大多数。Web 页面具有良好的的开发效率,但同时性能体验也一直被诟病。转转在过去的几年中,围绕 Hybrid 形态,摸索出了一系列 Web 页面的优化方案。从基础的离线包,到复杂的预渲染、预请求等都有涉及。最终实现了 Hybrid 页面与 Native 页面在电商场景下,相差无几的体验。同时建立了一套页面评级标准,并自研了相应的监控系统,可以自动化监控页面性能,从而通过数据来驱动页面性能的持续跟进与改善。

演讲大纲:

  • 转转业务场景介绍

  • 高性能 Hybrid 建设的实践

  • 性能评估标准

  • 预渲染技术

  • 智能离线包与预加载技术

  • 预请求与请求代理技术

  • SPA 模拟 Webview 技术

  • 图片骨架屏与 Hybrid 缓存共用技术 - 性能监控平台

  • 核心指标采集方案

  • 性能平台方案设计与架构设计

  • 性能平台使用最佳实践

  • 性能未来的提升点

演讲嘉宾:

黄家兴 转转前端技术委员会主席

12 年毕业,曾就职于京东,16 年加入转转,负责转转运营、业务中台等前端团队,目前担任转转前端技术委员会主席以及前端架构团队负责人,专注在前端工程体系建设,致力于提升转转前端整体技术架构。

演讲主题:统一工程化!奇安信千星平台的破圈之路

伴随着千星平台的诞生,奇安信前端从几年前的一片蛮荒、百家争鸣,到如今的车同執、书同文.达到规模化、高效、高质量生产,而如今,千星平台正在完成从前端研发往整个研发链路的全生命周期、全角色的賦能.让整个集团的产品研发效能、更上一个台阶。

演讲大纲:

  • 开局一堆人,技术全不一样

  • 规范-流程-工具-系统的统一之路

  • 制定研发规范 & 设计规范

  • 提供 QP 框架 & QAXD 基础组件库

  • 搭建 QX Store 研发资产管理平台

  • 搭建 Dockyard 项目管理平台

  • 破圈:带上服务端一起飞

  • API service-前后端协作的试水

  • 微服务接入 Dockyard

  • 未来:打通立项到交付的项目开发全流程

演讲嘉宾:

金振祖 奇安信高级前端架构师

从事前端开发 8 年,一直深耕于企业级前端开发领域,具有丰富的中大型管控系统开发经验。

演讲主题:破解前端性能优化里的迷思

当下前端性能优化工作似乎越来越标准化和产业化起来:我们有无数的指标可供监控,无数的工具可供使用。但问题是这真的让我们的工作更轻松了吗?更有效的帮助我们发现了问题所在吗?指标在被行业一轮又一轮的发明过程中,我们得到的噪声似乎多过有意义的声音。例如指标之间可能是矛盾的,标准化的答案可能并非最佳。这位高手将带领大家重新审视当下性能优化的现状,从实例出发一步一步去破解性能优化工作中常见思维惯性,来看看如何跳出常规做到更好。

演讲大纲:

  • 审视现状

  • 实例解析

  • 通过实例 1 来看看现状存在的问题

  • 整理并解答上述问题

  • 看业界是如何解决上述问题的

  • 强化解决方案:通过实例 2 来看这个解决方案在工作中是如何落地的

  • 继续审视更复杂的落地方案实例 3

  • 审视实例 3 落地中的问题

  • 引出更大的问题:探讨性能优化在工作中的尴尬境地。并给出建议

  • 结语

演讲嘉宾:

李光毅 Thoughtworks 高级咨询师

先后加入过爱奇艺、百度、知乎,目前就职于 ThoughtWorks。编写过图书《高性能响应式 web 开发实战》,翻译出版图书《编程原则》 。精通前端技术和网站性能优化。个人网站 v2think.com

除前端工程与性能优化方向外,本届大会策划的专题还包括低代码探索与实践、Web 开发、云原生技术架构、业务架构、分布式数据库等多个热点技术,由来自字节、阿里、腾讯、快手、微软等公司具备技术影响力与洞察力的行业专家负责议题把控。

目前大会出品人已全部集齐,讲师阵容即将确认完毕。

除了为期两天的沉浸式内容体验,稀土开发者大会还为万千开发者朋友们准备了丰厚的奖品,报名参会的开发者将有机会**参与抽奖,**赢取丰厚大奖,敬请期待 。