使用Google Closure Compiler進行Js代碼壓縮

young.li 發布于2019-08-23 11:54 / 1175人閱讀

摘要：是什么是一個使下載和運行更快的工具。它解析您的，分析它，刪除死代碼并重寫并最小化剩下的內容。它還檢查語法，變量引用和類型，并警告常見的陷阱。其他參數這里使用默認運行后就可以看到生成了壓縮的文件了。其他的代碼壓縮工具

1.Google Closure Compiler是什么？

The Closure Compiler is a tool for making JavaScript download and run faster. Instead of compiling from a source language to machine code, it compiles from JavaScript to better JavaScript. It parses your JavaScript, analyzes it, removes dead code and rewrites and minimizes what"s left. It also checks syntax, variable references, and types, and warns about common JavaScript pitfalls.

Closure Compiler是一個使JavaScript下載和運行更快的工具。它不是從源語言編譯到機器代碼，而是從JavaScript編譯成更好的JavaScript。它解析您的JavaScript，分析它，刪除死代碼并重寫并最小化剩下的內容。它還檢查語法，變量引用和類型，并警告常見的JavaScript陷阱。

2.使用環境

平臺：Mac OS / Windows

環境：Java

3.檢查是否安裝了Java環境

打開終端，輸入 java -version,輸出java的版本說明已安裝好了java，若報錯，請安裝java環境

4.Closure Compiler下載

在Github上下載最新版的編譯好的Compiler文件，解壓出jar文件存放在項目外的目錄下：

5.在終端中，輸入命令，運行jar：

java -jar /Users/wangjun/Git/compiler.jar --js_output_file=code.js "/Users/wangjun/Git/WorkProject/BallsRace/release/wxgame/code.js"

/Users/wangjun/Git/compiler.jar 改為自己的電腦上compiler.jar的路徑，code.js改為輸出文件名，/Users/wangjun/Git/WorkProject/BallsRace/release/wxgame/code.js改為輸出路徑。（其他參數這里使用默認）
運行后就可以看到生成了壓縮的JS文件了。
壓縮前后文件大小對比，壓縮效果還是很明顯的：

6.使用sh腳本實現自動化打包壓縮Js文件

由于我是使用Laya Box引擎做游戲開發的，每次打包都需要手動敲代碼進行代碼壓縮，并且還需要手動刪除打包后多余的庫文件，流程實在很繁瑣，所以我使用了Laya打包提供的后續執行命令功能，配合sh命令進行了打包壓縮的自動化，大大提高了打包效率。
打開Laya Box的打包頁面

編寫sh命令：

cd /Users/wangjun/Git/WorkProject/BallsRace/release/wxgame/
rm -rf ./libs
rm -rf ./res
java -jar /Users/wangjun/Git/compiler.jar --js_output_file=code.js "/Users/wangjun/Git/WorkProject/BallsRace/release/wxgame/code.js"

保存為.sh文件
在后續執行腳本中填入.sh腳本的路徑，在打包后就可以自動執行代碼壓縮，并且刪除多余文件了。

7.幫助

在終端中輸入 java -jar compiler.jar --help 可以查看compiler的命令幫助和其他參數

8.其他

我沒用使用各種在線的Js代碼壓縮網站，原因如下：

在線壓縮工具受網絡狀況影響；

和我的需求不一致，我需要的是壓縮js文件，而不只是壓縮js代碼片段；

無法實現自動化腳本，上傳-等待-壓縮-下載，比較繁瑣；

我覺得上傳代碼壓縮并不安全，有泄漏源碼的風險。

9.其他的JavaScript代碼壓縮工具

UglifyJS

YUI Compressor

Smaller

Minifier

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/97647.html

前端優化：RequireJS Optimizer 的使用和配置方法

摘要：是自帶的前端優化工具，可以對項目中的和代碼使用或者進行壓縮合并。這篇文章介紹的使用和配置方法，幫助大家解決使用中碰到的問題。對腳本的優化支持目前流行的和兩種壓縮方式，需要環境支持，而則需要環境。定義要被優化的模塊數組。 RequireJS Optimizer 是 RequireJS 自帶的前端優化工具，可以對 RequireJS 項目中的JavaScript和CSS 代碼使用?Ugli...

Alan 2019-08-28 17:51 評論0 收藏0
JavaScript新鮮事·第6期

摘要：微軟公布版本在月日，微軟公布了版本，增加了一些特性，已經離正式版不遠了，目測功能應該不會再有太大的變化。由開發的一個日期選擇組件，輕松選擇開始時間和結束時間。項目地址發布版本，一個基于的。微軟公布TypeScript 2.0 RC版本在8月30日，微軟公布了TypeScript 2.0 RC版本，增加了一些特性，已經離正式版不遠了，目測功能應該不會再有太大的變化。原文地址：http...

anRui 2019-08-20 10:46 評論0 收藏0
45個必備的JavaScript Web開發工具

摘要：幸運的是，為了完成獨特的任務，無以計數的工具已經被開發者發布。圖像顯示的是一個針對該框架的在線開發工具。是用創建的命令行工具，用于壓縮文件。是一組處理所有跟文件相關的工作的組件庫。是一個基于任務的命令行項目構建工具。 JavaScript是一種靈活多變的腳本語言，它在全世界被廣泛的應用在Web頁面和服務器應用中。你可以因為任何目的去使用它，但是你需要一些工具。幸運的是，為了完成獨特的任...

不知名網友 2019-08-21 10:31 評論0 收藏0
細說 js 壓縮、sourcemap、通過 sourcemap 查找原始報錯信息

摘要：文件就是記錄了從源代碼文件到壓縮文件的一個代碼對應關系記錄表，通過壓縮文件和文件可以原原本本找出源代碼文件。細說 js 壓縮、sourcemap、通過 sourcemap 查找原始報錯信息 1. js 壓縮 js 壓縮對前端開發者來說是一門必修課。一般來說，壓縮 js 主要出于以下兩個目的：減小代碼體積，加快前端資源加載速度保護源代碼不被別人獲取壓縮 js 使用的工具庫：...

douzifly 2019-08-23 13:07 評論0 收藏0
JavaScript Source Map 簡介

摘要：為了提高性能，通常需要通過壓縮和合并之后才能投入生產環境。多方便使用生成使用家的格式格式簡單明了是的版本，是生成的文件，是原始代碼所在的目錄，留空表示同一目錄。是原始代碼，是轉換前的所有變量名和屬性名。其中，是默認開啟的。為了提高性能，JavaScript通常需要通過壓縮和合并之后才能投入生產環境。如果使用CoffeeScript，還需要進行編譯。這就意味著，編輯的代碼和運行的代...

libxd 2019-08-19 14:27 評論0 收藏0