什么是js壓縮?
js代碼壓縮,簡稱js壓縮,英文叫作:javascript minify
js壓縮的作用
js壓縮主要有兩個作用:
1、壓縮代碼體積
主要目的是提高代碼傳輸效率。
2、增強代碼安全性
可以說,JS壓縮也是一種JS混淆加密。
你沒聽錯,JS壓縮,可以降底代碼可讀性。對于既要代碼有一定安全性、又要代碼體積小的需求而言,JS壓縮,是個折中且不錯的方案。
為什么壓縮代碼能具有混淆的效果,下面會講。
如何進行JS壓縮
當然是使用工具了。
國內國外,在線的JS壓縮小工具很多,一搜一大把,但質量差別很大。
本文只推薦一個,且是國產的、高質量的:JShaman的JSMinify。
眾所周知,JShaman是國內JS混淆加密界的知名廠商。所以他們出品的JS壓縮工具,品質信的過。
下面簡單使用教學:
![]()
主要看有哪些功能,再看壓縮率。
功能配置:
1、去除未使用的函數。
例,壓縮前的代碼:
function fun_one(){ console.log(var_one); } function fun_two(){ console.log(var_one); } fun_one();
壓縮后:
function fun_one() { console.log(var_one); } fun_one();
2、去除未使用的變量。
例,壓縮前的代碼:
var var_one = 1; var var_two = 2; function fun_one(){ console.log(var_one); } fun_one();
壓縮后:
var var_one = 1; function fun_one() { console.log(var_one); } fun_one();
3、去除空行、無效的“;”號等。
4、優(yōu)化if、三元運算
例,壓縮前的代碼:
if(1==1){ console.log("1=1"); } else { console.log("1!=1"); } 2==2?console.log("2=2"):console.log("2!=2");
壓縮后:
console.log("1=1"); console.log("2=2");
5、變量使用轉化為字符串直接引用
例,壓縮前的代碼:
var four_one = 4; var four_two; var four_three ="this is four_three"; four_two = 5; console.log(four_one,four_two,four_three,four_three);
壓縮后:
var four_two; var four_three = "this is four_three"; four_two = 5; console.log(4, four_two, four_three, four_three);
6、字符串拼接
例,壓縮前的代碼:
var five_one = 1 + 2 + 3; var five_two = "I am " + "a " + "bird"; console.log(five_one,five_two);
壓縮后:
var five_one = 6; var five_two = "I am a bird"; console.log(five_one, five_two);
7、變量名變短。將長變量名變?yōu)槎套兞棵?br/>例,壓縮前的代碼:
var var_variable_one = 1; var var_variable_two = 2;
壓縮后:
var _0_ = 1; var _0_2 = 2;
8、函數名變短。將長函數名變?yōu)槎毯瘮得?br/>例,壓縮前的代碼:
function fun_get_time(){} function fun_set_time(){}
壓縮后:
function _f1_(){} function _f2_(){}
9、去除代碼中注釋。
10、去除代碼中的回車、換行,將代碼壓縮成一行。
![]()
配置選項很多,但起用起來很簡便,一般用默認配置就行。
再看一下最重要的壓縮率:
壓縮前:
![]()
壓縮后:
![]()
壓縮前體積:674 Bytes
壓縮后體積:249 Bytes
壓縮效果相當可以。
而且,你看壓縮前后代碼的可讀性是不是也差了許多:
var _v=1;var _v2=2;function _f5(){console.log(_v);}function _f6(){console.log(_v);}_f5();{}console.log("1=1");console.log("2=2");var _f;var _f2="this is four_three";_f=5;console.log(4,_f,_f2,_f2);var _f3=6;var _f4="I am a bird";console.log(_f3,_f4);
JS壓縮,真實有用!有需要的朋友,收藏起來吧!
特別聲明:以上內容(如有圖片或視頻亦包括在內)為自媒體平臺“網易號”用戶上傳并發(fā)布,本平臺僅提供信息存儲服務。
Notice: The content above (including the pictures and videos if any) is uploaded and posted by a user of NetEase Hao, which is a social media platform and only provides information storage services.