前端性能优化一：合并css\javascript

静态资源打包，因为浏览器下载静态文件的时候是有线程数限制的：同一时间针对同一域名下的请求有一定数量限制，超过限制数目的请求会被阻塞。为了提高性能，服务器端会把js/css合并成一个文件，再向客户端输出，这样页面能更快的展现，用户等待的时间就会减少，你留住用户的机会将会大大增加。

 
原html代码：

<script type="text/javascript"
src="http://yui.yahooapis.com/2.5.2/build/yahoo-dom-event/yahoo-dom-event.js"></script>
<script type="text/javascript"
src="http://yui.yahooapis.com/2.5.2/build/container/container_core-min.js"></script>
<script type="text/javascript"
src="http://yui.yahooapis.com/2.5.2/build/menu/menu-min.js"></script>
<script type="text/javascript"
src="http://yui.yahooapis.com/2.5.2/build/element/element-beta-min.js"></script>
<script type="text/javascript"
src="http://yui.yahooapis.com/2.5.2/build/button/button-min.js"></script>
<script type="text/javascript"
src="http://yui.yahooapis.com/2.5.2/build/editor/editor-beta-min.js"></script>

在一个没有cache缓存的机器上，此代码会产生6个http请求，而且此6个htt请求不能并发执行，导致加载变慢

合并：

<script type="text/javascript"
src="http://yui.yahooapis.com/combo?2.5.2/build/yahoo-dom-event/yahoo-dom-event.js,
2.5.2/build/container/container_core-min.js,2.5.2/build/menu/menu-min.js,
2.5.2/build/element/element-beta-min.js,2.5.2/build/button/button-min.js,
2.5.2/build/editor/editor-beta-min.js"></script>

优化结果：下载6个单独的js共需要190毫秒左右，而将6个js合并为一个需要30毫秒左右，耗时和一个单独的js文件差不多。

一个没有cache缓存的机器上，此代码会仅产生1个http请求，虽然下载的总字节数没有变，但是将减少了浏览器和服务器之间的http请求次数，相应减少了http请求的通信量和http响应的通信量。