Può un minificatore fare questo? (.... ed è una buona idea?)

Question

Ho un'applicazione JavaScript che genera una quantità significativa di elementi DOM. Significa che uso spesso lo document.createElement("tagname") nel mio script.

Sto pensando di utilizzare questa semplice funzione:

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

vorrei continuare a scrivere il mio codice in JavaScript (o forse CoffeScript), e utilizzare il metodo document.createElement completo nel codice per migliorare la leggibilità. Ma mi aspetto che quando "compilo" o minifico il codice, tutte le istanze di document.createElement vengano sostituite con la funzione c.

Vorrei fare lo stesso per altri metodi: document.getElementById, ecc. Spero di poter abbreviare il mio codice dal 10 al 20% con questa tecnica.

Ci sono minificatori o compilatori che possono farlo? E ha senso, in primo luogo?

Answer 1

Io non credo che ti guadagnerà così tanto Il file js non compresso potrebbe essere un po 'più piccolo, ma la compressione dovrebbe occuparsi di una stringa così ripetitiva. Quindi mi aspetto che il guadagno su un file javascript compresso (http gzip compression) sia piuttosto piccolo.

Answer 2

Molti minificatori non ridefiniranno le funzioni della libreria DOM con versioni più brevi. Tuttavia, si vede questo schema fatto a mano in molte librerie per ridurre e/o semplificare il codice. Quindi non c'è niente di sbagliato nel farlo tu stesso. Basta fare in modo che lo si fa all'interno di una chiusura ....

Date un'occhiata alle opzioni per uglifier e vedere che cosa può fare per voi, per esempio:

{ 
    :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 
    } 
} 

Answer 3

ha senso, ma un minifier che lo fa automaticamente deve essere intelligente su un paio di cose:

1. fa la parte del codice che viene scomposto fuori in una nuova funzione di ripetizione del numero sufficiente di volte per fare questo refactoring più economico?
2. Colpo di prestazioni potenziale dal codice di avvolgimento all'interno di funzioni aggiuntive: Soprattutto quando si tratta di un codice che viene utilizzato molto spesso in uno scenario critico (un profiler può dirlo, probabilmente un minificatore non può farlo). Forse il minificatore può mettere un limite al numero di sostituzioni in chiamate di funzioni profondamente annidate, ecc.

Probabilmente è meglio farlo manualmente.

Answer 4

Dipende interamente dal minificatore. La maggior parte non lo fa. Per esempio il codice:

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

Sulla modalità avanzata di Google Closure Compiler:

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

Su YUI Compressor:

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

On jscompress.com:

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

Immagino che i compilatori sono riluttanti a metodi alias DOM in caso di effetti collaterali strani, e le stringhe anche ripetuti nei js otterrò compressa bene da gzip comunque.

Answer 5

mi basta chiamare la funzione create(e) invece di c(e). In questo modo ottieni il meglio dei due mondi, leggibilità e non devi digitare così tanto.