js脚本压缩
A. 如何压缩js文件
js文件,据我所知应该是javaScript的脚本文件,这种文件本身就是全文本,跟TXT文件差不多,应该不需要压缩了呀。。
B. js 压缩后的代码如何调试
我想你问的是不是类似UglifyJS之类的混淆过的JS代码?这种压缩通常会把变量、函数名之类的改成非常短的名称,因此这种压缩过的代码就难以识别了。
对于这种代码,推荐的思路是先看浏览器中是否有报错,然后根据错误来判断自己原始代码里可能出错的位置;如果没有报错,那也是断定大概的位置,然后Chrome里打开开发者工具里的Sources,打开自己的代码,用这个地方可以对代码进行重新排版:
当然,如果是uglify过的代码还是很难看,只能根据自己实际代码里的一些常量内容作为关键词在浏览器的代码里面搜自己可能的位置,然后加断点推测去调试。
上面的办法,都是在你对压缩JS这个过程没有控制的情况下,如果是你自己压缩JS代码,可以在压缩的时候同时生成sourcemap文件,一般是xxx.js.map文件。如果连同这个文件一起部署,那么在开发者工具中打开的时候,也可以看到最原始的代码了。这是最推荐的办法,调试起来也是最轻松的。
C. 怎样将js 压缩成 jsgz 文件
html中内嵌js代码修改为外部调用的方法: 1,新建一个js文件,将html中之前的代码全部选中剪切到该js文件中。如下这个案例,就只剪切其中的alert("测试")。 alert("测试");2,在html中添加js文件调用代码
D. nodejs版本的脚本压缩和compo工具怎么使用
一、下载并安装NodeJS for Windows 0.6.5 或进入NodeJS官网下载最新版本。
二、查看版本:
运行cmd
node -v
npm -v
如果上诉两个命令出错,请打开系统环境变量Path,直接点确定。再试。
三、安装UglifyJS 这里我们安装最新的版本,具体版本可在npm官网查看,uglify-js版本页面。
npm install uglify-js -g
然后等待命令完成,这个过程时间可能有点长。
如果出错请删除
C:\Users\Administrator\AppData\Roaming\npm 内相关内容
C:\Users\Administrator\AppData\Roaming\npm-cache 内相关内容
C:\Users\Administrator 下的错误信息文件
然后再次运行
四、修改配置
上述安装后自动生成的配置文件是不可直接使用的,我们需要手工去修改。
打开C:\Users\Administrator\AppData\Roaming\npm\uglifyjs.cmd
内容为:
:: Created by npm, please don't edit manually.
"%~dp0\.\node_moles\uglify-js\bin\uglifyjs" %*
修改为:
:: Created by npm, please don't edit manually.
@IF EXIST "%~dp0"\"node.exe" (
"%~dp0"\"node.exe" "%~dp0\.\node_moles\uglify-js\bin\uglifyjs" %*
) ELSE (
node "%~dp0\.\node_moles\uglify-js\bin\uglifyjs" %*
)
五、使用uglifyjs对javascript进行压缩美化
压缩:
uglifyjs f.js > f.min.js
美化:
uglifyjs -b f.min.js > f.b.js
E. JSP文件里大量JS代码,想发布时压缩JS怎么办
我是这样的,用一个插件保存的时候,自动生成一个压缩文件(.min.js),这样页面直接引用.min.js,而需要调试的时候改成.js就好了。
也有很多打包工具可以帮你做这些事,主要是看你的开发环境
F. js代码压缩的优点
有利于页面的性能提高,加快页面的打开速度,尤其是第一次访问时。
G. 如何压缩js
简单的压缩一般是:删除注释和空白符,替换变量名。
更激进点的做法还包括:删除无用代码,内联函数,等价语句替换等。
有些开发者出于保护代码的原因,还可能会对代码进行混淆处理。
通常深度压缩JS都必须要做的一步就是尽量地缩短变量名,因为一份体积巨大的JS代码,其中的变量名会占去不少空间。
压缩js必须要注意:
1、压缩前的代码格式要标准。因为去掉换行与空格时,所有语句就变成一行,如果你的代码有瑕疵(比如某行少了个分号),那就会导致整个文件报错。当然,现在有的压缩工具已经比较智能了。
2、备份原文件。压缩很可能不会一次成功,一般要多试,多改。
js压缩工具:
1. YUI Compressor
2. Google Closure Compiler
H. 如何压缩javascript和css文件
一、压缩html和javascript:
我们用站长工具的JavaScript-HTML格式化工具,我们打开页面,我今天要压缩的文件js文件:common.js ,把js代码复制到到JavaScript/HTML格式化工具里面如下图所示:
点击下面的“普通压缩”和“加密压缩”按钮,经过我的精心测试,使用“加密压缩”,对文件压缩率是最好的,所以点击“加密压缩”,压缩后如图:
javascript代码压缩后,我们就把这些代码在复制到common.js文件里面,在吧这个文件上传到空间原来的位置,进行访问是否存在一些错误,如果没有什么问题说明压缩成功;
我的common.js 文件压缩前和压缩后的对比:
压缩前:
压缩后:
文件压缩前和压缩后确实有明确的减少,说明压缩确实减少文件的大小,
我们来测试文件压缩前和压缩后所有能的时间做对比(我是用火狐插件测试传输速度):
压缩前所用时间:
压缩后所用时间:
压缩前所用时间是:125ms,压缩后所用时间:78ms ,文件压缩后给我们节省大量的时间,如果每个js都进行压缩,我们房子访问速度会更快的。
(注:html文件和javascript压缩原来一样的,当时压缩html要用到“普通压缩”按钮压缩)
二、压缩css文件:
我们打开站长工具的Css压缩/格式化工具页面,我要压缩的文件是五色旗保健品商城的css主文件style.css,首先我们打开站长工具的Css压缩/格式化工具页面 ,把style.css 代码放到Css压缩/格式化工具里面,如下图所示:
点击“压缩代码”按钮后,css代码压缩成功,如下图所示:
后边就是压缩后的css代码,你要不右边的代码复制到源文件style.css里面在上传到服务器空间里面,在访问一下网,看看网页样式有没有改变,如果有点变化就需要简单的调试一下,如果没有变样,说明你的css压缩成功了;
下面我们来看看styl.css文件压缩前和压缩后的大小和放在访问速度的大小:
文件大小对比:
压缩前:
压缩后:
压缩前30kb,压缩后23kb,明显的文件大小减小了
压缩前所用时间:
css压缩前的时间.jpg (7.36 KB, 下载次数: 0)
下载附件
css压缩前的时间.jpg
2013-11-2 00:35 上传
压缩后所用时间:
压缩前所用时间是:188ms,压缩后所用时间:93ms ,css压缩后明显的节省了95ms;
总结:一个大的网站可能会有很多的javascript和css,如果没有都进行压缩的话,一定会减少很多文件大小的,其实减少文件大少并不是很重要,最重要的是,文件容量减少了,能够快速的提高网站访问的速度,给用户带来好的体验,我们尽量的把文件压缩到最小,这样才有利于用户快速的打开网站,至此我的五色旗保健品商城优化后,我的每天的访问量也增加了很多。
I. js代码压缩!
http://tools.css-js.com/compressor.html
这个站点里面有四个压缩引擎,一个YUI压缩,一个UglifyJS压缩,一个JSPacker压缩,和一个新的JsMin压缩。
一般用UglifyJS引擎压缩就可以。jQuery和好些其他的前端项目就是用他压缩的。
另外给个建议,你把你的JS文件用匿名函数的方式封装起来,对外只给一个接口。这样JS压缩引擎就可以把你匿名函数中不对外开放的内部变量名称都给替换成a,b,c,d这样的单字符,很能节省体积。
J. 压缩后的JS代码怎样解压缩
一般压缩都经过混淆,如果你看到变量名都是A,B,C,D之类的无规则的命名,那就是被混淆过的,一般来说也很难阅读,就算你 还原了格式。
如果是没有混淆的,你可以试试用js的格式化工具来重新格式化一下的,比如:
/* 美化:格式化代码,使之容易阅读 */
/* 净化:去掉代码中多余的注释、换行、空格等 */
/* 压缩:将代码压缩为更小体积,便于传输 */
/* 解压:将压缩后的代码转换为人可以阅读的格式 */
/* 混淆:将代码的中变量名简短化以减小体积,但可读性差,经混淆后的代码无法还原 */
/* 如果有用,请别忘了推荐给你的朋友: */
/* javascript在线美化、净化、压缩、解压:http://tool.lu/js */
/* 以下是演示代码 */
var Inote = {};
Inote.JSTool = function(options) {
this.options = options || {};
};
Inote.JSTool.prototype = {
_name: 'Javascript工具',
_history: {
'v1.0': ['2011-01-18', 'javascript工具上线'],
'v1.1': ['2012-03-23', '增加混淆功能'],
'v1.2': ['2012-07-21', '升级美化功能引擎'],
'v1.3': ['2014-03-01', '升级解密功能,支持eval,window.eval,window["eval"]等的解密'],
'v1.4': ['2014-08-05', '升级混淆功能引擎'],
'v1.5': ['2014-08-09', '升级js压缩引擎'],
'v1.6': ['2015-04-11', '升级js混淆引擎']
},
options: {},
getName: function() {return this._name;},
getHistory: function() {
return this._history;}
};
var jstool = new Inote.JSTool();