网络编程
位置:首页>> 网络编程>> JavaScript>> Javascript优化(文件瘦身)

Javascript优化(文件瘦身)

作者:Grace 来源:Grace 发布时间:2008-06-02 13:20:00 

标签:代码,优化,Javascript,文件

最近一直在研究 Javascript 相关的技术。在《Javascript 高级程序设计》有篇章节着重阐述了优化 Javascript 代码的重要性。相信有很多的 Javascript 开发人员在开发的同时或多或少的会接触到此类的问题。

在大部分情况下,代码的优化并不是实际开发中所需要着重的部分。但是一旦代码完成了以后,开发者总是期待自己的代码能够越短越高效越好。结合从书中获得的知识以及本人实际开发过程中的经验,下面说明本人所采取的一些花招(也算是照本宣科一下)。

前言

相比脚本语言,编译型的语言并不需要太关心优化问题。在极大的程度上,编译时编译器都会之行优化操作。比如所有的变量、函数、对象等等都会替换成只有处理器才能理解的符号和指针(就是通常所指的可执行文件)。其他的脚本语言也并不需要过分在意文件的大小问题,但是 Javascript 则不同。

因为它首先要通过从服务器端下载源代码,然后再由客户端的浏览器执行。因此,Javascript 代码的速度被分割成两部分:下载时间(取决于文件的大小)和执行速度(取决于代码算法)。这篇主要讨论的是 Javascript 的下载时间优化,也就是如何尽可能的缩小 Javascript 文件本身的容量。

在这里要记住的一个数字是 1160,这是能放入单个 TCP/IP 包中的字节数。所以,最好的期望值是能将每个 Javascript 文件保持在 1160 字节一下,以获取最优的下载时间。

删除注释

这似乎是是废话,不过很多开发人员都会忘记。在实际生产环境中,脚本中的注释都应该删除。在开发期间注释相当的重要,它可以帮助团队理解代码。但在实际生产环境中,注释会明显使脚本文件体积变大。删除它们并不会给脚本实际运行带来任何的影响。

删除制表符和空格

具有良好缩进和空格的代码通常都具有良好的可读性。但是浏览器并不需要这些额外的制表符和空格,所以最好删除它们。当然也不要忘记函数参数,赋值语句以及比较操作之间的空格。比如

function showMeTheMoney(money)
{
    if (!money) {
        return false;
    } else {
        ...
    }
}

可以优化成

function showMeTheMoney(money){if(!money){reutrn false;}else{...}}

这样可以减少部分容量。

删除所有的换行

有许多关于在 Javascript 中换行应该存在的思考,但底线都是换行要增加代码的可读性。但过分的换行也会造成代码体积的增加。

可能处于某种原因而不能删除换行符,这样则要保证文件是 Unix 格式的。因为 Windows、Mac 格式的换行符用两个字符表示换行;Unix 仅用一个。所以将文件转换成 Unix 格式也可以节约一些字节数。

替换变量名

这可能是最无聊的一种做法,这通常不是手工完成的。毕竟变量的名称对解释器来说毫无意义(只是对开发人员来说会更友好一些),在生产环境中将描述性的变量名替换成更简单、更短的名称也可以缩减一部分体积。比如上述的代码可以缩减成:

function sm(m){if(!m){reutrn false;}else{...}}

这样虽然看起来会比较的头痛,不过实际执行效果是一样的。

使用工具

实际使用上述的方法可能会有一些困难,幸好有现成的外部工具能完成这些步骤。下面简单的介绍几个:

JS代码的格式化和压缩

ECMAScript Cruncher:http://saltstorm.net/depo/esc/

JSMin(The JavaScript Minifier): http://www.crockford.com/javascript/jsmin.html

Online JavaScript Compressor.:http://dean.edwards.name/packer/

我猜你会有兴趣看下这篇文章。

0
投稿

猜你喜欢

  • 大家都熟悉迅雷看看里面的电影人气指数这个小图标吧先看看我的效果图再看看迅雷的截图比较好看,是根据电影的人气指数来显示热度,下面我们就来模仿一
  • 1. 查看数据库的版本select @@version2.查看数据库所在机器操作系统参数exec master..xp_msver3. 查看
  • MySQL使用环境变量TMPDIR的值作为保存临时文件的目录的路径名。如果未设置TMPDIR,MySQL将使用系统的默认值,通常为/tmp、
  • 参数strSQL 要导出的SQL查询语句strFields 字段名称列表,如果为空字符,则使用SQL语句中的字段名用法示例:1:export
  • 注:我指一个网站被第三方网站以iframe的形式调用时,被调用网站的禁止策略 和 调用网站的突破禁止策略,跟XSS麽关系,但跟clickja
  • 最近,Facebook设计团队在其位于加州帕罗奥多市(Palo Alto)的总部,提到了他们为2.5亿用户设计的原理和方法。 他们特别强调了
  • 代码如下:---在仓储管理中经常会碰到的一个问题 一、关于LIFO与FIFO的简单说明 ---FIFO: First in, First o
  • 用mysqlbinlog.exe查看二进制日志是否启用了日志mysql>show variables like 'log%&#
  • 1.视图的概述 视图其实就是一条查询sql语句,用于显示一个或多个表或其他视图中的相关数据。视图将一个查询的结果作为一个表来使用,因此视图可
  • web2.0教程4:如何调用css样式表 这些技巧主要讲meta标签设置的,其实与符合web标准关系不大,只要注意在最后加"/&q
  • 之前有看过一个博文写的是白社会的设计很好但运营却有些遭,因为对每一个WebGame的推出时间把握不准,会有几个应用同时上线造成影响力的冲突,
  • 以下为引用的内容: <html> <head> <title>不刷新页面查询的方法&
  • 毫无疑问,JavaScript 是一种非常灵活的脚本语言,有时候它像一只难以驯服的野马——你受益于它的灵活性的同时,也要时刻提防它变得失去控
  • 今天有人问起,晚上试着写出来,供参考; 以下代码兼容主流浏览器IE6、IE7、Firefox、Opera。从最简单的开始…………一
  • 我一直使用Microsoft的FrontPage 98来开发ASP/ADO之类的Internet数据库应用程序。现在我听说许多人都非常信奉采
  • 没人愿意等待。所以,没有访问者真的能够忍受一个打开速度极慢的网站。但是,网页打开速度到底对用户行为有什么影响,恐怕没几个人能够说清楚吧。前几
  • 一、概述公司新购了一批PC,准备把几个性能较优的PC升级为数据库服务器,替换老旧的机器。公司有套POS终端软件,后台数据存储是 MySQL
  • SQL Server有两种备份方式,一种是使用BACKUP DATABASE将数据库文件备份出去,另外一种就是直接拷贝数据库文件mdf和日志
  •   如何将123456789转化成123,456,789这样的形式呢?很多流量大的站比如优酷都有这样的格式。也是设计程序最常用的算
  • 打过了趟深圳回来后,已经快半个月,在广州购书中心逛了下,发现2本前端书《重构HTML-改善WEB应用的设计》、《CSS3 实战》,看了一半《
手机版 网络编程 asp之家 www.aspxhome.com