1、代码压缩理解:实际上就是将原有的文本中无用的注释、空行、空格去掉来压缩文件的大小。进行js和css压缩会带来如下好处:
1)减小了文件的体积,减少文件占用的内存;
2)减小了网络传输量和带宽占用;
3)减小了服务器的处理的压力;
4)提高文件加载、页面的渲染速度,提高性能能;

2、ftl页面中实现对js和css文件压缩
1)可在vars.dev.properties文件中进行如下配置:
scriptCompress=true
scriptConcat=true
scriptMinSuffix=-min

2)主页面引入:(main.ftl)
<#import "common/yaSuo.ftl" as ys>
<@ys.cssurl url= ["css/search/search","css/common/main"] />
<@ys.jsurl  url= ["js/search/search","js/common/main"]/>

3)公用压缩文件:yaSuo.ftl
<#-- 静态资源压缩、合并-->
<#ftl strip_whitespace=true>
<#-- jsurl 格式化js的url加入版本号,用list形式可一次可以传入多个 -->
<#macro jsurl  url=[] scriptCompress='${scriptCompress}' scriptConcat='${scriptConcat}'>
    <#if scriptConcat == 'true'>
        <script type="text/javascript" src="${scriptHost}/??
        <#list url as js>
            <#if js?index_of("min") lt 0 && scriptCompress =='true'>
                ${js}${scriptMinSuffix}.js
            <#else>${js}.js
            </#if>
            <#if js_has_next>
            ,
            </#if>
        </#list>?${version}">
        </script>
    <#else>
        <#list url as js>
            <script type="text/javascript" src='${scriptHost}/
            <#if js?index_of("min") lt 0 && scriptCompress == 'true'>
                ${js}${scriptMinSuffix}.js?${version}
            <#else>${js}.js?${version}
            </#if>'>
            </script>
        </#list>
    </#if>
</#macro>
<#-- cssurl 格式化css的url加入版本号,用list形式可一次可以传入多个 -->
<#macro cssurl url=[] cssCompress='${cssCompress}' cssConcat='${cssConcat}'>
    <#if cssConcat =='true'>
        <link rel="stylesheet" type="text/css"  href="${scriptHost}/??
        <#list url as css>
            <#if css?index_of("min") lt 0 && cssCompress == 'true'>
                ${css}${scriptMinSuffix}.css
            <#else>${css}.css
            </#if>
            <#if css_has_next>
            ,
            </#if>
        </#list>?${version}"/>
    <#else>
        <#list url as css>
            <link rel="stylesheet" type="text/css" href='${scriptHost}/
            <#if css?index_of("min") lt 0 && cssCompress == 'true'>${css}${scriptMinSuffix}.css?${version}
                <#else>${css}.css?${version}
            </#if>
            '
            />
        </#list>
    </#if>
</#macro>

代码理解:

1)ftl指令详解:http://freemarker.foofun.cn/ref_directive_ftl.html
    strip_whitespace: 这将开启/关闭 空白剥离。 合法的值是布尔值常量 true 和 false (为了向下兼容,字符串 "yes","no", "true","false" 也是可以的)。 默认值(也就是当你不使用这个参数时)是依赖于程序员对 FreeMarker 的配置, 但是对新的项目还应该是 true。
    gt: greater than 大于
    gte: greater than or equal 大于等于
    lt: less than 小于
    lte: less than or equal 小于等于

2)macro指令的小示列:
模板文件:
<#macro list title items>
  <p>${title?cap_first}:
  <ul>
    <#list items as x>
      <li>${x?cap_first}
    </#list>
  </ul>
</#macro>
<@list items=["mouse", "elephant", "python"] title="Animals"/>

输出结果:
<p>Animals:
<ul>
  <li>Mouse
  <li>Elephant
  <li>Python
</ul>

一、FreeMarker实现对js和css压缩的更多相关文章

  1. MVC中的JS和CSS压缩

    小说一下Js和CSS压缩的好处: 1.减小了文件的体积 2.减小了网络传输量和带宽占用 3.减小了服务器的处理的压力 4.提高了页面的渲染显示的速度  很多建议将站点的静态文件(如图片.js.css ...

  2. 【MVC】 js,css 压缩

    [MVC] js,css 压缩 一. 引用 System.Web.Optimization.dll : 使用 Nuget ,在控制台输入 Install-Package Microsoft.AspNe ...

  3. 简短的几句js实现css压缩和反压缩功能

    写在前面 最近一直在整理css,但因为现在Visual Studio 2013太智能了,它每每在我按ctrl+E+D进行格式化代码的时候,就会将css进行层次格式化(如下图所示),而这个格式让我老大实 ...

  4. JS和CSS压缩部署,提高访问效率

    一直想把项目中的js和css压缩下,今天终于搞定了. 先说说几个注意的问题,目标影响着你对应的解决办法:1.压缩后的文件,是否要直接覆盖旧的文件2. 单个压缩文件重命名,还是整个目录换个名字,同时文件 ...

  5. Thinkphp js、css压缩类minify

    说明:Minify 是用PHP5开发的应用,通过遵循一些Yahoo的优化规则来提高网站的性能.它会合并多个CSS或者JavaScript文件,移除一些不必要的空格和注释,进行gzip压缩,并且会设置浏 ...

  6. freemarker 实现对URL的安全编码

    [#setting url_escaping_charset='utf-8'] ${yourstr?url}

  7. Asp.net 程序优化js,css合并与压缩

    访问时将js和css压缩并且缓存在客户端,采用的是Yahoo.Yui.Compressor组件还完成的,从这里可下载 创建一个IHttpHandler来处理文件 ) }; )              ...

  8. grunt 合并压缩js和css文件(二)

    具体node及文件配置请看: grunt 安装使用(一) 要压缩的文件 --src/ ajax.js assets.js touch.js zepto.js 目录结构: dist/ node_modu ...

  9. 利用YaHoo YUI实现Javascript CSS 压缩 分类: C# 2014-07-13 19:07 371人阅读 评论(0) 收藏

    网站优化时,往往需要对js文件,css文件进行压缩,以达到减少网络传输数据,减少网页加载时间:利用YaHoo的YUI可以实现Javascript,CSS,压缩,包括在线的js压缩和程序压缩,发现C#也 ...

随机推荐

  1. Java代码如何关联Hadoop源码

    昨天在学习Hadoop的时候,遇到一个问题就是Java关联Hadoop源码的时候死活关联不上,但是我发现在公司的电脑就可以顺利关联到源码.考虑了一下觉得应该是Eclipse版本的问题,于是我下载了ec ...

  2. (转载)Docker的boot2docker.iso镜像使用

    原文路径:https://blog.csdn.net/jiangjingxuan/article/details/54908272#commentsedit 在Docker首次启动时需要下载的一个bo ...

  3. 题解 P5594 【【XR-4】模拟赛】

    P5594 [[XR-4]模拟赛] 洛谷10月月赛 II & X Round 4 Div.2前两道签到题还是很简单的,基本上是半小时内一遍过两题 看看题解,这题STL做法有用set输出size ...

  4. n阶高精度乘法,(求高阶阶乘)

    先来复习一下小学数学 : 大家还记不记得小学算多位数的乘法是怎么算的? 卖个关子,大家一定要好好想想! 好了,别管到底还能不能想起来我们都要一块复习一下: 我们借助一下源自百度的图片 来复习下 相信大 ...

  5. 生成树计数 UVA 10766

    //本题题意:首先每个点之间都可达,然后m列举出不可达的,求出最多的生成树方案: //k这个变量是没用的. //公式:ans矩阵=度矩阵-建边矩阵: //度矩阵是当i==j时的,建边矩阵于平时定义可达 ...

  6. 欧拉降幂 (a^t)%c 模板

    #include<bits/stdc++.h> using namespace std; typedef long long ll; ll a,c,p,mod; ]; ll phi(ll ...

  7. P1558 色板游戏 线段树(区间修改,区间查询)

    题意: 给n,m,k,n长度,k个操作,m种颜色 操作C:输入A,B,C,区间[A,B]变成C颜色,可能A>B,所以要确保A<B 操作P:输入A,B,区间[A,B]的颜色种类 思路: 因为 ...

  8. CSS学习(1)简介

    什么是 CSS? CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素 样式通常存储在样式表中 把样式添加到 HTML 4.0 中,是为了解决内容与 ...

  9. xampp 配置多域名工程 解决 Access forbidden!

    XAMPP虚拟主机配置,多域名绑定访问本地站点 XAMPP有时候你需要一些顶级域名访问方式来访问你本地的项目也就是虚拟主机配置,这时候就需要配置虚拟主机,给你的目录绑定一个域名,实现多域名绑定访问. ...

  10. 每日扫盲(三):id_rsa、id_rsa.pub 、authorized_keys

    一.authorized_keys 1.就是为了让两个linux机器之间使用ssh不需要用户名和密码.采用了数字签名RSA或者DSA来完成这个操作 2.模型分析 假设 A (192.168.20.59 ...