課程簡(jiǎn)介

《大前端性能優(yōu)化實(shí)戰(zhàn)》課程從項(xiàng)目組織協(xié)同、核心技術(shù)選型、開發(fā)構(gòu)建工作流設(shè)計(jì)、技術(shù)架構(gòu)設(shè)計(jì)、工程化架構(gòu)思路、持續(xù)集成部署等角度出發(fā)，深度剖析前端現(xiàn)代化性能優(yōu)化的方案。
課程中既有優(yōu)秀工程案例分析，工具深度使用實(shí)踐，也有源碼深入解讀；既有工具鏈整合方案，也有體系化協(xié)同串聯(lián)。能夠幫助學(xué)習(xí)者快速理解性能優(yōu)化化方案，以及順滑流暢的工作流機(jī)制。

目標(biāo)收益

? 理解性能優(yōu)化方面的數(shù)據(jù)思維
? 從基礎(chǔ)建設(shè)和工程化角度，提升開發(fā)效率
? 從基礎(chǔ)建設(shè)和工程化角度，優(yōu)化應(yīng)用性能
? 開拓技術(shù)視野，理解現(xiàn)代化前端工程設(shè)計(jì)方案
? 脫離重復(fù)瑣碎的業(yè)務(wù)開發(fā)，系統(tǒng)地了解基礎(chǔ)建設(shè)的方方面面
? 落地實(shí)踐性能優(yōu)化案例，整合工作流程

培訓(xùn)對(duì)象

? 3 年以上經(jīng)驗(yàn)的前端開發(fā)工程師
? 面臨技術(shù)瓶頸的前端團(tuán)隊(duì)
? 負(fù)責(zé)技術(shù)方案制定和基礎(chǔ)建設(shè)的資深工程師
? 缺少新技術(shù)指引、缺少接觸優(yōu)秀項(xiàng)目機(jī)會(huì)的前端團(tuán)隊(duì)

課程內(nèi)容

一、前端性能分識(shí)與優(yōu)化實(shí)踐
- 如何理解性能和用戶體驗(yàn)
- 極致體驗(yàn)優(yōu)化方法框架
- 從 RAIL 模型到 Performance Metrics
- 適應(yīng)新時(shí)代的指標(biāo)體系演進(jìn)和度量
- 用戶體驗(yàn)指標(biāo)數(shù)據(jù)收集和分析體系建立和落地

二、前端性能優(yōu)化方案實(shí)踐
- 離線包方案設(shè)計(jì)，大廠案例 xxx
- 搭建端到端性能監(jiān)控體系，大廠案例 xxx
- 結(jié)合 DevOPS 實(shí)現(xiàn)性能優(yōu)化把關(guān)，大廠案例 xxx

三、性能優(yōu)化再剖析
- 從工程化角度，實(shí)現(xiàn)多模態(tài)渲染優(yōu)化
- 從代碼角度，實(shí)現(xiàn)運(yùn)行時(shí)交互優(yōu)化
- 框架和性能優(yōu)化

四、性能優(yōu)化和技術(shù)架構(gòu)選型
- SSR 方案實(shí)踐和 SSG、ISR 渲染技術(shù)落地，大廠案例 xxx
- 實(shí)戰(zhàn)案例 xxx 使用 chrome devtool 分析運(yùn)行時(shí)內(nèi)存和 CPU 性能
- 跨端性能優(yōu)化原理，大廠案例 xxx
- 項(xiàng)目用戶體驗(yàn)優(yōu)化真實(shí)案例，大廠案例 xxx
- 工程化技術(shù)助力用戶體驗(yàn)優(yōu)化案例分析，大廠案例 xxx
- 典型應(yīng)用架構(gòu)性能優(yōu)化場(chǎng)景解析，大廠案例 xxx

五、性能優(yōu)化工具的奧秘
- 實(shí)戰(zhàn)案例 xxx 使用 chrome devtool 分析運(yùn)行時(shí)內(nèi)存和 CPU 性能
- 使用用戶體驗(yàn)分析工具分析頁(yè)面上的性能瓶頸
- 沙箱實(shí)戰(zhàn) 手把手實(shí)現(xiàn)性能診斷和瓶頸突破

總結(jié)：
– 用戶體驗(yàn)優(yōu)化精益求精和未來(lái)趨勢(shì)
- 性能優(yōu)化方法論可移植性案例
- 當(dāng)通用優(yōu)化已完成，我們應(yīng)該做什么？