收藏网站

使用 Ctrl+D 可将网站添加到书签

/ 实战 / 前端性能优化企业级解决方案 6大角度+大厂视野实现项目全面优化

前端性能优化

掌握行业实用、专业、前沿的解决方案

只要项目还在用，性能优化永远是时刻要关注的问题

难度中级时长 12小时学习人数 456 综合评分 9.97

立即购买加购物车

性能优化是一个前端必然会面对的问题。前端技术日新月异，优秀的性能优化方案在近几年也层出不穷。本课程，我会带你使用当今行业中非常前沿&专业的方案，解决前端性能优化问题。

Mr_Max

讲师

资深架构师

课程预览

检测到您还没有关注慕课网服务号，无法接收课程更新通知。请扫描二维码即可绑定

重新观看

性能永远是第一需求能够解决性能问题的人才永远是香饽饽

只要比别人掌握更多的性能优化方案，你就比别人更有竞争力

项目越大，对性能要求越高

企业级项目标配

大厂项目，性能永远是第一需求

没有做性能优化的项目，都不是企业级的

中高级开发者能力标准

懂性能才能对技术更理解

不懂性能优化，永远成不了高级工程师

每一个技术，背后的原理一定和性能有关联

世界500强架构师，拿出压箱底前端性能优化方案

大牛总结性能优化方案用了10年，而你只需要这一门课

性能优化的指标和工具

性能指标和
优化目标

RAIL测量模型

WebPageTest评估
网站性能

使用LightHouse
分析性能

使用Chrome DevTools
分析性能

常用的性能测量APIs

渲染优化

现代浏览器网页渲染原理——大厂面试考点
深入了解关键渲染路径，减少回流与重绘
防止布局抖动(Layout Thrashing)
GPU加速避免重绘，加速页面呈现

代码优化

JS的开销&缩短JS解析时间&JS代码优化
前端修仙之路 - V8编译原理
HTML优化-前端必知必会
CSS优化-现代优化方案

资源优化

资源的合并与压缩
图片格式的选择: JPG vs PNG vs WebP
图片加载优化: 懒加载、渐进式图片、响应式图片
字体优化

构建优化

webpack的优化配置
webpack的依赖优化
基于webpack的代码拆分/资源压缩/资源持久化缓存
React按需加载实现方式

传输加载优化

必学必会: Gzip& Keep Alive
HTTP资源缓存
Service Worker 实现渐进式应用
HTTP/2加速传输
SSR加速渲染

前沿优化解决方案

拯救移动端图标 – SVG/Flexbox优化布局
优化资源加载的顺序/预渲染页面
Windowing(窗口化)提高列表性能
使用骨架组件减少布局移动(Layout Shift)

性能优化---晋级提升的尚方宝剑

前端的流行技术的“内幕”+技术背后的优秀设计思想+一线大厂正在使用的前沿解决方案

世界500强架构师

带来大师级性能优化思维

测量工具+解决方案（专业！）

了解行业性能标准，针对性解决

详解性能优化大厂方案

学完拿去用在自己的项目中

对比学生实例

看到性能解决方案之间的差距

搞定性能优化面试问题

互联网公司面试点+实际应用

学习大牛思维

提高能力的捷径就是跟随大牛

学员专享增值服务

问答专区

讲师集中答疑

关于课程的问题都可在问答区随时提
问，讲师会进行集中答疑

源码开放

提供完整代码

课程案例代码完全开放给你，你可以根据
所学知识，自行修改、优化

适合人群

1-3年开发经验的前端开发者
初入社会的毕业生

技术储备要求

HTML/CSS/JS基础
基本的Webpack, React, Node.js知识

环境参数

webpack 4.43
Babel 7.10
node 11

提问

数据加载中...

意见反馈帮助中心 APP下载

官方微信

热搜

最近搜索清空

前端性能优化

掌握行业实用、专业、前沿的解决方案

只要项目还在用，性能优化永远是时刻要关注的问题

前端性能优化企业级解决方案 6大角度+大厂视野实现项目全面优化