Internet Explorer के आखिर में

Internet Explorer के लिए सहायता बंद करने का मतलब, Maersk.com के ग्राहकों और डेवलपर के लिए क्या है.

steveworkman
steveworkman

मेरा नाम स्टीव वर्कमैन है और मैं Maersk.com का लीड इंजीनियर हूं. Maersk, इंटिग्रेटेड सप्लाई चेन लॉजिस्टिक में दुनिया भर में सबसे आगे है. यह कंपनी पिछले 118 सालों से दुनिया भर में ग्राहकों को सामान भेजने में मदद कर रही है. साथ ही, पिछले 20 सालों से ऑनलाइन बुकिंग की सुविधा भी दे रही है. Microsoft ने जून 2022 में, Internet Explorer के लिए सहायता देने की सुविधा को आधिकारिक तौर पर बंद कर दिया था. इसके बाद, @Maersk ने मई 2022 की शुरुआत में, अपने ग्राहकों के लिए उपलब्ध सिस्टम पर Internet Explorer (IE) के साथ काम करना बंद कर दिया था. यह वेब के एक अहम युग का आखिर है और एक नए युग की शुरुआत.

मैंने साल 2018 में Maersk जॉइन किया था. मेरा पहला प्रोजेक्ट, एक नया ग्लोबल नेविगेशन बार बनाना था. यह पूरी तरह से टेस्ट किया जा सकता था, इसे दुनिया भर में आसानी से डिप्लॉय और अपडेट किया जा सकता था. साथ ही, यह मोबाइल-फ़र्स्ट, रिस्पॉन्सिव, और कई ब्रैंड के साथ काम करता था. साथ ही, इसे कॉन्फ़िगर किया जा सकता था और 11 भाषाओं में स्थानीय बनाया जा सकता था. इसके अलावा, यह IE9 के साथ काम करता था.

आंकड़ों के हिसाब से, 2018 में Windows 7 और इसका डिफ़ॉल्ट ब्राउज़र IE9 अब भी काफ़ी लोकप्रिय थे. Windows 10 और IE11, सिर्फ़ 2020 की शुरुआत में ही बड़ी संख्या में पहुंच रहे थे. हमने अपने डेटा को देखा. इससे हमें पता चला कि IE9 या इससे भी खराब IE11 का इस्तेमाल करने वाले ग्राहकों से काफ़ी कारोबार हो रहा है, जो कंपैटबिलिटी मोड में है. यह ट्रैफ़िक, उभरते हुए बाज़ारों और उन इलाकों में काफ़ी ज़्यादा था जहां Maersk के ग्राहक आधार में तेज़ी से बढ़ोतरी हो रही थी.

अगर नेविगेशन मेन्यू काम नहीं करता है, तो लॉगिन बटन ढूंढना मुश्किल हो जाता है. अगर लॉगिन नहीं हो पाता है, तो वे कंटेनर बुक नहीं कर पाएंगे. इससे आपको अचानक एक बड़ी समस्या का सामना करना पड़ सकता है. इसकी वजह, लेगसी ब्राउज़र हैं.

इस समस्या को हल करने के लिए, हमने नेविगेशन कॉम्पोनेंट और आने वाले समय में बनने वाले वेब ऐप्लिकेशन के साथ, बेहतर बनाने की प्रोसेस को बेहतर बनाया है. हम इसे "काम" कराने की कोशिश करेंगे, लेकिन ऐसा करने के लिए ज़रूरी पॉलीफ़िल और पाबंदियां हो सकती हैं. उदाहरण के लिए, IE में Fetch एपीआई काम नहीं करता. हालांकि, IE10 के लिए पॉलीफ़िल उपलब्ध हैं, जिन्हें हम उन ब्राउज़र के लिए शामिल करते हैं. IE9 के लिए, हमने XMLHttpRequest कॉल को एक अलग फ़ाइल में कोड किया है, ताकि इसे सिर्फ़ उन मामलों में लोड किया जा सके जहां fetch को पॉलीफ़िल नहीं किया जा सका.

जब IE9 के लिए सहायता बंद करने का समय आया, तब हमारे पास सिर्फ़ कुछ ग्राहक बचे थे. हमने अपने ऐप्लिकेशन से इस कोड को आसानी से हटा दिया. इससे, आधुनिक ब्राउज़र पर हमारे उपयोगकर्ताओं को ज़्यादा से ज़्यादा फ़ायदा मिला और हमें कम से कम मेहनत करनी पड़ी.

Maersk के डिजिटल ट्रांसफ़ॉर्मेशन की प्रोसेस जारी रहने के दौरान, हमने साइट के कई हिस्सों को VueJS के साथ काम करने वाले माइक्रो-फ़्रंट-एंड में फिर से बनाया. Vue में कई ऐसी सुविधाएं थीं जो इसे आने वाले समय के हिसाब से बेहतर बनाती हैं. जैसे, ऐडवांस ट्री-शैकिंग और बंडल ऑप्टिमाइज़ेशन के लिए बेहतर प्रीसेट कॉन्फ़िगरेशन. साथ ही, मॉडर्न मोड, जिसमें ऐप्लिकेशन के दो वर्शन बनाए जाते हैं. पहला, हमेशा काम करने वाले ब्राउज़र के लिए, नए ES मॉड्यूल सिंटैक्स का इस्तेमाल करता है और दूसरा, ऐसे लेगसी ऐप्लिकेशन के लिए जो ES6 मॉड्यूल को समझ नहीं पाते. यह लेगसी वर्शन IE जैसे ब्राउज़र के लिए इस्तेमाल किया जाता है और इसके gzip किए गए पॉलीफ़िल बंडल में अक्सर 100 केबी से बड़ा होता है. इसका साइज़, ब्राउज़र में मौजूद सुविधाओं से कम होता है.

हमें पता चला कि हम सीएसएस ग्रिड जैसी ज़्यादातर आधुनिक सीएसएस लेआउट तकनीकों का भी इस्तेमाल कर सकते हैं. इसकी वजह यह है कि Microsoft ने IE10 में ही इसकी सुविधा शुरू कर दी थी. autoprefixer और CSS Tricks के इस लेख की मदद से, हमने पेज के अलग-अलग हिस्सों को नाम देने में काफ़ी तरक्की की. इससे हमें एक ऐसा लेआउट सिस्टम मिला जो हल्का, किसी भी प्रोजेक्ट के लिए सही, और काफ़ी फ़्लेक्सिबल है. हालांकि, साथ काम करने से जुड़ी कुछ समस्याएं थीं, जिन्हें ठीक करने में काफ़ी समय लगा.

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

IE से आने वाले ट्रैफ़िक में गिरावट आने के बाद, Maersk ने कई अन्य कंपनियों की तरह ही IE के लिए आधिकारिक सहायता बंद करने का फ़ैसला लिया. हालांकि, आंकड़ों के हिसाब से, हमें अब भी IE के लिए सहायता देनी चाहिए. तो, अब क्यों?

हॉरिज़ॉन्टल नेविगेशन बार वाली वेबसाइट.
Maersk का होम पेज, जिसमें ग्लोबल नेविगेशन कॉम्पोनेंट है.

आसान शब्दों में कहें, तो वेब प्लैटफ़ॉर्म आगे बढ़ चुका है और IE11 वे काम नहीं कर सकता जिन्हें हमें करना है. भले ही, इसमें पॉलीफ़िल की एक छोटी सेना हो. नेविगेशन कॉम्पोनेंट को देखें—आधुनिक वेब प्लैटफ़ॉर्म की दुनिया में यह एक कस्टम एलिमेंट है. इसमें सीएसएस वैरिएबल और कंटेनर क्वेरी से चलने वाली स्टाइल होती हैं. इसलिए, यह एक कॉम्पोनेंट में सब कुछ कंट्रोल करता है. प्लैटफ़ॉर्म के इन हिस्सों के बिना, इन कॉम्पोनेंट की स्टाइल को ऐप्लिकेशन से पूरी तरह बदला जा सकता है. साथ ही, स्टाइल दूसरे कॉम्पोनेंट या ऐप्लिकेशन में लीक हो सकती हैं. यहां कुछ पॉलीफ़िल हैं जिनकी मदद से, कस्टम एलिमेंट, ShadyCSS, ShadyDOM, और टेंप्लेट एलिमेंट जैसी ज़्यादातर सुविधाओं को एमुलेट किया जा सकता है.

आम तौर पर, ये पॉलीफ़िल अलग-अलग कॉम्पोनेंट के लिए बेहतर तरीके से काम करते हैं. हालांकि, किसी जटिल ऐप्लिकेशन में कई कॉम्पोनेंट को जोड़ने पर, IE कुछ सेकंड के लिए सफ़ेद स्क्रीन पर रुक जाता है. इस दौरान, JavaScript रनटाइम चालीस सेकंड के लिए स्टाइल ट्री का हिसाब लगाने की कोशिश करता है. कम शब्दों में कहें, तो ब्राउज़र के साथ काम करने के लिए, उपयोगकर्ता अनुभव को काफ़ी हद तक खराब किया गया था.

पहले, इस सुविधा के इस्तेमाल में छोटी-मोटी रुकावटें होती थीं. पॉलीफ़िल की वजह से, पहले पेंट में आधा सेकंड लग सकता था. हालांकि, इस दौरान ज़्यादा रुकावट नहीं आती. यह अलग था और इन ऐप्लिकेशन का इस्तेमाल नहीं किया जा सका. आधुनिक वेब प्लैटफ़ॉर्म की जटिलता के सामने, पॉलीफ़िल काफ़ी काम नहीं कर सकते.

आपको पता है कि IE का इस्तेमाल बंद करने के बाद क्या हुआ है? बहुत, बहुत कम. ग्राहक सहायता टीम को टिकट या नकारात्मक सुझाव, शिकायत या राय नहीं मिली है. हमारे इंजीनियर खुश हैं और हमारे ऐप्लिकेशन में Vue 3 पर अपग्रेड करने का पाथ है. यह IE11 के साथ काम नहीं करता, क्योंकि प्रॉक्सी ऑब्जेक्ट को पॉलीफ़िल नहीं किया जा सकता. साथ ही, हमारे ऐप्लिकेशन के बंडल का साइज़ भी छोटा हो गया है. सीएसएस वैरिएबल और वैरिएबल फ़ॉन्ट के लिए पूरी तरह से काम करने की सुविधा की मदद से, सभी ब्रैंड के लिए थीम को आसानी से बनाया जा सकता है. साथ ही, Vue के सिंगल फ़ाइल कॉम्पोनेंट में टोकन का इस्तेमाल करने की सुविधा से, डेवलपर को बेहतर अनुभव मिलता है.

ग्राहक के नज़रिए से, IE का इस्तेमाल धीरे-धीरे कम हो रहा है. IE को साइट से बंद नहीं किया गया है. हालांकि, प्रगतिशील बेहतर बनाने की सुविधा के बंद होने के बाद, सुविधाएं और ऐप्लिकेशन काम करना बंद कर देंगे. हमारी टेक्नोलॉजी में हुए डेवलपमेंट से ग्राहकों को फ़ायदा होगा. साइट से बेहतर अनुभव, सुलभता, और डिज़ाइन को Lit पर आधारित डिज़ाइन सिस्टम के तौर पर डेवलप किया जा रहा है. इसमें अभी या आने वाले समय में काम करने वाले किसी भी फ़्रेमवर्क के साथ पूरी तरह से इंटरऑपरेबिलिटी (एक-दूसरे के साथ काम करने की सुविधा) शामिल है.

मुझे यह देखकर खुशी हो रही है कि कंपनी में वेब प्लैटफ़ॉर्म की नई सुविधाओं का इस्तेमाल कैसे किया जा सकता है. जैसे, डार्क मोड का इस्तेमाल करके, जहाज़ के सिस्टम को रात में आसानी से इस्तेमाल करना, वेब ब्लूटूथ, WebXR, और PWA का इस्तेमाल करके, हमारे वेब ऐप्लिकेशन किसी भी स्थिति में हमारे आस-पास की दुनिया के साथ इंटरैक्ट कर सकें. Internet Explorer, कई चीज़ों के लिए धन्यवाद. अब हम वेब प्लैटफ़ॉर्म के साथ अप-टू-डेट हो पाएंगे.