By XFE-堪玉
阅读《高性能javascript》后，对其内容的一个整理和精简
加载与执行
- 将script标签放在body结尾标签上面
- 控制script标签数量(每一次script解析都意味着阻塞或延迟)
- 内嵌脚本不要放在link样式之后
- 对script标签应用defer属性
- 动态创建script标签加载js文件(模块化框架即可)
数据存取
- 不影响this的情况下，对反复访问的对象进行变量保存
- 合理使用局部变量，减少作用域跨越
- 避免使用with和eval
- 谨慎地使用闭包
- 减少Object对象的层次访问，避免过长的属性读取(es6解构赋值)
DOM编程
- 尽量用新的选择器api代替老的，尽量用dom克隆替代dom创建
- html集合操作非常昂贵，可转换为数组再进行操作，同时使用局部变量缓存操作
- 对dom访问信息进行缓存，对dom改变进行批量操作
- 对操作频繁的dom，尽可能采用position:absolute
- 对操作密集的dom，先display:none——>操作——>再display:block
- 对操作量很大的dom，采用文档碎片createDocumentFragment
- 合理使用事件委托，避免对dom进行逐个事件绑定
算法和流程控制
- 减少使用for...in循环
- 条件判断上，避免类型转换
- 条件较多时，使用switch代替if..else
- 最小化语句数，避免多个var声明，插入迭代值——arr[i++]
- 简化终止条件，简化循环体，减值迭代
- 展开循环(在次数不多的情况下)
字符串与正则表达式
- 减少字符串拼接，避免"临时字符串"的出现
- 当叠加字符串的时候，字符串变量应该靠左
- 数组join方法比其他字符串连接方式慢
- 字符串concat方法比使用简单的+和+=慢
- 正则优化(个人略过...)
快速响应的用户界面
- 对于异步操作的任务，可使用定时器分解任务，分割循环项
- 定时器最小延迟建议为25毫秒，应避免高频定时器的数量
- 合理使用web workers
Ajax
- 对那些不会改变服务器状态，只获取数据的请求，应该使用get类型（会被游览器缓存起来，有利于性能）
- 如果你只关心发送数据到服务器，可以使用图标信标（img.src="请求地址"）
- 使用能被http缓存的get查询请求的时候，应该同时在服务端设置Expires头信息（过期时间）
- 本地设置缓存（变量缓存与storage缓存）
编程实践
- 避免使用eval,Function,setTimeout和setInterval去执行需要解析的字符串代码
- 对数组和对象使用字面量进行创建，而非构造器模式
- 涉及计算的过程，应该尽量用原生方法(Math)，合理使用位运算符
构建并部署高性能javascript应用
- 合并js，减少http请求
- 压缩js，降低请求大小
- 设置Accept-Encoding HTTP请求头，对js进行gzip压缩
- 设置Expires HTTP响应头，对js文件进行过期时间缓存(客户端使用时间戳更新js文件)
- 使用内容分发网络CDN
工具
- javascript的性能分析简单的分析可以通过Date日期和Log函数，推荐使用当前的集成测试和单元测试
- 每个游览器都具备各种的检查器和资源面板，可以通过分析得出一些javascript性能的数据