⚠️ 重要提醒:课程资源里面的所有加微信什么的不要信,上当受骗与本站无关。

📚 课程介绍

本课程深入探讨前端性能优化,涵盖前沿解决方案,包括资源加载、渲染优化、构建优化等方面,旨在提升前端开发效率和用户体验。

📋 学习前提

1. HTML/CSS基础(网页结构和样式语言) 2. JavaScript基础(网页交互编程语言) 3. 熟悉前端工程化工具(如Webpack)

⭐ 推荐指数

⭐⭐⭐⭐☆ (4/5星)

📖 课程目录

第1章 课程介绍

1-1 课程导学

第2章 性能优化的指标和工具

2-1 为什么要进行Web性能优化

2-2 性能指标和优化目标

2-3 RAIL测量模型

2-4 使用WebPageTest评估Web网站性能

2-5 使用LightHouse分析性能

2-6 使用Chrome DevTools分析性能

2-7 常用的性能测量APIs

第3章 渲染优化

3-1 浏览器渲染原理和关键渲染路径

3-2 回流与重绘, 如何避免布局抖动

3-3 使用FastDom

3-4 复合线程与图层

3-5 避免重绘

3-6 高频事件防抖

3-7 React时间调度实现

第4章 代码优化

4-1 JS开销和如何缩短解析时间

4-2 配合V8 有效优化代码

4-3 函数优化

4-4 对象优化

4-5 HTML优化

4-6 CSS对性能的影响

第5章 资源优化

5-1 资源的压缩与合并

5-2 图片格式优化

5-3 图片加载优化

5-4 字体优化

第6章 构建优化

6-1 webpack的优化配置

6-2 webpack的依赖优化

6-3 React按需加载的实现方式

6-4 手把手教你做webpack的资源压缩

6-5 基于webpack的持久化缓存

6-6 基于webpack的应用大小监测与分析

第7章 传输加载优化

7-1 启用压缩Gzip

7-2 启用Keep Alive

7-3 HTTP资源缓存

7-4 一次性理解Service workers技术,给网站提速

7-5 HTTP 2的性能提升

7-6 用流行的SSR技术给前端减负

第8章 前沿优化解决方案

8-1 拯救移动端图标SVG

8-2 使用Flexbox优化布局(上)

8-3 使用Flexbox优化布局(下)

8-4 优化资源加载的顺序

8-5 预渲染页面

8-6 Windowing提高列表性能

8-7 使用骨架组件减少布局移动

第9章 性能优化问题面试指南

9-1 Web加载&渲染基本原理

9-2 首屏加载优化

9-3 JavaScript 内存管理

第10章 互联网外企offer与立足之道

10-1 互联网外企offer

10-2 英语与工作

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。