Yui. Compressor high-performance ASP. NET development: automatic compression of CSS and js to prevent various pitfalls of Lambda (1)

Source: Internet
Author: User

When developing JS and CSS files, compression is often required to reduce the file size and reduce the burden on the server. This requires the JS and js to be compressed each time the version is released, and then released. Is there any way to makeCodeOn the server, how does it compress itself?

 

There are two methods:

First, when the CSS and JS requests arrive, read the corresponding files, compress them, and return the results. This method can be processed in the application_beginrequest event of Global. asax, or an httphandler can be registered in Web. config for processing.

The second is inProgramAt startup, compress all CSS and JS files. After compression, the compressed files are used for each access. This method can compress all JS files to a folder, but pay attention to the file sequence.

The compression component Yahoo. Yui. compressor. dll is used for compression.

Because the first method fails to compress JavaScript to a file, the second method is used here.

The compression method is relatively simple. First, reference Yahoo. Yui. compressor. dll and ecmascript. net. Modified. dll

Compressing JS

 

// File Content
String Strcontent = file. readalltext (jspath, encoding. utf8 );

// Initialization
VaR JS = New Javascriptcompressor (strcontent, False , Encoding. utf8, system. Globalization. cultureinfo. currentculture );

// Compress this JS
Strcontent = Js. Compress ();
File. writealltext (jspath, strcontent, encoding. utf8 );

 

Compress CSS

String Strcontent = file. readalltext (csspath, encoding. utf8)

//Compress
Strcontent = csscompressor. Compress
(Strcontent );

File. writealltext (csspath, strcontent, encoding. utf8 );

 

 

There are also one way to automatically compress the specified JS and CSS files each time the website is released:
1) create a "msbuild" folder in the project and put the two DLL files of the Yahoo compression component into it.
2) create the "msbuildcompressor. xml" file in the "folder:

<? 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...
<Usingtask
Taskname = "compressortask"
Assemblyfile = "... \ projects \ Yahoo. Yui. Compressor \ model. net20 \ model. net20 \ bin \ debug \ Yahoo. Yui. compressor. netw.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 program 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. 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, abve.
Preserveallsemicolons: [Optional] refer to deletecssfiles, abve.
Disableoptimizations: [Optional] refer to deletecssfiles, abve.
Encodingtype: [Optional] ASCII, bigendianunicode, Unicode, UTF32, utf7, utf8, default. Default is 'default '.
Deletejavascriptfiles: [Optional] refer to deletecssfiles, abve.
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-G '.
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" // whether to blur the JS file. true: the variable in JS is A, B, C.
Preserveallsemicolons = "false"
Disableoptimizations = "nope"
Encodingtype = "UTF-8" // if Javascript or CSS contains Chinese characters, UTF-8 encoding must be used; otherwise, garbled characters may occur.
Deletejavascriptfiles = "false"
Linebreakposition = "-1"
Javascriptoutputfile = "$ (javascriptoutputfile )"
Loggingtype = "alittlebit"
Threadculture = "En-Au"
Isevalignored = "false"

-->

</Target>
</Project>

 

3) Select website properties, switch to the "generate events" tab, and enter the following command in:
$ (Msbuildbinpath) \ msbuild.exe "$ (projectdir) msbuild \ msbuildcompressor. XML "/P: cssoutputfile = ".. /minifile/sieena.min.css "/P: javascriptoutputfile = ".. /minifile/sieena. min. JS"

 

In this way, the specified JS and CSS files will be automatically compressed each time the website is compiled.

 

Download instance

 

Official Address:

Http://yuicompressor.codeplex.com/wikipage? Title = sample % 20msbuild. xml % 20 file & projectname = yuicompressor

 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.