最近有朋友问我，网站打开速度慢得让人抓狂，是不是前端代码没优化。我一看，好家伙，一个JS文件几百KB，里面全是空格、换行和注释，浏览器加载能不慢吗。其实这种问题很好解决，用JSCompress在线压缩一下JS代码，体积立马小一大截。今天就把我自己用JSCompress的流程和踩过的坑整理出来，写给同样被JS体积困扰的朋友，不管是前端新手还是自己折腾网站的站长，看完都能直接上手。
JSCompress到底是个啥，能干嘛
简单说，JSCompress就是一个在线的JS代码压缩工具，打开网页把代码粘进去，点一下按钮，它就把你代码里的空格、换行、注释这些没用的东西全删掉，变量名也能帮你缩短，最后给你一段瘦身过的代码。整个过程不用装软件，不用配环境，浏览器打开就能用，对不想折腾本地构建工具的人来说很友好。我平时改完一个小脚本，懒得跑webpack那一套，就直接丢给JSCompress处理，几秒钟搞定。它本质上做的是JS代码压缩和混淆的活儿，压缩完的代码功能不变，体积能小不少，网页加载自然就快了。
怎么用JSCompress压缩JS代码，步骤其实很简单
打开JSCompress的页面，你会看到一个大的输入框，把要压缩的JS代码整个复制进去。下面一般有几个选项，比如要不要移除注释、要不要混淆变量名，新手的话默认勾选就行，别乱动。然后点压缩按钮，稍等一下，右边或者下面就会出结果，把压缩后的代码复制走，替换掉原来的文件就完事了。我第一次用的时候还担心会不会把代码弄坏，特意拿了个测试页面跑了一遍，功能正常，才放心用到正式环境。这里提醒一句，JSCompress在线压缩之前最好先备份原文件，万一哪里出问题还能还原，这个习惯我是一直保持的。
压缩前后差别有多大，说点实测感受
拿我自己一个项目里的小工具脚本举例，原始文件带注释和缩进大概120KB，用JSCompress压完之后剩下不到60KB，差不多砍了一半。别看绝对值不大，对于移动端用户来说，少加载几十KB就是实打实的速度提升。而且压缩后的代码浏览器解析起来也快一些，页面首屏渲染能感觉到变化。当然也不是所有代码都适合压，比如你还在调试阶段的代码，压完就没法看了，报错都找不到行号，所以JSCompress压缩JS这事儿，我一般放在上线前做，开发阶段还是留着可读的版本。
用JSCompress容易踩的坑，提前说清楚
第一个坑，代码里有中文或者特殊字符的时候，压缩后偶尔会出乱码，遇到这种情况检查一下编码设置，实在不行就先把中文注释去掉再压。第二个坑，有些用了ES6新语法的代码，老版本的压缩工具可能处理不好，好在JSCompress对常见语法支持还行，但我还是建议压完在浏览器里跑一遍，看看控制台有没有报错。第三个坑，别把已经压缩过的代码再压一遍，没意义还可能出问题。这些都是我实打实遇到过的情况，写出来给大家提个醒，用JSCompress在线压缩JS代码之前心里有个数。
哪些人适合用JSCompress，哪些场景更合适
自己搭博客、做小网站的朋友，用JSCompress最合适，不用搞复杂的构建流程，粘进去压一下就行。前端新手拿它练手也不错，能直观看到压缩前后代码的变化，理解代码压缩是怎么回事。还有就是临时改个第三方JS文件，想快速瘦身，JSCompress也能救急。但如果你是大型项目，依赖模块化开发，那还是老老实实用打包工具，JSCompress更适合轻量、零散的需求。说白了，JSCompress就是图个方便快捷，别指望它替代完整的构建体系。
最后聊几句使用心得
用JSCompress这段时间，最大的感受就是省事。以前为了压个JS文件还得开终端敲命令，现在浏览器里点几下就完事，特别适合我这种偶尔改改代码的懒人。当然工具再好也得会用，压缩前备份、压缩后测试，这两步别省。希望这篇JSCompress在线压缩JS代码的分享能帮到正在为JS体积发愁的你，照着做一遍，网页加载速度多少能提一点，亲测有效。
喜欢 
高兴
鬼脸
呵呵
无聊
伤心
