क्या एक मिनीफायर ऐसा कर सकता है? (.... और क्या यह एक अच्छा विचार है?)

Question

मेरे पास एक जावास्क्रिप्ट एप्लिकेशन है जो डीओएम तत्वों की एक महत्वपूर्ण मात्रा उत्पन्न करता है। इसका मतलब है कि मैं अक्सर अपनी स्क्रिप्ट में document.createElement("tagname") का उपयोग करता हूं।

मैं इस साधारण समारोह का उपयोग कर के बारे में सोच रहा हूँ:

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

मैं जावास्क्रिप्ट (या शायद CoffeScript) में अपने कोड लिखने रखना होता है, और पठनीयता के लिए कोड में पूर्ण document.createElement विधि का उपयोग करें। लेकिन मैं उम्मीद करता हूं कि जब मैं कोड को संकलित या संक्षिप्त करता हूं, तो document.createElement के सभी उदाहरण c फ़ंक्शन के साथ प्रतिस्थापित किए जाते हैं।

मैं अन्य तरीकों के लिए भी ऐसा ही करूंगा: document.getElementById, आदि। मुझे आशा है कि मैं इस तकनीक के साथ 10 से 20% तक अपना कोड छोटा कर सकता हूं।

क्या मिनीफियर या कंपाइलर्स हैं जो ऐसा कर सकते हैं? और क्या यह पहली जगह में समझ में आता है?

Answer 1

मैं इसे नहीं लगता कि आपको इतना फायदा होगा। असंपीड़ित जेएस फ़ाइल काफी छोटी हो सकती है, लेकिन संपीड़न को ऐसी दोहराव वाली स्ट्रिंग से निपटना चाहिए। तो मैं अपेक्षाकृत छोटा होने के लिए संकुचित (http gzip संपीड़न) जावास्क्रिप्ट फ़ाइल पर लाभ की अपेक्षा करता हूं।

Answer 2

अधिकांश मिनीफायर छोटे संस्करणों के साथ डोम लाइब्रेरी फ़ंक्शंस को फिर से परिभाषित नहीं करेंगे। हालांकि, आप कोड को कम करने और/या सरल बनाने के लिए कई पुस्तकालयों में हाथ से यह पैटर्न देखते हैं। तो इसे स्वयं करने में कुछ भी गलत नहीं है। बस सुनिश्चित करें कि आप इसे एक बंद के अंदर करते हैं ....

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

Answer 3

यह मतलब नहीं है, लेकिन एक minifier कि यह स्वचालित रूप से करता है कुछ चीजों के बारे में स्मार्ट हो गया है:

1. करता है कोड है कि एक नया समारोह दोहराने में बाहर कारक का हिस्सा काफी बार इस बनाने के लिए अधिक आर्थिक पुनर्वितरण?
2. अतिरिक्त प्रदर्शन के अंदर रैपिंग कोड से संभावित प्रदर्शन मारा गया: विशेष रूप से जब यह कोड होता है जो अक्सर समय-महत्वपूर्ण परिदृश्य में उपयोग किया जाता है (एक प्रोफाइलर यह बता सकता है, एक मिनीफायर शायद नहीं कर सकता)। शायद minifier गहरा घोंसला समारोह कॉल आदि में प्रतिस्थापन की संख्या पर एक टोपी डाल सकते हैं

आप शायद इसे मैन्युअल रूप से करने से बेहतर हैं।

Answer 4

यह पूरी तरह से मिनीफायर पर निर्भर करता है। अधिकांश ऐसा नहीं करते हैं। उदाहरण के लिए कोड:

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 पर।कॉम:

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

मैं कल्पना है कि compilers अजीब साइड इफेक्ट के मामले में उर्फ ​​डोम तरीकों के लिए अनिच्छुक रहे हैं, और जे एस में भी बार-बार तार वैसे भी gzip द्वारा अच्छी तरह से संकुचित हो जाएगी।

Answer 5

मैं c(e) के बजाय फ़ंक्शन create(e) पर कॉल करता हूं। इस तरह आप दोनों दुनिया के सर्वश्रेष्ठ, पठनीयता प्राप्त करते हैं और आपको इतना टाइप करने की आवश्यकता नहीं है।