A clever method to compress js/css files in Web development __c#

reference materials

Http://www.javatang.com/archives/2008/04/13/0212267.html

Web applications, the front-end JS, CSS, the application access to the performance impact is very large, so need to compress the Js/css file, the comments, line breaks, such as deletion, compressed file size, Generate a compressed file with only one line of code for the program reference (jquery and other JAVASCIRPT libraries are available after compression), loading the compressed file will improve performance greatly. When developing, there are many ways to compress files, and it is recommended to use the Yuicompressor-2.4.7.jar method for compression. Because the compressed file has only one row, the comments are removed, not easy to read and modify, not convenient for developers to modify, so often keep a compressed source file for developers to modify maintenance, deployment will compress the source files using compression tools compressed into compressed files, the program is actually referring to the compressed file. These tasks often require manual completion, simple duplication, and reduced development and deployment efficiency. The following provides an easy way to solve these problems. method principle and characteristic

Methods The main idea is in the development of the project source code, can still refer to uncompressed source files, normal modification and add comments unchanged, the source code does not need to retain the JS/CSS source files compressed files, and at deployment using the Automatic deployment Tool (ANT) automatically package compressed files to the deployment package. The advantage of this approach is that 1 developers are not affected by the way they were originally developed, do not need to compress files, compressed files delayed to deployment through the automated Deployment tool implementation, 2 to achieve the development, deployment work separation, deployment, if the need for temporary changes, can be packaged, the compressed before the source file into the deployment package to provide reference 3) The development of the source code changes, comments to ensure the readability of the source code, the deployment of dynamic compression, kill both, improve the development, deployment efficiency. Let's look at the concrete examples below. Example Description

A project has 2 JS file index.js, view.js capacity is larger, and need to modify frequently, if the introduction of the source file on the performance impact is relatively large. We use the ant deployment script to process this script. The script is as follows:

<project name= "Sjfwbuild" default= "main" basedir= "." > ... <property name= "Dist.tempdir" value= "${app.home}/antbuild/tempdir"/><!--the temporary directory in the deployment package for buffering Exchange--> <property name= "Dist.dir" value= "${app.home}/antbuild/output"/><!--deployment package Output Path--> <property name= "Web.dir" value= "${app.home}/web"/><!--project source of the Web path--> <property name= "Webapp.war" value= "Sjfw.war"/><!--post-deployment target package file--> ... <target name= "war" depends= "Compileproject" description= "War Pack" > <echo> Delete existing ${dist.dir}/${webapp.war}</echo> <delete file= "${dist.dir}/${webapp.war}"/> <echo message= "Backup JS source files to temp directory"/> <copy todir= "${dist.tempdir}/sjfw/src" file= "${web.dir}/sjfw/index.js"/> <copy todir= "${dist.tempdir}/sjfw/src" file= "${web.dir}/sjfw/view.js"/> <echo message= "Compress JS files in temp directory"/> <java jar= "${app.home}/antbuild/lib/yuicompressor-2.4.7.jar" fork= "true" Failonerror= "false" > <arg line= "--type js--charset ${charset}--nomunge ${dist.tempdir}/sjfw/src/index.js-o ${dist.tempdir}/sjfw/ Index.js "/> <arg line= "--type js--charset ${charset}--nomunge ${dist.tempdir}/sjfw/src/view.js-o ${dist.tempdir}/sjfw/ View.js "/> </java> <echo> Play War Package </echo> <war destfile= "${dist.dir}/${webapp.war}" webxml= "${web.dir}/web-inf/web.xml" compress= "true" > <fileset dir= "${web.dir}" > ... <exclude name= "**/sjfw/index.js"/><!--first excluded, followed by the generation of compressed files in the temporary directory instead of packaging--> <exclude name= "**/sjfw/view.js"/> </fileset> <fileset dir= "${dist.tempdir}"/><!--use a temporary directory to generate compressed files instead of packaging--> </war> <echo> Play War Package success </echo> </target>

Note: In the above script, the main processing steps and methods are commented, the main idea is to play the war package before the need to compress the JS file backup to buffer Exchange temporary directory, in the temporary directory compressed the file, the war package, the compressed copy of the file to cover the package file, so that the development, The deployment source files are relatively independent and unaffected.