高性能WEB开发之flush让页面分块逐步呈现

正对这种情况,还有一种处理方法,就是让response分块编码进行传输。response分块编码,可以先传输一部分不需要处理的html代码到客户端,等其他耗时代码执行完毕后再传输另外的html代码。

10年积累的网站制作、网站建设经验,可以快速应对客户对网站的新想法和需求。提供各种问题对应的解决方案。让选择我们的客户得到更好、更有力的网络服务。我虽然不认识你,你也不认识我。但先网站制作后付款的网站建设流程,更有安龙免费网站建设让你可以放心的选择与我们合作。

分块编码(chunked encoding)

chunked encoding 是http1.1 才支持编码格式(当然目前没有哪个浏览器不支持1.1了),chunked encoding 与一般的响应区别如下:

 
 
 
 
  1. 正常的响应:
  2.     HTTP/1.1 200 OK
  3.     Cache-Control: private, max-age=60
  4.     Content-Length: 75785
  5.     Content-Type: text/html; charset=utf-8
  6.     ..其他response headers
  7.         
  8.    
 
 
 
 
  1. chunked encoding 响应:
  2.    HTTP/1.1 200 OK
  3.    Cache-Control: private, max-age=60
  4.    Content-Length: 75785
  5.    Content-Type: text/html; charset=utf-8
  6.    Transfer-Encoding: chunked
  7.    ..其他response headers
  8.     
  9.    chunk #1(这里通常是16进制的数字,标志这个块的大小)
  10.    
  11.   
  12.    chunk #2
  13.    
  14.   
  15.    chunk #3
  16.    ....

实例(JSP)

一个简单的页面,分为头部(header)和内容(部分),假设内容部分需要读取数据库,花费3秒时间,然后显示csdn的logo。header部分显示cnblogs的logo。代码如下:

 
 
 
 
  1.     
  2.        cnblogs logo    
  3.     
  •     
  •     
  •     <%
  •         // 睡眠3秒
  •         Thread.currentThread().sleep(3000);
  •     %>
  •         csdn logo
  •            
  •     
  • 演示地址:http://213.186.44.204:8080/ChunkTest/nochunk.jsp (服务器比较差,请大家温柔点)

    打开这个演示地址发现很正常的页面,在3秒后才开始下载显示2个logo,资源加载瀑布图如下:

    现在把代码改成如下,加上flush,让response把之前的html分块输出:

     
     
     
     
    1.    cnblogs logo    
  • <%
  •     out.flush(); // flush response,分块输出
  • %>
  •     <%
  •         // 睡眠3秒
  •         Thread.currentThread().sleep(3000);
  •     %>
  •     csdn logo
  •        
  • 演示地址:http://213.186.44.204:8080/ChunkTest/chunk.jsp

    打开这个演示地址,是不是发现cnblogs logo先下载显示出来,3秒后csdn logo才显示,资源加载图如下:

    从这个图发现,cnblogs的logo在jsp页面还没执行完就开始下载了,这就是分块输出的效果。

    监控工具:

    如何知道我们是否成功使用了chunk encoding了 ,只要用工具查看response header 中是否包含了Transfer-Encoding: chunked,如果包含了,则是分块了。但要想监控分块的详细信息,据我所知,目前只有httpwatch支持,可以查看我们到底分了多少块,但是数量好像都多显示了1个,如下图:

    系列专题:高性能WEB开发应用指南

    当前标题:高性能WEB开发之flush让页面分块逐步呈现
    地址分享:http://www.shufengxianlan.com/qtweb/news32/31282.html

    网站建设、网络推广公司-创新互联,是专注品牌与效果的网站制作,网络营销seo公司;服务项目有等

    广告

    声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联

    猜你还喜欢下面的内容

    App设计知识

    分类信息网