课程简介
专注于前端全链路的性能优化
目标收益
培训对象
正在从事传统PC端Web页面的技术开发人员。
希望从事移动端WebApp应用开发的技术人员。
对前端技术感兴趣,希望从事这方面工作的人员。
掌握一些传统的前端开发技术,想进一步学习移动端应用开发的人员。
课程大纲
1.图片与页面文件优化 |
1.1如何为不同格式的图片选择合适的应用场景 1.2怎样让图片加载得更快 1.3在服务器端进行图片自动优化的原理是什么 1.4怎样精简优化HTML的代码结构 1.5CSS的优化应该遵循哪些原则 |
2.JavaScript 优化 |
2.1如何提升JavaScript的执行效率 2.2如何对JavaScript的缓存进行优化 2.3如何选择合适的模块化加载方案 2.4怎样才能减少浏览器的回流和重绘 2.5怎样控制DOM大小并简化DOM操作 |
3.静态文件与构建工具优化 |
3.1有哪些常用的压缩工具 3.2怎样打包才更合理 3.3版本号更新,你应该遵循哪些策略 3.4常用的前端构建工具有哪些?如何选型 3.5提升webpack打包效率的6个小技巧 |
4.页面渲染优化 |
4.1你是否清楚浏览器的渲染过程 4.2主流的页面渲染技术架构和方案有哪些 4.3JSP是如何同步渲染出页面的 4.4动态页面静态化要如何实施 4.5如何正确理解和实现前后端分离 |
5.服务端与网络优化 |
5.1如何合理配置CDN缓存 5.2主流的DNS优化方法有哪些 5.3如何减少HTTP请求数 5.4减少Cookie大小的策略和益处 5.5缓存配置和优化方案 5.6如何开启和配置gzip压缩 5.7如何开启全站HTTPS 5.8升级HTTP2的好处有哪些?如何升级 |
6.前后端分离优化性能 |
6.1前端分离前存什么问题 6.2如何解决分离前存在的问题 6.3中间件有哪些不可替代的优势 6.4前后端分离的应用方案有哪些 6.5什么是BigPipe?你了解它的工作原理吗 |
7.研发流程优化 |
7.1如何优化前端团队的研发流程 7.2前端和后端如何开展更高效的合作 7.3有哪些主流的技术方案?如何选型 7.4有哪些方案可供选择?如何部署 7.5如何有效提升团队整体的代码质量 |
8.全链路质量监控体系建设 |
8.1如何对HTML5的质量做即时检测 8.2如何进行HTML5的性能和错误监控 8.3如何进行线上业务的基调监控 8.4如何进行App的性能和错误监控 |
1.图片与页面文件优化 1.1如何为不同格式的图片选择合适的应用场景 1.2怎样让图片加载得更快 1.3在服务器端进行图片自动优化的原理是什么 1.4怎样精简优化HTML的代码结构 1.5CSS的优化应该遵循哪些原则 |
2.JavaScript 优化 2.1如何提升JavaScript的执行效率 2.2如何对JavaScript的缓存进行优化 2.3如何选择合适的模块化加载方案 2.4怎样才能减少浏览器的回流和重绘 2.5怎样控制DOM大小并简化DOM操作 |
3.静态文件与构建工具优化 3.1有哪些常用的压缩工具 3.2怎样打包才更合理 3.3版本号更新,你应该遵循哪些策略 3.4常用的前端构建工具有哪些?如何选型 3.5提升webpack打包效率的6个小技巧 |
4.页面渲染优化 4.1你是否清楚浏览器的渲染过程 4.2主流的页面渲染技术架构和方案有哪些 4.3JSP是如何同步渲染出页面的 4.4动态页面静态化要如何实施 4.5如何正确理解和实现前后端分离 |
5.服务端与网络优化 5.1如何合理配置CDN缓存 5.2主流的DNS优化方法有哪些 5.3如何减少HTTP请求数 5.4减少Cookie大小的策略和益处 5.5缓存配置和优化方案 5.6如何开启和配置gzip压缩 5.7如何开启全站HTTPS 5.8升级HTTP2的好处有哪些?如何升级 |
6.前后端分离优化性能 6.1前端分离前存什么问题 6.2如何解决分离前存在的问题 6.3中间件有哪些不可替代的优势 6.4前后端分离的应用方案有哪些 6.5什么是BigPipe?你了解它的工作原理吗 |
7.研发流程优化 7.1如何优化前端团队的研发流程 7.2前端和后端如何开展更高效的合作 7.3有哪些主流的技术方案?如何选型 7.4有哪些方案可供选择?如何部署 7.5如何有效提升团队整体的代码质量 |
8.全链路质量监控体系建设 8.1如何对HTML5的质量做即时检测 8.2如何进行HTML5的性能和错误监控 8.3如何进行线上业务的基调监控 8.4如何进行App的性能和错误监控 |