如果你有机会用firebug看看自己网站的网络请求,你会发现请求数量之多超乎你的想象。为减少这个数量,有许多技术方案。比如yui的combo,会将所有需要的js混合成一个文件下载,现代web服务器好像也有这种技术,通过分析网页的链接,将一些文件合并。但这是别人实现的,也许不合你的需求。以下代码是本人在诗篇建站平台上的一个servlet,希望能给你写类似的代码起到一些参考作用。 
1、约定格式。这是: http://www.m3958.com/in 的网页源代码的片段,你必须在客户端和服务器端约定格式。 
<script type="text/javascript" src="/yuicombo?version=2.2&prefix=/codemirror/2.2/&lib/codemirror.js&mode/xml/xml.js&mode/javascript/javascript.js&mode/css/css.js&mode/htmlmixed/htmlmixed.js&lib/util/dialog.js&lib/util/searchcursor.js&lib/util/search.js"></script>

参数: 
version,如果一个combo请求带有version参数,作者就应该知道这个url的内容什么时候改变。这个参数很有用,待会儿继续说。 
prefix,postfix这个故名思意了,可以大大的缩短url长度。 
separator,如果大部分文件是具有相同前后缀,而有的没有遵循这个约定,也可以混合在一起,就是这个searator之后,不再添加前后缀。

那么version有什么用呢?既然你知道version和内容变化的对应关系,对于具有version的url请求,你可以设置永久缓存,比如10年。除此之外,从url生成一个md5值,作为etag发送给浏览器。当浏览器请求的时候,服务器如果发现:有version,有etag,那么最大的可能是用户强制刷新浏览器,通过比较etag和url的md5值,如果一致,返回304即可。
​1. [代码][Java]代码    
if(finalqs.isEmpty()){//在混合請求的情況下,如果缺少某個組件,yui會自動拉去,這個情況下前綴也是yuicombo
    finalqs = req.getRequestURI().replace("/yuicombo", "/yui");
    fns = new String[]{finalqs};
}
 
//client cache 针对url而定,那么只要url不同,cache就不会hit
//如果某个url带有version字段,那么作者必须知道这个内容的变化,所以可以永久缓存。
if("css".equals(type)){
    type = "text/css";
}else if("js".equals(type)){
    type = "text/javascript";
}else{
    ;
}
if(type == null || type.isEmpty())type = "text/javascript";
res.setContentType(type + ";charset=utf-8");   
res.setCharacterEncoding("UTF-8");
if(version == null || version.isEmpty()){
    ;
}else{
    String etag = req.getHeader("If-None-Match");
    if(etag != null && etag.equals(shaService.encrypt(finalqs))){
        res.setStatus(HttpServletResponse.SC_NOT_MODIFIED);
        return;http://www.enterdesk.com/special/shouhui/​
    }手绘图片
    res.setHeader("Cache-Control","max-age=" + PeriodContants.YEAR_IN_SECONDS * 10);
    res.setHeader("Etag", shaService.encrypt(finalqs));
}
Writer out = res.getWriter();
 
 
File wr = new File(getServletContext().getRealPath("/"));
boolean separatorReached = false;
for(String fn : fns){
     if(fn.startsWith("type=") || fn.startsWith("prefix=") || fn.startsWith("postfix=") || fn.startsWith("separator=") || fn.startsWith("version=")){
         continue;
     }
    if(fn.equals(separator)){
        separatorReached = true;
        continue;
    }
    File f = null;
    if(!separatorReached){
        if(prefix != null && !prefix.isEmpty()){
            fn = prefix + fn;
        }
        if(postfix != null && !postfix.isEmpty() && !fn.endsWith(postfix)){
            fn = fn + postfix;
        }
    }
    f = new File(wr,fn);
    if(f != null && f.isFile() && f.exists()){
        try {
            FileInputStream is = new FileInputStream(f);
            out.write(autils.read2String(is, "utf-8"));
        } catch (Exception e) {
            e.printStackTrace();
        }
    }
}
out.flush();
out.close();

模仿yui将css和js打包,加速网页速度的更多相关文章

  1. asp.net使用httphandler打包多CSS或JS文件以加快页面加载速度

    介绍 使用许多小得JS.CSS文件代替一个庞大的JS或CSS文件来让代码获得更好的可维 护性,这是一个很好的实践.但这样做反过来却损失了网站的性能.虽然你应该将你的Javascript代码写在小文件中 ...

  2. 前端资源多个产品整站一键打包&包版本管理(四)—— js&css文件文件打包并生成哈希后缀,自动写入路径、解决资源缓存问题。

    问题: 当我们版本更新的时候,我们都要清理缓存的js跟css,如何使得在网页中不需要手动清理呢? 答案: 生成带有哈希后缀的js跟css文件 1.文件路径 路径中的conf.js 是用于放置全局打包的 ...

  3. webpack打包时排除其中一个css、js文件,或单独打包一个css、js文件

    在项目中经常会需要将一些接口的配合文件或者某些样式文件,分离出来单独打包,便于后期改动,这里我以css文件为例,介绍实现两种方法: 项目目录: 如上图所示,现在我需要将项目中的scBtn.css文件单 ...

  4. ASP.NET 打包多CSS或JS文件以加快页面加载速度的Handler

    ASP.NET 打包多CSS或JS文件以加快页面加载速度的Handler, 使用<link type="text/css" rel="Stylesheet" ...

  5. 【转载】Yui.Compressor高性能ASP.NET开发:自动压缩CSS、JS

    在开发中编写的js.css发布的时候,往往需要进行压缩,以减少文件大小,减轻服务器的负担.这就得每次发版本的时候,对js.js进行压缩,然后再发布.有没有什么办法,让代码到了服务器上边,它自己进行压缩 ...

  6. Asp.Net使用Yahoo.Yui.Compressor.dll压缩Js|Css

    网上压缩css和js工具很多,但在我们的系统中总有特殊的地方.也许你会觉得用第三方的压缩工具很麻烦.我就遇到了这样问题,我不想在本地压缩,只想更新到服务器上去压缩,服务器压缩也不用备份之类的操作.于是 ...

  7. JAVA使用YUI压缩CSS/JS

    前言 JS/CSS文件压缩我们经常会用到,可以在网上找在线压缩或者本地直接使用,我这里使用的是yahoo开源组件YUI Compressor.首先介绍一下YUI Compressor,它是一个用来压缩 ...

  8. Maven使用yuicompressor-maven-plugin打包压缩css、js文件

    最近项目想使用在maven打包的时间压缩js,css文件,采用yuicompressor-maven-plugin插件进行压缩,但只是压缩减小大小,提高请求速度,并没有对js进行混淆.下面就写一下这个 ...

  9. css和js实现硬件加速渲染自定义滚动条

    听别人说用CSS的变换来实现渲染有硬件加速的效果,看到很多大网站都开始陆续使用上了,我也来说说怎么做,我这边实现的滚动条有自然滚动效果,看起来比较自然,说的再多不如直接写,让我们开始吧! 我们需要自己 ...

随机推荐

  1. 如何快速判断IP是内网还是外网(转)

    TCP/IP协议中,专门保留了三个IP地址区域作为私有地址,其地址范围如下: 10.0.0.0/8:10.0.0.0-10.255.255.255 172.16.0.0/12:172.16.0.0-1 ...

  2. OpenGL step to step(1)

    在窗体上绘制一个矩形,just a demo #include <GLUT/GLUT.h> void init() { glClearColor(0.0,0.0,0.0,0.0); glS ...

  3. log4net日志组件经验分享

    引自log4net日志组件经验分享 我们在开发WEB项目的时候,经常会出现这样的情况:在本地调试都是正常的,但是部署到服务器上就不行了.一般出现这种情况很大一部分原因是因为服务的环境和本地不同,数据库 ...

  4. C# 将long类型写入二进制文件用bw.Write(num);将其读出用long num= br.ReadInt64();

    理由: 因为long类型是 System.Int64 (长整型,占 8 字节,表示 64 位整数,范围大约 -(10 的 19) 次方 到 10 的 19 次方) 而long BinaryReader ...

  5. 杂谈之WEB前端project师身价

    了解javascript语言规范么?+1000 知道各浏览器的css差异么?+1000 javascript差异呢?+1000 知道html各标签的含义并不是常好地运用么?+1000 知道怎样跨浏览器 ...

  6. java.lang.String中的trim()方法的详细说明(转)

    String.Trim()方法到底为我们做了什么,仅仅是去除字符串两端的空格吗? 一直以为Trim()方法就是把字符串两端的空格字符给删去,其实我错了,而且错的比较离谱. 首先我直接反编译String ...

  7. 关于mysql的表名/字段名/字段值是否区分大小写的问题

    http://www.2cto.com/database/201202/121253.html 1.mysql默认情况下是否区分大小写,使用show Variables like '%table_na ...

  8. 【HDOJ 5371】 Hotaru&#39;s problem

    [HDOJ 5371] Hotaru's problem Manacher算法+穷举/set Manacher算法一好文:http://blog.csdn.net/yzl_rex/article/de ...

  9. 转:DDR原理详解

    首先,我们先了解一下内存的大体结构工作流程,这样会比较容量理解这些参数在其中所起到的作用.这部分的讲述运用DDR3的简化时序图. DDR3的内部是一个存储阵列,将数据“填”进去,你可以它想象成一张表格 ...

  10. AMD移动FP5平台时序解释

    好文章推荐:https://wenku.baidu.com/view/199379576137ee06eef91828.html AMD(FP5封装)时序全解. 由于刚开始接触AMD移动平台,难免有错 ...