🚟 🏢 🚅 मैजिकस्ट्रिंग क्या है और क्या ये लाइनें इतनी जादुई हैं? 💧 👱🏿 ☸️

मैजिकस्ट्रिंग एक अल्पज्ञात पुस्तकालय है। इसके बावजूद, यह दबाव की समस्याओं में से एक को हल करता है - इसकी संरचना (एएसटी - सार सिंटैक्स ट्री) का उपयोग करके स्रोत कोड को बदलना।

इस लेख में हम जानेंगे कि मैजिकस्ट्रिंग क्या है और क्या ये लाइनें वास्तव में "जादू" हैं। यह हमें अगले लेख को समझने में मदद करेगा जिसमें मैं समझाऊंगा कि कैसे हम इतनी जल्दी कोणीय प्रलेखन का अनुवाद करने में कामयाब रहे, और यह मार्काडाउन और किसी भी अन्य प्रारूप की फ़ाइलों के लिए एक सार्वभौमिक अनुवादक के निर्माण में कैसे मदद करेगा।

2 सप्ताह पहले मैंने एंगुलर की रूसी-भाषा के दस्तावेज़ (कोणीय 24.ru ) जारी किए। इस समय के दौरान, 35 मुद्दों को पाठ में सुधार और 2 पुल अनुरोध के साथ जोड़ा गया था। मुझे पूरी तरह से संदेह था कि जिस सिस्टम में आप टेक्स्ट का चयन करते हैं, वह अनुवाद प्रस्तुत करता है और स्वचालित रूप से GitHub पर जारी करेगा। लेकिन भीड़ काम करती है! :) आप इस लेख से इसके बारे में अधिक जान सकते हैं ।

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

मान लें कि हमारे पास एक सरल स्रोत कोड है:

const a = 1;

हम कास्ट को var से बदलना चाहते हैं । सबसे सरल समाधान है कि स्ट्रिंग को सामान्य String.prototyp.replace के साथ var से बदला जाए । और इस कार्य के लिए, यह सबसे सही समाधान होने की संभावना है। लेकिन क्या होगा अगर हमें वैश्विक स्तर पर केवल var के साथ const को बदलने की आवश्यकता है? लेकिन उन्हें कार्यों के अंदर प्रतिस्थापित नहीं करते हैं? आप निश्चित रूप से, अधिक जटिल नियमितता के साथ आ सकते हैं या मुश्किल कोड लिख सकते हैं, लेकिन एक अधिक स्केलेबल और लचीला तरीका है।

हम Parsers का उपयोग AST - Abstract Syntax Tree प्राप्त करने के लिए कर सकते हैं। यदि आप रुचि रखते हैं कि एएसटी क्या है, तो astexplorer.net पर जाएं । संक्षेप में, यह एक पेड़ है जो आपके कोड की संरचना को सटीक रूप से प्रदर्शित करता है।

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

आमतौर पर, रिप्लेसमेंट विज़िटर पैटर्न डिज़ाइन और कई हेल्पर्स का उपयोग करके किया जाता है , जो आमतौर पर खुद को एक ही लाइब्रेरी में लपेटते हैं , जिसे "एनएएसपी" एपीआई कहा जा सकता है। प्रत्येक पार्सर का अपना "ट्रांसफार्मर एपीआई" है।

ऐसे पुस्तकालयों का उपयोग करना बहुत आसान है, लेकिन उनके पास कई समस्याएं हैं। उनमें से एक प्रदर्शन है।

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

और यहाँ मैजिकस्ट्रिंग का जादू आता है। मैंने पहली बार रिच हैरिस परियोजना से उनके अस्तित्व का पता लगाया, जिसे बटरनट कहा जाता था । बटरनट एक जावास्क्रिप्ट मिनिफायर है। बटरनट को UglifyJS से 3 गुना तेज और बबली की तुलना में 10-15 गुना तेज होने का दावा किया गया था । मैं आगे भागता हूं और कहता हूं कि यह परियोजना कम से कम 3 साल पहले एक तांबे के बेसिन के साथ कवर की गई थी। लेकिन फिर भी, मैं इसके प्रदर्शन के रहस्य से घिर गया था। यह एक मैजिकस्ट्रिंग था।

आइए मैजिकस्ट्रिंग के साथ काम करने पर एक नज़र डालें:

var MagicString = require( 'magic-string' );
var s = new MagicString( 'const a = 1; const b = 2;' );

s.overwrite( 0, 5, 'var' );
s.toString(); // 'var a = 1; const b = 2;'

//

मैजिकस्ट्रिंग का एल्गोरिथ्म बहुत सरल है: हम मूल स्ट्रिंग को उस ऑब्जेक्ट में लपेटते हैं जिसमें हम सीधे स्ट्रिंग में परिवर्तन लागू नहीं करते हैं, लेकिन निर्देशांक जोड़ते हैं और भविष्य के लिए एक सरणी में क्या करने की आवश्यकता है। और केवल जब कोई परिणामी पंक्ति प्राप्त करना चाहता है, तो हम संचित संचालन करने के लिए 1 से 1 शुरू करते हैं। उदाहरण के लिए:

हमने var के साथ const को प्रतिस्थापित किया, 0 पर शुरू किया और 5 इंडेक्स पर समाप्त किया
हम जानते हैं कि सभी बाद के प्रतिस्थापनों में 2 से कम सूचकांक होना चाहिए (2 वर्णों से कम से कम var, एक लाइन कम)
हम सभी ऑपरेशन के निर्देशांक को अपडेट करते हैं
हम निम्नलिखित ऑपरेशन को लागू करते हैं, आदि।

सब कुछ बहुत सरल दिखता है। लेकिन मैजिकस्ट्रिंग क्यों तेज है? इसका उत्तर काफी सरल है: हम अपने पेड़ पर जितने ऑपरेशन करते हैं, वह एएसटी नोड्स की संख्या से बहुत कम है। एएसटी के लिए आवश्यक स्मृति की मात्रा और तथ्य यह है कि ट्री ट्रैवर्सल (एक पेड़ के माध्यम से यात्रा) का उल्लेख करना नि: शुल्क ऑपरेशन नहीं है, लेकिन ओ (एन + एम) नहीं है

और अगर मैं अतिरिक्त आधे घंटे इंतजार करने के लिए तैयार हूं? और यहाँ मैजिकस्ट्रिंग का दूसरा प्लस आता है। प्रत्येक पार्सर परिवर्तन के लिए अपने स्वयं के एपीआई का आविष्कार करता है। और यह अभी भी बहुत अच्छा है, अगर ऐसा कोई एपीआई है (प्रत्येक पार्सर इसे प्रदान नहीं करता है), बहुत बार हम एएसटी का उपयोग करके स्रोत पाठ को सामान्य रूप से बदलने की क्षमता के बिना छोड़ दिए जाते हैं। लेकिन MagicString स्रोत स्ट्रिंग को बदलने के लिए एक एकल सार्वभौमिक एपीआई है। इससे कोई फर्क नहीं पड़ता कि आपने किस पार्सर या संयोजन का उपयोग किया है। मैजिकस्ट्रिंग के साथ, आप किसी भी एएसटी के साथ समान रूप से अच्छी तरह से काम कर सकते हैं।

मुझे आशा है कि आप MagicString में रुचि रखते हैं। अगले लेख में मैं डबल मैजिकस्ट्रिंग के बारे में बात करूंगा और मार्कडाउन दस्तावेजों का एक सार्वभौमिक अनुवादक कैसे बनाऊं।

मेरी टेलीग्राम चैनल की सदस्यता लें @obenjiro_notes और ट्विटर obenjiroतो इस विषय पर निम्नलिखित लेख और कई अन्य दिलचस्प चीजों को याद नहीं करना चाहिए।

मैजिकस्ट्रिंग क्या है और क्या ये लाइनें इतनी जादुई हैं?

More articles: