2011-11-29 95 views
8

我有一个JavaScript应用程序,可以生成大量的DOM元素。这意味着我经常在脚本中使用document.createElement("tagname")缩小器可以做到吗? (....这是一个好主意吗?)

我想使用这个简单的功能:

function c(e) {return document.createElement(e);} 

我会继续写我在JavaScript(或可能CoffeScript)代码,并使用完整的使用document.createElement方法的代码的可读性。但我希望当我“编译”或缩小代码时,document.createElement的所有实例都被替换为c函数。

我会为其他方法做同样的事情:document.getElementById等。我希望能用这种技术将我的代码缩短10%到20%。

是否有可以做到这一点的缩小器或编译器?首先它有意义吗?

+0

你希望得到什么好处? –

+1

如果没有别的,你可以自己做这个“预缩小”步骤。脚本不应太难。 – cdeszaq

+4

你gzip你的文件?我敢打赌,从长远来看,这并没有太大的区别。 – RightSaidFred

回答

3

我不认为这将会为你带来很多好处。未压缩的js文件可能会比较小,但压缩应该处理这样一个重复的字符串。所以我期望压缩(http gzip压缩)JavaScript文件的收益相当小。

+0

我相信与别名函数gzipped大小实际上会更大,因为别名函数本身计算额外字节... –

0

大多数minifier不会用较短的版本重新定义DOM库函数。但是,您可以在许多库中看到这种模式,以减少和/或简化代码。所以你自己做这件事没什么问题。只要确保你做一个闭包内....

看看为uglifier的选项,看看它可以为你做例子:

{ 
    :mangle => true, # Mangle variables names 
    :toplevel => false, # Mangle top-level variable names 
    :except => [], # Variable names to be excluded from mangling 
    :max_line_length => 32 * 1024, # Maximum line length 
    :squeeze => true, # Squeeze code resulting in smaller, but less-readable code 
    :seqs => true, # Reduce consecutive statements in blocks into single statement 
    :dead_code => true, # Remove dead code (e.g. after return) 
    :lift_vars => false, # Lift all var declarations at the start of the scope 
    :unsafe => false, # Optimizations known to be unsafe in some situations 
    :copyright => true, # Show copyright message 
    :ascii_only => false, # Encode non-ASCII characters as Unicode code points 
    :inline_script => false, # Escape </script 
    :quote_keys => false, # Quote keys in object literals 
    :beautify => false, # Ouput indented code 
    :beautify_options => { 
    :indent_level => 4, 
    :indent_start => 0, 
    :space_colon => false 
    } 
} 
0

这有一定道理,但会自动完成一个minifier必须是聪明的几件事情:

  1. 这是否真实因子而成为新的功能重复的代码部分足够的时间使这重构更经济?
  2. 附加函数中包装代码的潜在性能受到影响:特别是在时间关键型情况下(通常情况下,分析器可以告诉的是,缩小器可能无法使用)的代码。也许缩小器可以在深度嵌套函数调用等中替换数量上限。

你可能会更好地手动执行此操作。

+0

如果我只是做一个重命名埃里克建议:是否有性能问题:c = document.createElement? – Christophe

+0

对不起,Eric实际上纠正了他的评论。 – Christophe

0

它完全取决于缩小器。 大多数不这样做。例如代码:

window['a'] = document.createElement('div'); 
window['b'] = document.createElement('div'); 
window['c'] = document.createElement('div'); 

在谷歌关闭编译高级模式:

window.a=document.createElement("div");window.b=document.createElement("div");window.c=document.createElement("div"); 

在YUI压缩机:

window.a=document.createElement("div");window.b=document.createElement("div");window.c=document.createElement("div"); 

在jscompress。COM:

window["a"]=document.createElement("div");window["b"]=document.createElement("div");window["c"]=document.createElement("div") 

我想象的编译器都不愿意别名DOM方法的奇怪的副作用的情况下,并在JS也重复的字符串将获得通过的gzip压缩反正很好。

1

我只是调用函数create(e)而不是c(e)。这样你就可以得到两全其美的好处,可读性和你不必输入太多。

相关问题