अलविदा, इलेक्ट्रॉन। हैलो डेस्कटॉप PWA

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

क्रोम v70 नवाचार

Chrome और v70 का नवीनतम संस्करण डेस्कटॉप प्रोग्रेसिव वेब ऐप्स (PWA) को लिनक्स और विंडोज प्लेटफॉर्म पर सपोर्ट करता है।


क्रोम में डेस्कटॉप PWA सपोर्ट

यदि आप समर्थित प्रणालियों की सूची को देखते हैं, तो यह तुरंत इसमें MacOS की अनुपस्थिति को स्पष्ट करता है। हालाँकि, यह केवल तब तक है जब तक कि क्रोम v72 जारी न हो जाए।


MacOS पर डेस्कटॉप PWA सपोर्ट

यह ध्यान रखना महत्वपूर्ण है कि हालांकि यह सुविधा मैकओएस पर डिफ़ॉल्ट रूप से सक्षम नहीं है, इसे उपयुक्त ध्वज का उपयोग करके सक्रिय किया जा सकता है। ऐसा करने के लिए, क्रोम खोलें, क्रोम पर जाएं: // झंडे और वहां इस झंडे को ढूंढें। आप सीधे लिंक क्रोम का उपयोग करके भी झंडे पर जा सकते हैं : // झंडे / # सक्षम-डेस्कटॉप-पावस ।

प्रगतिशील वेब अनुप्रयोग क्या हैं?

हम यहां PWA के संबंध में विशिष्ट विवरणों में नहीं जाएंगे। यहां Google प्रलेखन अनुभाग है जहां आप उनके बारे में पढ़ सकते हैं। अपनी आँखों से PWA को देखने और आज़माने के लिए, iOS में Android या Safari के लिए Chrome खोलें (यहाँ, हालाँकि, सभी PWA सुविधाएँ समर्थित नहीं हैं) और इन उदाहरणों को देखें। और इस विषय पर Google I / O '18 के साथ एक भाषण दिया गया है।

इलेक्ट्रॉन क्या है?

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

PWA का इससे क्या लेना-देना है?

हालांकि इलेक्ट्रॉन अनुप्रयोग एक बढ़ती और विकसित होने वाली घटना है, और उनका कार्यान्वयन वेब अनुप्रयोगों के कार्यान्वयन के करीब है, फिर भी उनके कुछ नुकसान हैं। सबसे पहले, ऐसे एप्लिकेशन क्रोमियम ब्राउज़र के अपने स्वयं के उदाहरणों का उपयोग करते हैं। बहुत से लोग जानते हैं कि क्रोम को काम करने के लिए कितनी रैम की आवश्यकता होती है। अब, सिस्टम में उत्पन्न होने वाली स्थिति का आकलन करने के लिए जब कई इलेक्ट्रॉन अनुप्रयोगों को एक साथ लॉन्च किया जाता है, तो आपको उनकी संख्या लेने की आवश्यकता है और इस मात्रा को स्मृति से गुणा करना होगा। यदि रुचि है, तो कुछ इलेक्ट्रॉन एप्लिकेशन खोलें और देखें कि वे कितनी मेमोरी का उपभोग करते हैं।

मेमोरी का अत्यधिक उपयोग अपने आप में बहुत अच्छा नहीं है, और यहां हमें जोड़ना होगा कि कई इलेक्ट्रॉन एप्लिकेशन Node.js के साथ एक विशिष्ट तरीके से बातचीत करते हैं, जरूरी नहीं कि यह उसी तरह से संगत वेब एप्लिकेशन के रूप में कर रहा हो।

इलेक्ट्रॉन का उपयोग कार्यक्रमों के पुराने संस्करणों का समर्थन करने और एप्लिकेशन अपडेट प्रक्रिया को स्थापित करने से जुड़ी कठिनाइयों को जोड़ता है।

अब बात करते हैं डेस्कटॉप PWA की। उन अनुप्रयोगों की कल्पना करें जो इलेक्ट्रॉन में लिखे गए हैं, जो काम करने के लिए भी सुविधाजनक हैं, लेकिन एक ही समय में उन्हें स्थापित करना सरल है, वे समस्याओं के बिना भी अपडेट किए जाते हैं, एक वेब एप्लिकेशन से क्लाइंट को सामग्री के हस्तांतरण के दौरान। ऐसा लगता है कि Chrome डेस्कटॉप PWA में समान व्यवहार परिदृश्य के लिए मानक सेट कर रहा है। जब क्रोम में काम करने वाला उपयोगकर्ता एक निश्चित वेब पेज पर जाता है, और उसे प्रस्तुत किया गया आवेदन मानदंडों के इस सेट से मिलता है, तो एप्लिकेशन डेवलपर के पास अपने कंप्यूटर पर एप्लिकेशन को स्थापित करने के लिए उपयोगकर्ता को आमंत्रित करने का अवसर होता है। प्रॉम्प्ट नीचे की तरह कुछ दिखता है।


PWA स्थापना आमंत्रण

ब्राउज़र द्वारा beforeinstallprompt ऑब्जेक्ट beforeinstallprompt घटना beforeinstallprompt बाद ही डेवलपर इस संकेत को दिखा सकता है। एप्लिकेशन इंस्टॉल करने के बाद, डेस्कटॉप पर संबंधित आइकन दिखाई देता है।


PWA लॉन्चर आइकन

ऐसा एप्लिकेशन शुरू करने के बाद, यह एक ब्राउज़र विंडो में खुलता है जो पारंपरिक नियंत्रणों से सुसज्जित नहीं है। इस तरह के एप्लिकेशन को वास्तविक डेस्कटॉप एप्लिकेशन के रूप में माना जाता है।


PWA लॉन्च किया

PWA का उदाहरण

यहाँ एक डेस्कटॉप PWA का एक उदाहरण है जिसके स्क्रीनशॉट का उपयोग ऊपर दिए गए चित्र के रूप में किया गया था। यहाँ GitHub पर उनका भंडार है। इस एप्लिकेशन को स्थापित करने के लिए, आपको Chrome में संबंधित ध्वज को सक्षम करने और साइट पर कम से कम 30 सेकंड बिताने की आवश्यकता है।

जैसा कि पहले ही उल्लेख किया गया है, एक वेब एप्लिकेशन, जिसे डेस्कटॉप PWA माना जाता है, को निश्चित आवश्यकताओं को पूरा करना चाहिए। यदि आप अपना स्वयं का डेस्कटॉप PWA बनाना और परीक्षण करना चाहते हैं, तो आप इस रिपॉजिटरी को एक आधार के रूप में ले सकते हैं और आवश्यकताओं को ध्यान में रख सकते हैं। यदि आप उनका संक्षिप्त सारांश बनाते हैं, तो आपको निम्नलिखित मिलते हैं:

• आवेदन HTTPS से अधिक होना चाहिए।
• इसमें कम से कम एक fetch हैंडलर के साथ एक स्थापित सेवा कार्यकर्ता होना चाहिए।
• यह एक ठीक से स्वरूपित manifest.json होना चाहिए। फ़ाइल को खोलें।
• इसके पृष्ठों को उत्तरदायी डिज़ाइन तकनीकों का उपयोग करके डिज़ाइन किया जाना चाहिए।

अतिरिक्त उदाहरण

यदि आप MacOS पर काम कर रहे हैं, तो PWA इस पर विचार कर सकता है कि आप उन्हें स्थापित नहीं कर सकते हैं, और वे आपको उन्हें स्थापित करने के लिए निमंत्रण नहीं दिखाएंगे। यदि आप डेवलपर कंसोल के साथ उचित झंडे और टिंकर को सक्षम करते हैं, तो आप स्थापना के लिए संकेत देने के लिए PWA प्राप्त कर सकते हैं। यहां कुछ मौजूदा PWA हैं जो मैक पर इंस्टॉल किए गए हैं।

▍Starbucks

एक महान PWA को विकसित करने में स्टारबक्स ने काफी निवेश किया है। उनका डेस्कटॉप एप्लिकेशन वास्तव में प्रभावशाली था।


PWA स्टारबक्स

▍Google मानचित्र

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


PWA Google मैप्स

▍Twitter

ट्विटर ने एक मोबाइल PWA को विकसित करने की कोशिश की, और डेस्कटॉप संस्करण को मोबाइल एप्लिकेशन के लिए एक योग्य जोड़ माना जा सकता है।


PWA ट्विटर

परिणाम

इस तथ्य के बावजूद कि डेस्कटॉप PWA के चारों ओर बहुत अधिक शोर उठाया गया है, आपको यह जानने की आवश्यकता है कि यह तकनीक अभी भी अपनी प्रारंभिक अवस्था में है। विशेष रूप से, डेस्कटॉप PWA के लिए निम्नलिखित विकास दिशाएँ नोट की जा सकती हैं:

• डीप लिंक: क्रोम से खोले गए लिंक इंस्टॉल किए गए एप्लिकेशन को आमंत्रित करते हैं।
• ऐप आइकन पर सूचनाएं: मोबाइल ऐप आइकन की तरह, डेस्कटॉप ऐप लॉन्चर आइकन पर सूचनाएं दिखाएं।
• हॉटकी समर्थन: हॉटकी अनुप्रयोगों के अंदर उपयोग के लिए कीबोर्ड घटनाओं को सुनने की क्षमता।

एक बार PWA के डेस्कटॉप डेवलपमेंट टेक्नॉलॉजी काफी विकसित हो जाने के बाद, ये एप्लिकेशन आज की इलेक्ट्रॉन आधारित परियोजनाओं के लिए गंभीर प्रतियोगी बन जाएंगे।

प्रिय पाठकों! क्या आप डेस्कटॉप PWA विकसित करने की योजना बना रहे हैं?