课程简介
JavaScript 已经成为目前最为流行的前端开发语言,但是在使用过程中由于浏览器的工作
方式不同,JavaScript 代码执行性能有很大差别。本课程将就常见的性能相关问题张开介
绍,并着重介绍如何进行优化的 JavaScript 性能开发。]
目标收益
深入了解 JavaScript 工作方式
掌握如何基于不同浏览器性能最优的编写 JavaScript
使用 chrome dev 等工具进行性能调试
培训对象
使用 JavaScript 的前端开发人员
课程大纲
浏览器工作方式介绍 |
HTML 引擎工作方式及特点 JavaScript 引擎工作方式及特点 常见浏览器厂商的产品特性 移动端浏览器行为的特点 |
JavaScript 代码优化 |
加载与执行 JavaScript 脚本的加载和执行是阻塞模式,为了提高性能应该调节加载位置和顺序。 数据访问 JavaScript 中使用不同的数据类型来存储数据,会有完全不同的执行性能,这里专注介绍该使用何种方 式进行数据存储以提高性能 DOM 元素的遍历 专门介绍针对不同浏览器该使用何种方式来遍历页面元素以提高性能 流程控制优化 算数表达式和流程控制部分介绍通过优化循环和比较流程优化程序性能 响应模式优化 开发体验中最糟糕的莫过于点击页面无响应,此内容介绍如何提 UI 响应性能机制 |
JavaScript 代码组织方式介绍 |
JavaScript 与面向对象 使用 function 在 ECMAScript 5 规范下模拟类和继承 ECMAScript 6 严格语法模式中接口的定义与实现 AMD 异步模块定义的使用 MVC 模型框架与实现 MVP 模型框架与实现 JavaScript 的模块化 与动态装载管理 |
JavaScript 开发工具与调试工具介绍 |
Chrome 调试工具介绍 使用 Jasmine+Karma 进行单元测试 使用 selenium 进行 E2E 测试 |
浏览器工作方式介绍 HTML 引擎工作方式及特点 JavaScript 引擎工作方式及特点 常见浏览器厂商的产品特性 移动端浏览器行为的特点 |
JavaScript 代码优化 加载与执行 JavaScript 脚本的加载和执行是阻塞模式,为了提高性能应该调节加载位置和顺序。 数据访问 JavaScript 中使用不同的数据类型来存储数据,会有完全不同的执行性能,这里专注介绍该使用何种方 式进行数据存储以提高性能 DOM 元素的遍历 专门介绍针对不同浏览器该使用何种方式来遍历页面元素以提高性能 流程控制优化 算数表达式和流程控制部分介绍通过优化循环和比较流程优化程序性能 响应模式优化 开发体验中最糟糕的莫过于点击页面无响应,此内容介绍如何提 UI 响应性能机制 |
JavaScript 代码组织方式介绍 JavaScript 与面向对象 使用 function 在 ECMAScript 5 规范下模拟类和继承 ECMAScript 6 严格语法模式中接口的定义与实现 AMD 异步模块定义的使用 MVC 模型框架与实现 MVP 模型框架与实现 JavaScript 的模块化 与动态装载管理 |
JavaScript 开发工具与调试工具介绍 Chrome 调试工具介绍 使用 Jasmine+Karma 进行单元测试 使用 selenium 进行 E2E 测试 |