`

高性能WEB开发之减少请求、响应的数据量

 
阅读更多

 

这次说说如何减少请求、响应的数据量(即在网络中传输的数据量),减少传输的数据量不仅仅可以加快页面加载速度,更可以节约服务器带宽,为你剩不少钱(好像很多机房托管都是按流量算钱的).

AD:

 

上一篇中我们说到了 如何减少请求数,这次说说如何减少请求、响应的数据量(即在网络中传输的数据量),减少传输的数据量不仅仅可以加快页面加载速度,更可以节约服务器带宽,为你剩不少钱(好像很多机房托管都是按流量算钱的)。

GZIP压缩

gzip是目前所有浏览器都支持的一种压缩格式,IE6需要SP1及以上才支持(别说你还在用IE5,~_~)。gzip可以说是最方便而且也是最大减少响应数据量的1种方法。

说它方便,是因为你不需要为它写任何额外的代码,只需要在http服务器上加上配置都行了,现在主流的http服务器都支持gzip,各种服务器的配置这里就不一一介绍(其实是我不知道怎么配),

nginx的配置可以参考我这篇文章:www.blogjava.net/BearRui/archive/2010/01/29/web_performance_server.html

我们先看看gzip的压缩比率能达到多少,这里用jquery 1.4.2的min和src2个版本进行测试,使用nginx服务器,gzip压缩级别使用的是4:


注意看上图的红色部分,jquery src文件在启用gzip后大小减少了70%


这张图片可以看出就算是已经压缩过min.js在启用gzip后大小也减少了65%。

别对图片启用gzip

在知道了gzip强大的压缩能力后,你是否想对服务器上的所有文件启用gzip了,先让我们看看图片中启用gzip后会是什么情况。


hoho,1个gif图片经过gzip压缩后反而变大了???这是因为图片本来就是一种压缩格式,gzip不能再进行压缩,反而会添加1些额外的头部信息,所以图片会变大。

在测试过程中,发现jpg的图片经过gzip压缩后会变小,不知道为何,可能跟图片压缩方式有关。不过压缩比率也比较小,所以就算是jpg,建议也不要开启gzip压缩。

比较适合启用gzip压缩的文件有如下这些:

1. javascript

2. CSS

3. HTML,xml

4、plain text

别乱用cookie

现在几乎没有哪个网站不使用cookie了,可是该怎么使用cookie比较合适了,cookie有几个重要的属性:path(路径),domain(域),expires(过期时间)。浏览器就是根据这3个属性来判断在发送请求的时候是否需要带上这个cookie。

cookie使用最好的方式,就是当请求的资源需要cookie的时候才带上该cookie。其他任何请求都不带上cookie。但事实上很多人在使用cookie的时候已经习惯性的设置成:path=/ domain=.domain.com。这样的结果就是不管任何请求都会带上cookie,就算你是请求的图片(img.domain.com)、静态资源服务器(res.domain.com)这些根本不需要cookie的资源,浏览器照样会带上这些没用的cookie。咱们一起来看现实中的1个列子,博客园(www.cnblogs.com):

先看看博客园的cookie是怎么设置的,下面是firefox查看博客园cookie的截图:


cnblogs总共有5个cookie值,而且全部设置都是 path=/ domain=.cnblogs.com。知道了cookie的设置后,我们再来监控下博客园首页的请求,监控的统计信息如下:

总请求数:39(其中图片22个,JS7个,css2个)。

其中js、css、image 主要来自3个静态资源服务器: common.cnblogs.com , pic.cnblogs.com ,static.cnblogs.com

再看其中1个请求图片(http://static.cnblogs.com/images/a4/banner_job.gif)的请求头:

Host static.cnblogs.com

User-Agent Mozilla/5.0 (Windows; U; Windows NT 5.2; en-US; rv:1.9.2.3) Gecko/20100401 Firefox/3.6.3 GTBDFff GTB7.0

Accept image/png,image/*;q=0.8,*/*;q=0.5

Accept-Language zh-cn,en-us;q=0.7,en;q=0.3

Accept-Encoding gzip,deflate

Accept-Charset ISO-8859-1,utf-8;q=0.7,*;q=0.7

Keep-Alive 115

Proxy-Connection keep-alive

Referer http://www.cnblogs.com/

Cookie __gads=ID=a15d7cb5c3413e56:T=1272278620:S=ALNI_MZNMr6_d_PCjgkJNJeEQXkmZ3bxTQ; __utma=226521935.1697566422.1272278366.1272278366.1272278366.1; __utmb=226521935.2.10.1272278366; __utmc=226521935; __utmz=226521935.1272278367.1.1.utmcsr=(direct)|utmccn=(direct)|utmcmd=(none)

我们发现在请求banner_job.gif这个图片的时候,浏览器把cnblogs.com的所有cookie都带上了(其他图片的请求都是一样的),我估计博客园在处理图片的时候应该不需要用到cookie吧?也许你认为这几个cookie的大小只有300个字节左右,无所谓啦。

我们做个简单的计算,假设博客园每天有50W个PV(实际情况应该不止吧),每次PV大概有15次请求静态资源,15*500000*300/1024/1024=2145M。也就说这几个cookie每天大概会耗费博客园2G的带宽。当然这种简单的计算方式肯定会有偏差,毕竟我们还没把静态资源缓存考虑进去。但是个人觉得要是博客园要是把cookie的domain设置为www.cnblogs.com会更好一些。

妙用204状态

http中200,404,500状态大家都很清楚,但204状态大家可能用的比较少,204状态是指服务器成功处理了客户端请求,但服务器无返回内容。204是HTTP中数据量最少的响应状态,204的响应中没有body,而且Content-Length=0。很多人在使用ajax提交一些数据给服务器,而不需要服务器返回的时候,常常在服务端使用下面的代码:response.getWriter().print(""),这是返回1个空白的页面,是1个200请求。它还是有body,而且Content-Length不会等于0。其实这个时候你完全可以直接返回1个204状态(response.setStatus(204))。204在一些网站分析的代码中最常用到,只需要把客户端的一些信息提交给服务器就完事,让我们看看google首页的1个204响应,google首页的最后1个请求返回的就是204状态,但这个请求是干嘛用的就没猜出来了:
 


  • 大小: 35.2 KB
  • 大小: 34.3 KB
  • 大小: 34.3 KB
  • 大小: 29.4 KB
  • 大小: 66.5 KB
分享到:
评论
1 楼 xzs603 2013-01-28  
http://developer.51cto.com/art/201104/256704.htm
http://www.webryan.net/2011/08/wiki-of-http-cookie/

相关推荐

    高性能web开发(2)

    ### 高性能Web开发之减少请求数策略详解 #### 一、引言 随着互联网技术的飞速发展,Web应用已经成为人们日常生活中不可或缺的一部分。然而,随着网页内容的日益丰富,网页加载速度逐渐成为用户体验的重要因素之一。...

    大数据量高性能前端表格grid 动态加载数据

    总的来说,大数据量高性能前端表格grid通过动态加载数据,结合高效的DOM管理和数据请求策略,实现了对大规模数据集的流畅展示,为用户提供了优质的交互体验。在实际项目中,开发者可以根据需求选择合适的工具和方法...

    高性能WEB开发(5) 减少请求,响应的数据量

    上一篇中我们说到了 如何减少请求数,这次说说如何减少请求、响应的数据量(即在网络中传输的数据量),减少传输的数据量不仅仅可以加快页面加载速度,更可以节约服务器带宽,为你剩不少钱(好像很多机房托管都是按流量...

    Nginx高性能Web服务器实战教程+高清+完整书签

    《Nginx高性能Web服务器实战教程》是一本深入讲解如何利用Nginx构建高效稳定Web服务的书籍。Nginx以其高性能、轻量级、反向代理和负载均衡等特性,已经成为许多企业和开发者首选的Web服务器。这本书涵盖了从基础配置...

    高性能WEB开发 为什么要减少请求数,如何减少请求数!

    在高性能的Web开发中,减少请求数是一个关键的优化策略,这主要涉及到HTTP协议的工作原理和网络传输的效率。每次浏览器向服务器发起一个HTTP请求,不仅...在追求高性能Web开发的过程中,优化HTTP请求是必不可少的一环。

    前端工程师-高级WEB网站前端开发减少请求数指南.docx

    减少请求数是提升网页性能的关键策略之一,因为每次HTTP请求都会带来额外的数据传输,包括请求头信息和可能的响应头信息,这在处理小资源时尤为明显,甚至可能导致请求数据量超过资源本身。以下是针对减少请求数的...

    构建高性能WEB站点(完整版)

    《构建高性能WEB站点》是一本全面探讨Web系统优化的著作,涵盖了从客户端浏览器到服务器端的各个关键环节,旨在帮助开发者和运维人员提升网站的性能和用户体验。这本书深入剖析了Web系统的瓶颈,并提供了实用的解决...

    nginx高性能web服务器.pdf

    《Nginx高性能Web服务器》是一本深入探讨Nginx技术的权威著作,它涵盖了Nginx的基础知识、配置技巧以及优化策略。Nginx,以其高性能、轻量级和反向代理能力著称,是现代互联网架构中的关键组件。在本资料中,我们将...

    利用Java开发高性能、高并发Web应用

    在Java开发领域,构建高性能、高并发的Web应用是一项核心任务。这涉及到多个技术层面的综合运用,包括但不限于系统架构设计、线程管理、数据访问优化、缓存策略、负载均衡以及性能监控等。以下是一些关键的知识点,...

    用C++做WEB开发

    如果你发现PHP在处理高并发或大数据量请求时表现得不够理想,那么转向C++进行Web开发可能是一个明智的选择。C++以其高效、低级特性和对内存管理的精细控制,能够为高性能Web应用程序提供强大的后盾。下面我们将详细...

    开发高性能的Web Service应用

    开发高性能的Web Service应用是确保系统稳定、响应快速的关键,这涉及到多个技术领域和优化策略。以下将详细介绍如何构建高性能的Web Service应用。 一、Web Service基础 1. Web Service定义:Web Service是一种...

    Flask+Web开发实战,flaskweb开发实战pdf,Python

    **Flask Web开发实战——Python Web开发的轻量级选择** Flask,作为一个轻量级的Python Web框架,自2010年开源以来,已经在开发者社区中积累了极高的声誉。与Django这样的全功能框架相比,Flask以其灵活性、简单性...

    Nginx高性能Web服务器详解

    2. Gzip压缩:开启gzip压缩,减少网络传输的数据量,提高页面加载速度。 3. 日志管理:通过access_log和error_log指令,记录和分析服务器的运行情况,便于故障排查和性能优化。 七、Nginx监控与故障排除 1. 日志...

    高性能网站建设进阶指南:WEB开发者性能优化最佳PDF

    - 高性能网站设计的核心是减少延迟、提高吞吐量和优化资源利用率。这包括采用CDN(内容分发网络)来加速静态资源的访问,利用缓存策略减少数据库查询,以及合理设计负载均衡策略。 2. **JavaWeb技术**: - ...

    从架构差异看Web高性能开发.doc

    除了这些核心策略,还有许多细节优化,如代码优化、SQL查询优化、减少HTTP请求等,这些都对实现Web高性能开发有重要作用。一个成功的案例是,一个仅由一个WEB服务器和一个DB服务器组成的站点,承载了千万主题帖和...

    Nginx高性能Web服务器详解.rar

    3. 压缩传输:开启gzip压缩,减少网络传输的数据量。 4. 避免空闲连接:设置合理的keepalive超时时间,避免过多的空闲连接占用资源。 六、Nginx与其他服务器的对比 相比Apache等传统Web服务器,Nginx在处理高并发...

    藏经阁-高性能Web架构之缓存体系.pdf

    【高性能Web架构之缓存体系】是针对提升Web服务性能的关键技术进行深入探讨的主题,主要涵盖了Web缓存的多个层次和方面。缓存是优化Web系统性能的重要手段,通过减少延迟和减轻服务器负担来提高用户体验。 1. **...

    构建高性能WEB站点

    高性能WEB站点指的是那些能够迅速响应用户请求、具有高并发处理能力、稳定可靠并且资源消耗低的网站。这些特性主要体现在以下几个方面: 1. **快速响应**:确保用户访问时网页加载速度足够快。 2. **高并发处理**:...

Global site tag (gtag.js) - Google Analytics