zoukankan      html  css  js  c++  java
  • Yui.Compressor高性能ASP.NET开发:自动压缩CSS、JS防止Lambda的各种坑爹(一)

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


     

    有两种办法:

    第一种,在css、js请求到来的时候读取一下相对应的文件,进行压缩后返回。此方法可以通过在Global.asax的Application_BeginRequest的事件中,进行处理,也可以在web.config中注册一个httpHandler进行处理。

    第二种是在程序启动的时候,对全部css以及js进行压缩,压缩之后,每次访问都使用压缩后的文件即可。这种办法可以将js全部压缩到一个文件夹里边,不过需要注意一下文件的顺序。

    压缩使用的是雅虎的压缩组件: Yahoo.Yui.Compressor.dll

    由于第一种办法没能实现js压缩到一个文件,所以这里采用的是第二种方案。

    压缩方法比较简单,首先引用Yahoo.Yui.Compressor.dll和EcmaScript.NET.modified.dll

    压缩js

    复制代码
    //文件内容
    string strContent = File.ReadAllText(jsPath, Encoding.UTF8);
     
    //初始化
    var js = new JavaScriptCompressor(strContent, false, Encoding.UTF8, System.Globalization.CultureInfo.CurrentCulture);
     
    //压缩该js
    strContent = js.Compress();
    File.WriteAllText(jsPath, strContent, Encoding.UTF8);
    复制代码


    压缩css

    复制代码
    string strContent = File.ReadAllText(cssPath, Encoding.UTF8)

    //进行压缩
    strContent = CssCompressor.Compress
    (strContent);

    File.WriteAllText(cssPath, strContent, Encoding.UTF8);
    复制代码

    还有另外一一种办法不用自己写代码,每次网站发布的时候自动压缩指定的js和css文件:
    1)在项目中新建“MSBuild” 文件夹,把yahoo压缩组件的两个dll放进去
    2)在“文件夹”内新建"MSBuildCompressor.xml"文件:

    复制代码
    <?xml version="1.0" encoding="utf-8" ?>

    <Project xmlns="http://schemas.microsoft.com/developer/MsBuild/2003">
      <UsingTask
      
    TaskName="CompressorTask"
      AssemblyFile
    ="Yahoo.Yui.Compressor.dll" />
      <!-- The .NET 2.0 version of the task .. and yes .. that's Model.Net20 folder listed twice .. i know i know...
    <UsingTask
    TaskName="CompressorTask"
            AssemblyFile="..\..\Projects\Yahoo.Yui.Compressor\Model.Net20\Model.Net20\bin\Debug\Yahoo.Yui.Compressor.NET20.dll" />
        
    -->

      <!-- Define the output locations. These can be set via the msbuild command line using
             /p:CssOutputFile=$(TargetDir)../whatever...
             /p:JavaScriptOutputFile=$(TargetDir)../whatever...
     
             If they are not supplied or are empty, then we the value whatever is supplied, below.
        
    -->
      <PropertyGroup>
        <CssOutputFile Condition=" '$(CssOutputFile)'=='' ">
          SylesSheetFinal.css
        </CssOutputFile>
        <JavaScriptOutputFile Condition=" '$(JavaScriptOutputFile)'=='' ">
          JavaScriptFinal.css
        </JavaScriptOutputFile>
      </PropertyGroup>


      <Target Name="MyTaskTarget">
        <!--
    ItemGroup\CssFiles or ItemGroup\JavaScriptFiles: add zero to many files you wish to include in this compression task.
                                                                 Don't forget, you can use the wildcard (eg. *.css, *.js) if you feel up to it.
                                                                 Finally, at least one item is required - either a css file or a js file.
     
    CssFiles/JavaScriptFiles data format: Please do not touch this.
    DeleteCssFiles: [Optional] True | Yes | Yeah | Yep | True | FoSho | FoSho. Default is False. Anything else is False. (eg. blah = false, xxxx111 = false, etc)
    CssCompressionType: YuiStockCompression | MichaelAshsRegexEnhancements | HaveMyCakeAndEatIt or BestOfBothWorlds or Hybrid; Default is YuiStockCompression.
    ObfuscateJavaScript: [Optional] refer to DeleteCssFiles, above.
    PreserveAllSemicolons: [Optional] refer to DeleteCssFiles, above.
    DisableOptimizations: [Optional] refer to DeleteCssFiles, above.
    EncodingType: [Optional] ASCII, BigEndianUnicode, Unicode, UTF32, UTF7, UTF8, Default. Default is 'Default'.
    DeleteJavaScriptFiles: [Optional] refer to DeleteCssFiles, above.
    LineBreakPosition: [Optional] the position where a line feed is appened when the next semicolon is reached. Default is -1 (never add a line break).
                                   0 (zero) means add a line break after every semicolon. (This might help with debugging troublesome files).         
    LoggingType: None | ALittleBit | HardcoreBringItOn;  Hardcore also lists javascript verbose warnings, if there are any (and there usually is :P ).
    ThreadCulture: [Optional] the culture you want the thread to run under. Default is 'en-gb'.
    IsEvalIgnored: [Optional] compress any functions that contain 'eval'. Default is False, which means a function that contains
                               'eval' will NOT be compressed. It's deemed risky to compress a function containing 'eval'. That said,
    if the usages are deemed safe this check can be disabled by setting this value to True.
            
    -->
        <ItemGroup>
          <!-- Single files, listed in order of dependency 
          <CssFiles Include="../StylesheetSample1.css"/>
          <CssFiles Include="../StylesheetSample2.css"/>
          <CssFiles Include="../StylesheetSample3.css"/>
          <CssFiles Include="../StylesheetSample4.css"/>
    -->

          <JavaScriptFiles Include="../myjs/sample_1.js"/>

          <!-- All the files. They will be handled (I assume) in alphabetically. -->
          <!--<CssFiles Include="*.css" />
    <JavaScriptFiles Include="*.js" />
                
    -->
        </ItemGroup>

        <CompressorTask
        
    CssFiles="@(CssFiles)"
        DeleteCssFiles
    ="false"
        CssOutputFile
    ="$(CssOutputFile)"
        CssCompressionType
    ="YuiStockCompression"
        JavaScriptFiles
    ="@(JavaScriptFiles)"
        ObfuscateJavaScript
    ="False"
        PreserveAllSemicolons
    ="False"
        DisableOptimizations
    ="Nope"
        EncodingType
    ="utf-8"            
        DeleteJavaScriptFiles
    ="false"
        LineBreakPosition
    ="-1"
        JavaScriptOutputFile
    ="$(JavaScriptOutputFile)"
        LoggingType
    ="ALittleBit"
        ThreadCulture
    ="en-au"
        IsEvalIgnored
    ="false"
        
    />
        
        <!--
        
        CssFiles="@(CssFiles)"
        DeleteCssFiles="false"
        CssOutputFile="$(CssOutputFile)"
        CssCompressionType="YuiStockCompression"
        JavaScriptFiles="@(JavaScriptFiles)"
        ObfuscateJavaScript="False"                   //是否模糊处理js文件,True:会将js中的变量为“a,b,c”单个字符的变量
        PreserveAllSemicolons="False"
        DisableOptimizations="Nope"
        EncodingType="utf-8"                          //如果js或者css包含有中文,则必须使用utf-8编码,否则会乱码
        DeleteJavaScriptFiles="false"
        LineBreakPosition="-1"
        JavaScriptOutputFile="$(JavaScriptOutputFile)"
        LoggingType="ALittleBit"
        ThreadCulture="en-au"
        IsEvalIgnored="false"
        
        
    -->

      </Target>
    </Project>
    复制代码

    3)选择网站属性,切换到“生成事件”标签,,在“”输入以下命令:
    $(MSBuildBinPath)\msbuild.exe "$(ProjectDir)MSBuild\MSBuildCompressor.xml" /p:CssOutputFile="../miniFile/Sieena.min.css" /p:JavaScriptOutputFile="../miniFile/Sieena.min.js"

    这样,每次编译网站的时候就会自动压缩指定的js和css文件了

     实例下载

    官方地址:

    http://yuicompressor.codeplex.com/wikipage?title=Sample%20MSBuild.xml%20File&ProjectName=yuicompressor

  • 相关阅读:
    LeetCode 189. Rotate Array
    LeetCode 965. Univalued Binary Tree
    LeetCode 111. Minimum Depth of Binary Tree
    LeetCode 104. Maximum Depth of Binary Tree
    Windows下MySQL的安装与配置
    LeetCode 58. Length of Last Word
    LeetCode 41. First Missing Positive
    LeetCode 283. Move Zeroes
    《蚂蚁金服11.11:支付宝和蚂蚁花呗的技术架构及实践》读后感
    删除docker下的镜像
  • 原文地址:https://www.cnblogs.com/aaa6818162/p/2833817.html
Copyright © 2011-2022 走看看