- 浏览: 469415 次
- 性别:
- 来自: 北京
文章分类
最新评论
-
weida191231:
哥们 我在xp系统装了 ubuntu12.04版本 但是按照你 ...
[转]ubuntu Ignoring unknown interface eth0=eth0 -
tongyitaiwan:
程序员专用主页yaodot.com,代码日记本,搜索快速切换, ...
[转]js中过滤特殊字符的正则表达式 -
jimode2013:
唉,怎么人家框架也是这样写的
PHP Fatal error: Cannot re-assign auto-global variable _POST in /var/www/XXXX/
本文摘录自Nicholas C. Zakas 的《Professional JavaScript for Web Developers》(《JavaScript 高级程序设计》)为自己做一些记录,也为了分享。
Web浏览器下载的是JavaScript源代码,也就是说,所有的长变量名和注释都会包含在内。这个因素及其他因素会增加下载时间,这样就会增加脚本运行的总体时间。增加下载时间的关键因素是脚本包含的字节数。
要记住一个关键的数字是1160,这是能放入单个TCP-IP包中的字节数。最好能将每个JavaScript文件都保持在1160字节以下以获取最优的下载时间。
在JavaScript文件中,每个字符都是一个字节。因此,每个额外的字符(不管是变量名,函数名,或者注释)都会影响下载速度。部署任何JavaScript代码之前,都应该尽可能地优化下载速度。下面是一些可以用来减少脚本大小的方法。
1.删除注释
脚本中的任何注释都应该在部署之前删除。进行开发时,注释十分重要,它可以帮助小组成员来理解代码。但是‘要部署时,注释会明显使JavaScript代码体积变大。
删除注释是缩减JavaScript文件大小最方便的途径。即使不使用下面的建议,仅这一条就可以对缩减文件尺寸产生极大的效果了。
2.删除制表符和空格
程序员都会有规则地缩进代码以增加其可阅读性。但是浏览器不需要这些额外的制表符和空格:所以最好删除它们。也不要忘记函数参数、赋值语句以及比较操作之间的空格:
function doSomething ( arg1, arg2, arg3 ) { alert( arg1 + arg2 + arg3 ); }
function doSomething(arg1,arg2,arg3){alert(arg1+arg2+arg3);}
对于JavaScript解释程序来说,这两行完全一样,虽然第一行比第二行多了12个字节。删除参数、括号和其他语言分隔符之间的空格也可以有效地减少文件的整体大小,这样就缩短了下载时间。
(注意:要在每行的结束使用分号,将有助于保持代码的语法含义。)
3.删除所有的换行
只要你在程序的每行的结尾都正确地添加了分号,就不需要任何换行符了。关于JavaScript中换行是否应该存在的思考,底线都是换行要增加代码的可读性。将其删除也是一种最简便的使代码可以对抗反向工程的方法。
如果出于某种原因而不要删除换行,则要保证文件是Unix格式的,而非Windows格式的。Windows用两个字符表示新行(回车和新行,ASCII代码分别为13和10);而Unix仅适用一个。所以,将换行法从Windows格式转换成Unix格式也可以节约一些字节数。
4.替换变量名
基本思想是所有的变量名(或者对象的私有特性)都应该被替换成无意义的变量名。毕竟变量的名称对解释程序来说毫无意义、只是对阅读代码的开发人员来说有意义。不过,部署字符串时,应该讲描述性的变量名替换成更简单,更短的名称:
function doSomething(sName,sAge,sCity){alert(sName+sAge+sCity); }
function doSomething(a1,a2,a3){alert(a1+a2+a3);}
替换变量名后减少了16字节。
不推荐使用文本编辑器一般的查找替换方法,例如 替换 on 有可能会将 function 结尾的on也替换了。
5.ECMAScript Cruncher
为 JavaScript 进行最小化和变量名替换的最佳工具之一是 Thomas Loo 开发的 ECMAScript Cruncher (ESC, 可在 http://down.chinaz.com/soft/22921.htm下载)。 ESC是一个小巧的Windows Shell脚本,可以替你完成以上提到的又换操作。
要运行ESC必须是Windows操作系统。下载后进到目录里,直接点ESC.wsf,会跳到控制台.
合并:cscript ESC.wsf -l [0] -ow EndFile.js startFile1.js startfile2.js ...
//Crmhf说:EndFile是合并后的文件名,startFile1和startfile2等是合并前的文件名
cscript ESC.wsf -l [1-4] -ow EndFile.js startFile.js
//Crmhf说:按1~4个级别对Javascript进行处理
ESC支持的4个压缩等级:
0 不改变脚本。要将多个文件合并到单个文件时候用到
1 删除所有的注释
2 除了等级1外,再删除而外的制表符和空格
3 除了等级2外,再删除换行
4 除了等级3外,再进行变量名替换
- ESC.zip (56.2 KB)
- 下载次数: 0
发表评论
-
[转]50 tips of JavaScript,这些坑你都知道吗?
2016-11-06 17:49 050 tips of JavaScript,这些坑你都知道吗 ... -
HTML5中Access-Control-Allow-Origin解决跨域问题
2015-10-10 15:54 0新的详细网址:http ... -
[转] js判断各个浏览器的方法
2015-09-01 23:07 495js判断各个浏览器的方法 下面整理的是一套判 ... -
[转]ie8 不支持new Date(2012-11-10)问题的解决方法
2015-09-01 23:06 0ie8 不支持new Date(2012-11-10)问题的 ... -
jQuery 限制 input 选择个数
2014-11-17 21:16 0我提供一个更简单的: $(document).ready( ... -
[转]jQuery对于数组元素操作
2014-11-07 18:11 0Query根据元素值删除数组元素 例如删除C这个元素 , ... -
JavaScript 快速条件判断
2014-10-19 22:05 819以下的例子摘自《高性能网站建设进阶指南》的第7章 《编写高效 ... -
安装 npm
2014-10-17 10:36 0gao@gao-VirtualBox:~$ sudo apt- ... -
[转] javascript实现在倒计时线程注册多个事件的功能
2014-09-10 14:39 827javascript实现在倒计时 ... -
让所有浏览器都支持HTML5 placeholder属性
2014-07-15 11:35 0一, oschina上 IE不支持HTML5表单属性pla ... -
[转]图片旋转js代码
2014-06-27 12:28 881图片旋转js代码 function rotateIma ... -
onblur onfocus
2014-06-26 01:13 732<input type="text" ... -
jQuery each里的return false
2014-04-17 18:39 0function methodone(){ .... ... -
js 去除字符串前后和中间的空格
2014-02-28 16:18 4843删除字符串里面的所有空格 functi ... -
[转]只有7行代码的异步调用 js 库
2014-02-23 23:25 8857 lines JavaScript library fo ... -
[转]js中过滤特殊字符的正则表达式
2013-12-25 16:33 1869js中用正则表达式 过滤特殊字符 ,校验所有输入域 ... -
[转]JS常用正则表式
2013-12-25 16:18 1052JS常用正则表式 "^\d+$" ... -
我们为什么需要node.js
2013-10-28 16:00 0科普文一则,说说我对N ... -
JavaScript 优化
2013-09-08 13:02 0一、管理作用域 当执行JavaScript代码是,Jav ... -
[转]javascript Date format(js日期格式化)
2013-07-17 17:50 4088方法一:这个很不错, ...
相关推荐
优化 JavaScript 性能,使它运行足够快 一个关键因素:运行的时间 管理作用域 操作数据 流控制 Reflow DOM操作 长时间运行的脚本处理
本程序只是合并、压缩,直接讲合并结果发送客户端,并采用修改过期时间优化效率,最大限度减小服务器压力。 这样做法的效率就非常非常接近于 minify。 本程序碎玉压缩合并的功能俱全,但是整体及其轻量级,很容易...
因为时间的关系只提供了局部份功能,还有很多代码和函数都没有进行优化,(注释也较少)比如错误处理,浏览器嗅探等。 这里需要说明的是很少用到了innerHTML和innerTEXT两个方法,这是微软提供的专利方法,还没有...
前端时间对公司已有项目JavaScript代码进行优化,本文的是对优化工作的一个总结,拿出来与大家分享。当然我的优化方式可能并不是最优的,或者说有些不对的地方,请指教。JavaScript优化总结分为以下几点优化前后对比...
前端时间领导要做个demo需要绘制曲线图柱状图这些东西,要动态生成。我尝试着用javascript写了一下,后来才发现远没有我想象的简单,浏览器的兼容性能累死人的,出来的效果也不是很理想。后来让领导否据掉了,不能用...
软件简介:可以高效的压缩Javascript脚本文件缩短网页显示时间,可以混淆代码保护知识产权,还可以把多个文件合并压缩。产生的代码兼容IE,FireFox等常用浏览器。本软件可免费使用和转载,但严禁用于商业用途。 本...
优化了速度和内存占用 2.增加realValue 的格式设置 3.增强日期范围限制 可以使用#year# #month# #day# #lastDay# 如:本月最后一天#year#-#month#-#lastDay# 明年今天(注意有运算的地方,比如+1,必须用{}) : {#year#+1...
JavaScript 在浏览器中的性能,可认为是开发者所要面对的最重要的可用性问题。此问题因JavaScript的阻塞特征而复杂...不论实际的JavaScript 代码是内联的还是包含在一个不相干的外部文件中,页面下载和解析过程必须停下
对于js来说,刚使用的人上手可能很快,时间长了你会觉得它其中的奥妙,从而也就会注意它的执行效率,一些在工作常见的总结了一下,有什么错误还请大家指出。
JavaScript 执行过程耗时越久,浏览器等待响应用户输入的时间就越长。浏览器在下载和执行脚本时出现阻塞的原因在于,脚本可能会改变页面或 JavaScript 的命名空间,它们对后面页面内容造成影响。一个典型的例子就是...
javascript定时器取消定时器及js定时器优化方法 通常用的方法: 启动定时器: window.setInterval(Method,Time) Method是定时调用的js方法 Time是间隔时间,单位是毫秒 取消定时器: clearInterval(Method);...
软件简介:可以高效的压缩Javascript脚本文件缩短网页显示时间,可以混淆代码保护知识产权,还可以把多个文件合并压缩。产生的代码兼容IE,FireFox等常用浏览器。本软件可免费使用和转载,但严禁用于商业用途。 本...
这个是优化前的包大小,这家伙都上 1.72 M 了,小水管加载时间直接往 3s 以上走了,臣妾扛不住啊 二、目标 这必须得优化一下,优化前得大致定一下目标,目标又需要指标来衡量,所以定了两个指标: 页面加载...
系统设计旨在为各类培训机构、早教机构和特长培训班提供一个便捷、高效的课程预约解决方案,支持学员自由选择培训上课时间,优化资源调配,减少学员等待时间,提升学员满意度。本小程序包含前后端完整代码,并集成了...
JS性能优化是指在JavaScript代码的编写和执行过程中,通过一系列的优化策略和技术手段,提高代码的执行效率和性能,从而提升网页或应用程序的响应速度和用户体验。 优化JS性能的方法包括但不限于以下几个方面: 代码...
前端开发有时候复制别人的代码没有格式化,阅读起来很困难,自己格式化需要一点点的调,很浪费时间。本软件本地打开可以格式化、压缩、解压JavaScript/html/CSS代码,很方便,大大提高了开发效率。
Javascript在浏览器中的性能,可以说是前端开发者所要面对的最重要的可用性问题...不论实际的 JavaScript 代码是内联的还是包含在一个不相干的外部文件中,页面下载和解析过程必须停下,等待脚本 完成这些处理,然后才能继
而循环也正是程序优化中非常让人头疼的一环,我们往往需要不断去优化程序的复杂度,却因循环而纠结在时间复杂度和空间复杂度之间的抉择。 在 javascript 中,有3种原生循环,for () {}, while () {}和do {} while ...
因为时间的关系只提供了局部份功能,还有很多代码和函数都没有进行优化,(注释也较少)比如错误处理,浏览器嗅探等。 这里需要说明的是很少用到了innerHTML和innerTEXT两个方法,这是微软提供的专利方法,还...