雅虎军规第一天

前端，我一直觉得到了一定程度，那些大牛开发项目已经是拼细节了，因为大方向都是不变的，重要的就是对于细节的把控和对前端的优化。

很不才，做了一年多的前端，对于优化还是没有一个很好的概念，而也是最近才知道有一个前端优化的军规，就是雅虎军规。记录一下本人对雅虎军规的理解，不想看小白啰嗦的可以自行百度雅虎军规。

雅虎军规到现在为止有35条，给我们对于前端的优化有了一个清晰的方向。但是很多平时开发没遇见或者根本没概念的我都只会随意介绍，都清自行百度。

1、尽量减少HTTP请求

作为前端，我们都知道，前端对于网络的要求很高，没有网，你的网页就没办法打开，不像原生的东西，没网起码还能看见一些东西。可以说前端就是一个请求加载的过程。减少HTTP请求并不是特指ajax之类的，我们的图片、js、css等都是要通过HTTP请求得来的。

那怎么做可以减少HTTP请求呢？合并文件，我们都知道，每个页面都有自己的js和css，那么要是我们把所有脚本合并一起，只请求一个文件，也就只有一次HTTP请求，当然，对于不同页面要合并是一项很麻烦的事，但是合并文件确实可以提高响应时间。使用雪碧图，在我们看来，雪碧图很土，也很难看，但不可否认，浏览器会缓存图片，请求一次的图片，下次使用的时候浏览器会优先从缓存的资源里面找。另外还有图像映射和行内图片，但是个人认为不利于开发，包括合并文件和使用雪碧图对于开发也是不利的。但减少HTTP请求对于提升访问速度是一条重要准则。

2、减少dns查找

对于dns查找，可以详细去了解一下浏览器从输入地址到页面渲染的过程，这个过程就有解析域名的过程，所以才会有cdn加速的说法。

3、避免重定向

4、ajax缓存

关于ajax缓存，说真的，也是一点概念没有，欢迎大佬指教

5、优先加载需要组建，延迟加载可以延后的组件

很简单，我们页面刚打开的时候，最上面的是最先显示的，那么在这个过程中是不是能优先加载立马需要显示的部分，另外后面的显示可以延迟加载的就等优先显示的加载完成后再加载，这样可以给用户一个加载很快的感觉。

6、预加载

相信很多都听过预加载图片，其实预加载就是这个套路，比如我们一个切换显示好多张图片，在第一张图片显示的时候，另外的图片就可以先加载好了，切换显示隐藏，而不是切换图片。图片设置隐藏的时候其实浏览器已经帮你加载好了。

7、减少DOM元素

很明显，减少DOM那么对于标签和css有很高要求。一个页面，一个用了50000个DOM元素和一个只用了50个DOM元素比起来，区别显而易见。我就见过一个简单的布局，标签加css用了将近200行代码，我想了一下，要是我，估计50行左右就能完成。所以在写页面的时候，对于页面的布局还是要有一个良好的代码习惯和规范，总不能span标签里面写p标签。

8、跨域分离组件

简单点说就是一台服务器允许访问100人，那么你用三台服务器，效率自然能提高，但是会有dns查找的代价。

9、少用iframe

自行百度。

10、杜绝404

这是雅虎军规的内容部分，先介绍到这里。

（完）

Coding 个人笔记