पागल न्यूनतम (बाइट की खोज में)

नमस्ते विश्व

यह विषय इस बारे में है कि आप कोड को प्री-रिफ्लेक्टर कैसे कर सकते हैं ताकि इसकी न्यूनता में सुधार हो सके। मैंने हाल ही में रिलीज़ से पहले लाइब्रेरी को छोटा किया हेलिओस कर्नेल (जिसे मैंने कल से एक दिन पहले लिखा था )। पुस्तकालय स्रोत कोड का वजन 28112 बाइट्स है, इसमें उदार टिप्पणियाँ हैं, और इसलिए इसे YUI कंप्रेसर द्वारा 7083 बाइट्स के साथ एक आधे-किक के साथ संकुचित किया गया है। ऐसा नहीं है कि यह मुझे लगता है कि 7 किलोबाइट बहुत बोल्ड है। लेकिन सिर्फ अपनी आंखों से कम से कम कोड को देखकर, मैं उन स्थानों का एक गुच्छा देख सकता हूं जहां मैं अधिक बचत कर सकता हूं:



आइए देखें कि 7083 बाइट्स को 4009 3937 में बदलने के लिए कोड के साथ क्या किया जा सकता है।

लेकिन इससे पहले कि आप शुरू करें, दो चेतावनी:

• हम सभी प्रकार के "गंदे" ट्रिक (जैसे var a = this या var f = false ) का उपयोग नहीं करेंगे, जो सैद्धांतिक रूप से मंदी की ओर ले जाते हैं। प्रदर्शन को फ़ाइल आकार से अधिक महत्वपूर्ण माना जाता है।
• प्रत्येक चरण में, मैंने कई परीक्षणों के माध्यम से कोड चलाया। अक्सर ऐसा होता है कि कुछ बदलाव के बाद सब कुछ काम करना बंद कर देता है। यदि मैन्युअल अनुकूलन प्रक्रिया के दौरान आप कोड का परीक्षण नहीं करते हैं (या यदि आपके पास कोई परीक्षण नहीं है), तो कोड जो अंत में बाहर हो जाएगा, वह सबसे अधिक काम नहीं करेगा।
  
  

मिनिमाइज़र चयन

सामान्य तौर पर, यह लेख न्यूनतम तुलना करने के बारे में नहीं है, लेकिन इस प्रक्रिया में मैंने देखा कि YUI कंप्रेसर में एक बग है : यह एक पंक्ति से मिलकर कोड ब्लॉकों से घुंघराले ब्रेसिज़ को नहीं हटाता है। इसके अलावा, यह घुंघराले ब्रेसिज़ जोड़ता है, भले ही वे मूल में नहीं थे (पहली तस्वीर में डब्ल्यूटीएफ टैग के साथ चिह्नित)। मैंने इसे अशिष्टता के रूप में लिया और, बिना किसी हिचकिचाहट के, ऑनलाइन मिनिमाइज़र http://jscompress.com/ का उपयोग करने के लिए स्विच किया। हालाँकि, बाकी तर्क आपकी पसंद के किसी भी न्यूनतम पर लागू होते हैं।

बड़ा बेनामी फंक्शन

शुरू करने के लिए, आइए सभी कोड को एक बड़े अनाम फ़ंक्शन में लपेटें जिसे तुरंत कहा जाएगा (यदि यह शुरू में नहीं किया गया है)। तब हम इस फ़ंक्शन के स्थानीय दायरे का उपयोग कर सकते हैं। यह बाइट्स कैसे बचाएगा नीचे दिखाया जाएगा। अनाम फ़ंक्शन में कोड लपेटने का सबसे कॉम्पैक्ट तरीका इस प्रकार है:

यह था	बन गया है
//	!function(){ // }()

"निजी" वस्तुएं

निश्चित रूप से, कोड में बड़ी संख्या में सहायक वस्तुएं हैं जो सार्वजनिक एपीआई में शामिल नहीं हैं। चूंकि जावास्क्रिप्ट में यह इंगित करने के लिए कोई मूल तरीका नहीं है कि ऑब्जेक्ट निजी है, इसलिए किसी प्रकार का सम्मेलन आमतौर पर उपयोग किया जाता है। सबसे अधिक बार, ऐसी वस्तुओं को अंडरस्कोर के साथ शुरू करने का नाम दिया गया है: " _ "। आमतौर पर, मिनिमाइज़र एकल-अक्षर वाले स्थानीय चरों के नामों की जगह लेता है, लेकिन "निजी" वस्तुओं के नामों को अपरिवर्तित छोड़ देता है, क्योंकि यह "निजी" वस्तुओं को कैसे नामित करता है, इसके बारे में साहसिक अनुमान नहीं लगाता है। लेकिन यह हमारे लिए महत्वपूर्ण नहीं है कि इन वस्तुओं को न्यूनतम कोड में कैसे बुलाया जाएगा, इसलिए आप इन्हें मैन्युअल रूप से नाम बदल सकते हैं:

यह था	बन गया है
myObject._somethingPrivate = { // ... }	myObject.a = { // ... }
MyObj = function() { this.somePublicProperty = ...; this._somePrivateProperty = ...; this._anotherPrivateProperty = ...; }	MyObj = function() { this.somePublicProperty = ...; this.a = ...; this.b = ...; }
MyObj.prototype._privateMethod = function() { // ... }	MyObj.prototype.c = function() { // ... }

यहां आपको सावधान रहने की जरूरत है। सबसे पहले, निजी कार्यों और चर के नामों को न केवल घोषणाओं में बदलना याद रखें, बल्कि जहां उनका उपयोग किया जाता है। दूसरे, आपको कोड के तर्क पर नज़र रखने की जरूरत है, और नाम चौराहों से बचें। उदाहरण के लिए, यदि कोई फ़ंक्शन पहले से ही प्रोटोटाइप में कुछ प्रकार के लिए घोषित किया गया है, तो आप इस ऑब्जेक्ट की निजी संपत्ति के समान नाम का उपयोग नहीं कर सकते। यह एक स्पष्ट बात है, लेकिन अगर आप इस पर विशेष ध्यान नहीं देते हैं, तो यह याद रखना आसान है।

इसके अलावा, निजी वस्तुओं को अक्सर न केवल सभी प्रकार के निर्माणकर्ताओं / शुरुआती के रूप में घोषित किया जाता है। जावास्क्रिप्ट आपको मक्खी पर वस्तुओं को पूरक करने की अनुमति देता है। सिद्धांत रूप में, कोड में सभी निजी पहचानकर्ताओं को सावधानीपूर्वक एकल-अक्षर वाले के साथ प्रतिस्थापित किया जा सकता है:

यह था	बन गया है
MyObj.prototype.getSomething = function() { if ( typeof this._prop == "undefined" ) { this._prop = 0; } return this._prop; }	MyObj.prototype.getSomething = function() { if ( typeof this.x == "undefined" ) { this.x = 0; } return this.x; }

"सार्वजनिक" वस्तुएं

"सार्वजनिक" ऑब्जेक्ट वे हैं जो एपीआई का हिस्सा हैं, और हमें उनकी आवश्यकता है कि उनका नाम ठीक वैसे ही रखा जाए जैसा कि वे मूल रूप से नामित थे। लेकिन अगर कोड के अंदर "सार्वजनिक" ऑब्जेक्ट का उपयोग अक्सर किया जाता है (अच्छी तरह से, कम से कम एक बार), और इसका नाम बहुत लंबा है (ठीक है, कहते हैं, दो बाइट्स से अधिक), तो यह इसे एक उपनाम बनाने के लिए समझ में आता है:

यह था	बन गया है
myObject = { ... }	var a = myObject = { ... }

इस उदाहरण में, इस तरह के परिवर्तन के बाद, चर को स्थानीय के रूप में घोषित किया जाएगा, और चर myObject को वैश्विक माना जाता है (बशर्ते कि पहचानकर्ता myObject पहली बार उपयोग किया जाता है।

अब आप कोड पर जा सकते हैं, उन सभी वस्तुओं को पा सकते हैं जो न केवल घोषित हैं, बल्कि उपयोग भी की जाती हैं, और इसे एक उपनाम बनाते हैं:

यह था	बन गया है
MyObj = function() { this.somePublicProperty = ...; this.a = ...; this.b = ...; }	var b = MyObj = function() { this.somePublicProperty = ...; this.a = ...; this.b = ...; }
MyObj.prototype.someMethod = function() { // ... }	b.prototype.d = b.prototype.someMethod = function() { // ... }
someStorage.someMethod = function() { // ... }	var c = someStorage.someMethod = function() { // ... }

और फिर, मुख्य बात यह है कि दायरे में भ्रमित नहीं होना है और एक ही नाम से एक ही दायरे से चर का नाम नहीं लेना है। ऊपर दिए गए उदाहरणों में, MyObj के प्रकार की एक वस्तु में पहले से ही एक निजी संपत्ति b और एक निजी पद्धति c है , और नए स्थानीय चर b और c बड़े अनाम फ़ंक्शन के दायरे में आते हैं, जिसमें हमने बहुत शुरुआत में सभी कोड लपेटे हैं (हमने इसे लपेटा है, है ना? ?)

इसके अलावा, हम कुछ सार्वजनिक संपत्तियों के लिए उपनाम कर सकते हैं, लेकिन केवल उन लोगों के लिए जिनमें जटिल वस्तुएं हैं:

यह था	बन गया है
AnotherObj = function() { this.someProperty = [ 0, 0, 0 ]; // this.secondProperty = { a: 1 }; // this.thirdProperty = 0; // this.fourthProperty = true; // - this.fifthProperty = "hello"; // }	AnotherObj = function() { this.a = this.someProperty = [ 0, 0, 0 ]; this.b = this.secondProperty = { a: 1 }; this.thirdProperty = 0; this.fourthProperty = true; this.fifthProperty = "hello"; }

यदि हम साधारण वस्तुओं के लिए उपनाम करते हैं, तो यह सामग्री की नकल करेगा, और उपनाम किसी अन्य ऑब्जेक्ट को इंगित करेगा।

वर का लगाना

अब इस तथ्य का लाभ उठाएं कि आप एक बार शब्द संस्करण का उपयोग करके अल्पविराम द्वारा अलग किए गए चर घोषित कर सकते हैं। सबसे सरल मामले में, यह इस तरह दिखता है:

यह था	बन गया है
someFunction = function() { var a = 0; var b = something(); // ... }	someFunction = function() { var a = 0, b = something(); // ... }
anotherFunction = function() { var c; // - var d = something(); // - for ( var i = 0; i < ... // - }	anotherFunction = function() { var c, d = something(), i = 0 // - // - for ( ; i < ... // - }

सामान्य तौर पर, आपको फ़ंक्शन की शुरुआत में सभी घोषणाओं को बाहर निकालना होगा और एक संस्करण का उपयोग करके उन्हें लिखना होगा। मैं नीचे () लूप के अनुकूलन के बारे में लिखूंगा और फिर भी आपको हमारे लार्ज हैड्रॉन फंक्शंस के अंदर सभी स्थानीय घोषणाओं को इकट्ठा करने की आवश्यकता है और उन्हें शुरुआत में एक संस्करण के तहत रखा जाना चाहिए। ये वास्तव में उपनाम हैं जो हमने पिछले अनुभाग में बनाए थे। सभी कोड इस तरह बदलना चाहिए:

यह था	बन गया है
!function(){ // - var b = MyObj = function() { this.somePublicProperty = ...; this.a = ...; this.b = ...; } // - var c = b.prototype.someMethod = function() { // ... } // - }()	!function(){ var b = MyObj = function() { this.somePublicProperty = ...; this.a = ...; this.b = ...; }, c = b.prototype.someMethod = function() { // ... }, // // - // - // - }()

ध्यान दें कि इस उदाहरण में, वैरिएबल बी , सी और जैसे बिग फंक्शन के लिए स्थानीय घोषित किए जाते हैं। इस तरह हम फंक्शन में जितने भी वर्जन बचेंगे (एक को छोड़कर) ठीक है।

और फिर भी यह देखना आवश्यक है कि कोड तर्क नहीं बदला है। हम लाइनों के क्रम को बदल रहे हैं, इसलिए सैद्धांतिक रूप से ऐसा हो सकता है कि किसी वस्तु का उपयोग शुरू होने से पहले किया जाएगा, इसकी अनुमति नहीं दी जा सकती है।

प्रोटोटाइप

प्रत्येक घोषित प्रकार और इसके निर्माता के लिए, आप प्रोटॉयपे शब्द पर बहुत पैसा बचा सकते हैं - यह बहुत लंबा है। ऐसा करने के लिए, हम इस प्रकार के भविष्य की वस्तुओं के लिए पूरे प्रोटोटाइप का वर्णन एक हैश के रूप में करते हैं:

यह था	बन गया है
MyObj = function() { // ... } MyObj.prototype.someMethod = function() { // ... } MyObj.prototype.anotherMethod = function() { // ... } MyObj.prototype.thirdMethod = function() { // ... }	MyObj = function() { // ... } MyObj.prototype = { someMethod : function() { // ... }, anotherMethod : function() { // ... }, thirdMethod : function() { // ... } }

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

चक्र और स्थितियों का अनुकूलन

लगभग सभी चक्रों और कई स्थितियों को अनुकूलित किया जा सकता है:

यह था	बन गया है
a--; if ( a == 0 ) { // ... }	if ( --a == 0 ) { // ... }
if ( --a == 0 ) { // ... }	if ( !--a ) { // ... }
for ( var i = 0; i < a; i++ ) { b( c[ i ] ); }	for ( var i = 0; i < a; ) { b( c[ i++ ] ); }

लेकिन यहां भी, आपको सावधानी बरतने की ज़रूरत है ताकि कोड के तर्क का उल्लंघन न हो।

अक्सर उपयोग किए जाने वाले मूल्य

ऐसा होता है कि ऐसे मान हैं जो एक से अधिक बार उपयोग किए जाते हैं। इन्हें चर में भी रखा जा सकता है:

यह था	बन गया है
// ... if ( typeof a == "undefined" ) ... // ... if ( typeof b == "undefined" ) ... // ...	var z = "undefined"; // ... if ( typeof a == z ) ... // ... if ( typeof b == z ) ... // ...
if ( typeof a != "function" ) { a = function(){} } // ... if ( typeof b != "function" ) { b = function(){} }	var f = "function", g = function(){} // ... if ( typeof a != f ) { a = g; } // ... if ( typeof b != f ) { b = g; }
el = document.createElement( "script" ); el.type = "text/javascript";	var x = "script"; el = document.createElement( x ); el.type = "text/java" + x;

सब अनावश्यक फेंक दो

अक्सर ऐसा होता है कि कोड में "स्पष्टता के लिए" अनावश्यक जानकारी होती है, जिससे आप छुटकारा पा सकते हैं। लेकिन यहां, कहीं और के रूप में, आपको सावधानीपूर्वक निगरानी करने की आवश्यकता है कि हम क्या हटाते हैं:

यह था	बन गया है
if ( a.length > 0 ) { b = a.pop() }	if ( a.length ) { b = a.pop() }
var someEnum = { foo : 0, bar : 1, buz : 2 } // ... var a = []; for ( var i in someEnum ) { a[ someEnum[ i ] ] = 0; } // ... a[ someEnum.bar ] = getSomething(); // ... if ( c.state == someEnum.foo ) { // ... }	var someEnum = { foo : 0, bar : 1, buz : 2 } // ... var a = [ 0, 0, 0 ]; // ... a[ 1 ] = getSomething(); // ... if ( !c.state ) { // ... }

बोनस: var का निकालें

यह एक दिलचस्प चाल है, जो उन मामलों में उपयोगी है जहां फ़ंक्शन के अंदर एक स्थानीय चर घोषित किया जाता है (या यदि चर को बिना आरंभ किए घोषित किया जाता है)। यहां हम एक वर्जन पर सेव करते हैं, लेकिन हमें वैरिएबल नाम को डुप्लिकेट करना होगा:

यह था	बन गया है
doSomething = function( param1, param2 ) { var i = 0; // .... }	doSomething = function( param1, param2, i ) { i = 0; // .... }
doSomething = function( param1, param2 ) { var a, b, c; // .... }	doSomething = function( param1, param2, a, b, c ) { // .... }

यहां हम स्थानीय चरों के बजाय मापदंडों का उपयोग करते हैं, लेकिन वे बिल्कुल वैसा ही व्यवहार करते हैं। यह चाल उन मामलों में उपयुक्त नहीं है जब फ़ंक्शन अग्रिम में अज्ञात संख्या में पैरामीटर लेता है। सबसे अधिक बार, यह आपको कोड में लगभग सभी var के छुटकारा पाने की अनुमति देता है।

नतीजा क्या हुआ

वर्णित तरीकों से कोड को संसाधित करने के बाद, मैंने स्क्रिप्ट को jscompress.com सेवा को खिलाया। थोड़ा सोचने के बाद, उन्होंने मुझे 4009 बाइट्स के लिए इस तरह का दलिया दिया। बोन एपेटिट!



वैसे, मैं उन लोगों को कर्म के लिए प्लस दे दूंगा जो टिप्पणियों में ढूंढते हैं और वर्णन करते हैं कि आप इस गंदगी में और क्या ट्रिम कर सकते हैं :-)

अद्यतन

nano_freelancer ने कुछ अच्छे विचार सुझाए:

• क्रमशः 1 और 0 के साथ सभी सत्य और असत्य को बदलें

•  for (initial;condition;loop statement) {statements} 

  आप लूप स्टेटमेंट के बाद अल्पविराम लगा सकते हैं और कॉमा द्वारा अलग किए गए कथनों (अर्धविराम के बजाय) से सभी कथनों को रख सकते हैं - 2 बाइट्स (घुंघराले ब्रेस) बचाएं। लेकिन यह केवल उन मामलों के लिए लागू होता है जहां कथन में केवल जटिल ऑपरेटर नहीं होते हैं।
  

इसके अलावा, अधिकांश नल को 0 (लेकिन सभी नहीं) के साथ भी बदला जा सकता है।

कोड का आकार घटकर 3937 बाइट्स :-)

Offtopic: स्रोत और न्यूनतम कोड जिनके साथ मैंने काम किया है, प्रोजेक्ट होम पेज पर डाउनलोड के लिए उपलब्ध हैं: http://home.gna.org/helios/kernel/