如何进行前端性能优化？（进来康康）

写在前面

        晚上好呀朋友们，今天讲点高级的，我们前端程序员，写出来代码是一回事，跑起来是另一回事，而跑得更快，则是另一个层次了。今天我们讲前端性能优化的那点事。

1、减少 http 请求

        减少 HTTP 请求的方案主要有：合并 JavaScript 和 CSS文件、合并图片 CSS Sprites、图像映射（Image Map）和使用 Data URI 来编码图片，图片较多的页面也可以使用 lazyLoad 等技术进行优化。

2、减少对 DOM 的操作

        修改和访问 DOM 元素会造成页面的 Repaint（重绘）和 Reflow（重排），循环对 DOM 操作更是不推荐的行为。所以合理的使用 JavaScript 变量储存内容，考虑大量 DOM 元素中循环的性能开销，在循环结束时一次性写入。

        减少对 DOM 元素的查询和修改，查询时可将其赋值给局部变量。

        注：在 IE 中:hover 会降低响应速度。

3、使用 JSON 格式来进行数据交换

        JSON 是一种轻量级的数据交换格式，采用完全独立于语言的文本格式，是理想的数据交换格式。

        同时，JSON 是 JavaScript 原生格式，这意味着在 javaScript 中处理 JSON 数据不需要任何特殊的 API 或工具包。与 XML 序列化相比，JSON 序列化后产生的数据一般要比 XML 序列化后数据体积小。

4、高效使用 HTML 标签和 CSS 样式

        HTML 是一门标记语言，使用合理的 HTML 标签前你必须了解其属性，比如 Flow Elements，Metadata Elements ，Phrasing Elements。比较基础的就是要知道块级元素和内联元素、盒模型、SEO 方面的知识。

        CSS 是用来渲染页面的，也是存在渲染效率的问题。CSS 选择符是从右向左进行匹配的，当页面被触发引起回流（reflow）的时候，低效的选择符依然会引发更高的开销，所以要避免低效。

5、使用 CDN 加速（内容分发网络）

        其基本思路是尽可能避开互联网上有可能影响数据传输速度和稳定性的瓶颈和环节，使内容传输的更快、更稳定。通过在网络各处放置节点服务器所构成的在现有的互联网基础之上的一层智能虚拟网络，CDN 系统能够实时的根据网络流量和各节点的连接、负载状况以及到用户的距离和响应时间等综合信息将用户的请求重新导向离用户最近的服务节点上。

6、将 CSS 和 JS 放到外部文件中引用，CSS 放头，JS 放尾

7、精简 CSS 和 JS 文件

8、压缩图片和使用图片 Sprite 技术

9、注意控制 Cookie 大小和污染

        因为 Cookie 是本地的磁盘文件，每次浏览器都会去读取相应的 Cookie，所以建议去除不必要的Coockie，使 Coockie 体积尽量小以减少对用户响应的影响；

        使用 Cookie 跨域操作时注意在适应级别的域名上设置 coockie 以便使子域名不受其影响Cookie 是有生命周期的，所以请注意设置合理的过期时间，合理地 Expire 时间和不要过早去清除coockie，都会改善用户的响应时间。

写在最后

        以上就是今天的所有内容啦，再会。