BSU网站加速技术

源地址：

       前端开发的兴起就像是今年北京的{dy}场雪，给人“忽如一夜春风来，千树万树梨花开”得感觉。09年10月份前端{dy}个班开学的时候，我在招聘网站上搜索了下前端开发，包括chinahr、智联等等，一个月内的的招聘信息中竟然没有一个是招聘前端开发。然而现在搜索一下，关于前端开发的招聘信息每天更新出几百个。前端开发好像是上了春晚的小沈阳，一下就火了。

对于这种“火”，我并不是十分的乐观，总觉着这是不正常的火，隐隐的感觉到将来有{yt}会有人开始批判前端开发。仔细想下，这种担心并不是杞人忧天。因为国内就有这种氛围，iPhone一上市，一些伪iPhone紧跟着就上市。可以想象“伪前端开发”必然会在将来的一段时间横行无忌。

今天不想分析这些“伪前端开发”，而是跟大家介绍下我们博看科技和博看文思的前端人员总结出的网页加速技术。严格的说，这并不是一门全新的技术，而是把涉及到网页提速的技术总结提炼系统化。需要对前端开发的各项技术有深入的了解，需要熟悉影响网速的因素，需要了解服务器与客户端之间的交互方式以及DNS的相关知识。我们把这个新技术成为“BSU网站加速技术”（BrowserSpeedUp）。

首先，我们一起看下影响网页打开速度的因素：

{dy}：客户端因素（网速、硬件配置、软件因素如浏览器类型，是否有影响网速的病毒等等）

第二：服务器因素（服务器的速度、负载量、DNS服务器地址等等）

第三：网站的质量

对于{dy}个因素，正常情况下我们是无法干涉的，我们不能要求用户用什么样的浏览器或者用多大的带宽，对于第二个，技术含量较低，也是传统的提高网站速度的入手点，也就是多花点钱，换个好点的服务器，把服务器地址放到访问比较多的地区，或者在几个地区分别架设服务器。

第三点正是我要提的重点，从技术角度入手，调高网站的质量，从网站角度出发，看下影响网页打开速度的几大原因：

{dy}：网页的代码量，这个是{zh0}理解的了，网页打开的过程就是浏览器从服务器端下载完代码后解析展示的过程，代码量越少，自然下载的越快，打开的也相对快些。

第二：图片和flash的多少，图片的多少直接影响到页面的打开速度，首先是因为图片本身相对较大，下载时耗时较长；其次也是最重要的影响是交互问题，浏览器每碰到一个图片，都会向服务器提交一次请求，服务器处理完给出响后下载，如果图片数目繁多，提交请求的次数必然多，处理请求和响应时间较长，非常严重的拖慢网页打开速度。对于flash，flash本身使用的图片数量较多，内容较大，更重要的flash在iPhone等新兴平台上不能正常浏览。所以非必要情况下，前端效果建议用js实现。

第三：网页代码的质：这个是涉及到专业技术的熟练度以及代码优化的思想，并且要了解不同js算法的解析速度。

BSU网站加速技术就是利用上面的三点引申出来的技术：

首先，去掉页面里不必要的块或者js效果，从而减少页面的loading量，这是最简单的提速方法，效果也显著，但是会改变原来的显示效果。

其次：背景图合并技术，通过xx地CSS设置（需要xx到1px），使用背景图合并技术，特别是小图合并，尽量减少图片数量。需要熟练的CSS和PS合图技术（具体技术参考 与）。

{zh1}：提高代码的质，这个是最难说明也是最需要项目经验的技术，需要对整个页面有很好的布局思想，对设计图有较高的抽象能力，尽量少的使用CSS，适当的设置通用类，熟悉不同CSS引入方式特点（）。标签的默认属性及使用（例如：，还有大量其他的标签。）以及js的代码的质量（参考前文：悟透JavaScript（一）——（四））。前端经常使用的js框架如简洁的jquery也是前端开发必不可少的利器，在实现动态效果上可以减少大量的代码以及开发工作量。

当然，这里也只是BSU网站加速技术的雏形，日后还会进一步丰富和完善。