वेब के लिए ऐप्लिकेशन बनाना आसान बनाना.
जब हम डेवलपर से बात करते हैं, तो हमें बार-बार एक ही बातें सुनाई देती हैं. भले ही, हम उनसे व्यक्तिगत तौर पर बात करें या सीएसएस की स्थिति जैसे सर्वे के ज़रिए. डेवलपर को ऐसी वेबसाइटें और ऐप्लिकेशन बनाना मुश्किल लगता है जो सभी ब्राउज़र पर अच्छी तरह से काम करें. साथ ही, उन्हें यह पता लगाने में भी मुश्किल होती है कि नई सुविधाओं का इस्तेमाल कब सुरक्षित है.
फ़्लेक्सबॉक्स गैप
समस्या वाली प्रॉपर्टी के उदाहरण के तौर पर, gap
प्रॉपर्टी की मदद से, grid या flex आइटम या multicol कंटेनर के कॉलम के बीच गैप बनाया जा सकता है. मल्टीकोल में column-gap
का इस्तेमाल लंबे समय से किया जा रहा है. हालांकि, यह प्रॉपर्टी पहली बार ग्रिड लेआउट में grid-gap
के तौर पर दिखी थी. साथ ही, इसमें grid-column-gap
और grid-row-gap
भी शामिल थे.
ब्राउज़र में ग्रिड लेआउट के लॉन्च होने के तुरंत बाद, प्रॉपर्टी का नाम बदलकर gap
कर दिया गया. साथ ही, row-gap
और column-gap
को भी बदल दिया गया. इसके बाद, यह फ़्लेक्स लेआउट में भी काम करने लगा. नाम बदलने का मतलब है कि हमारे पास एक ही काम करने वाली कई प्रॉपर्टी नहीं हैं.
.box {
display: flex;
gap: 1em;
}
Firefox ने अक्टूबर 2018 में, फ़्लेक्स लेआउट के लिए प्रॉपर्टी को लॉन्च किया था. यह सुविधा जुलाई 2020 तक Chrome में नहीं दिखी. इसके बाद, अप्रैल 2021 में Safari में दिखी. इसका मतलब है कि gap
का सुरक्षित तरीके से इस्तेमाल करने के लिए, दो साल और छह महीने का इंतज़ार करना पड़ा. असल में, ज़्यादातर डेवलपर को ज़्यादा इंतज़ार करना पड़ा, क्योंकि उन्हें नए वर्शन के अलावा, ब्राउज़र के पुराने वर्शन के साथ भी काम करना था. फ़्लेक्स लेआउट में gap
का इस्तेमाल करने की सुविधा को उपलब्ध कराने में ज़्यादा समस्याएं हुईं. इसकी वजह यह है कि फ़्लेक्स लेआउट में गैप की सुविधा का पता लगाने के लिए, सुविधा क्वेरी का इस्तेमाल नहीं किया जा सकता. gap
प्रॉपर्टी, ग्रिड में काम करती है. इसलिए, @supports (gap:1em)
के तौर पर 'सही है' दिखेगा.
एक और समस्या यह है कि जब किसी ब्राउज़र में कोई नई सुविधा लॉन्च होती है, तो लोग उसके बारे में बातचीत शुरू कर देते हैं और डेमो शेयर करते हैं. आम तौर पर, यह प्रोसेस किसी ब्राउज़र में यह सुविधा उपलब्ध होने से काफ़ी पहले शुरू हो जाती है. इससे डेवलपर को भ्रम हो सकता है या कम से कम, उन्हें परेशानी हो सकती है. हर जगह नई सुविधाओं के बारे में बार-बार बात की जा रही है. हालांकि, आपको पता चलता है कि सहायता की कमी की वजह से, उनका इस्तेमाल नहीं किया जा सकता.
सहायता में अंतर क्यों है?
यह पोस्ट, किसी ब्राउज़र को धीमा होने के लिए दोष नहीं लगा रही है. अलग-अलग प्लैटफ़ॉर्म की सुविधाओं को देखकर पता चलता है कि अलग-अलग ब्राउज़र में अलग-अलग सुविधाएं होती हैं.
ज़्यादातर सुविधाओं का प्रोटोटाइप एक ही ब्राउज़र में बनाया जाएगा. उदाहरण के लिए, ग्रिड लेआउट स्पेसिफ़िकेशन को सबसे पहले Microsoft ने बनाया था और इसे Internet Explorer 10 में शुरुआती फ़ॉर्म में लागू किया गया था. Mozilla के एक इंजीनियर ने यह पता लगाने के लिए काफ़ी काम किया कि सबग्रिड कैसे काम करना चाहिए. इसलिए, यह सुविधा सबसे पहले Firefox में लॉन्च की गई. हमने देखा है कि Safari में रंग से जुड़ी कुछ नई सुविधाएं जोड़ी गई हैं.
प्रोटोटाइप बनाने की प्रक्रिया में, एक ब्राउज़र की मुख्य भूमिका हो सकती है. हालांकि, सीएसएस वर्किंग ग्रुप में सभी ब्राउज़र (और अन्य संगठनों) के प्रतिनिधि, सीएसएस की सुविधाओं के बारे में चर्चा करते हैं. यह बहुत ज़रूरी है कि किसी सुविधा को सभी ब्राउज़र में लागू किया जा सके. साथ ही, यह भी ज़रूरी है कि इसे इस तरह से डिज़ाइन न किया गया हो कि किसी ब्राउज़र में इसे लागू करना मुश्किल हो. इससे, सहायता पाने में हमेशा समस्याएं आती रहेंगी और लोग इस सुविधा का इस्तेमाल नहीं करेंगे.
हालांकि, किसी सुविधा को लागू करने के लिए, उसे उस ब्राउज़र के लिए उपलब्ध अन्य सभी सुविधाओं के साथ प्राथमिकता दी जानी चाहिए. साथ ही, कभी-कभी ब्राउज़र को बेहतर बनाने के लिए, अन्य कामों में भी समय लगता है. इसका एक अच्छा उदाहरण, Chromium में RenderingNG का काम है. इससे सबग्रिड को लागू करने का रास्ता साफ़ हो गया है. हालांकि, Firefox और Chromium के सबग्रिड शिपिंग के बीच का लंबा अंतर इस वजह से है, क्योंकि पहले नए रेंडरिंग इंजन में ग्रिड लेआउट को फिर से लागू करना ज़रूरी है.
समस्याएं
यहां दो समस्याएं हैं. पहला, इंटरऑपरेबिलिटी से जुड़ी समस्या. यह एक ऐसी समस्या है जिसमें किसी सुविधा को एक ब्राउज़र में उपलब्ध कराने के बाद, उसे सभी ब्राउज़र में उपलब्ध कराने में काफ़ी समय लग सकता है.
दूसरी समस्या, मैसेजिंग से जुड़ी है. हम यह कैसे बताएं कि सहायता में कहां कमी है? हम नई सुविधाओं को कैसे शेयर करें, ताकि हर व्यक्ति को हर चीज़ के बारे में सावधानी से रिसर्च करने की ज़रूरत न पड़े और यह पता चल सके कि वह सुविधा कितनी अच्छी है?
इंटरोऑपरेबिलिटी
ब्राउज़र, इंटरऑपरेबिलिटी की समस्या को हल करने के लिए पहले से ही साथ मिलकर काम कर रहे हैं. पिछले साल Compat 2021 की मदद से, कई सुविधाओं के लिए सहायता की कमी को पूरा किया गया. इनमें फ़्लेक्स लेआउट में गैप प्रॉपर्टी भी शामिल है. इस साल Interop 2022 में 15 सुविधाओं पर फ़ोकस किया जा रहा है. इनमें से कुछ सुविधाओं पर पहले से ही काम चल रहा है.
Interop 2022 डैशबोर्ड पर जाकर, प्रोग्रेस देखी जा सकती है.
मैसेज सेवा
दूसरी समस्या यह है कि जब हम web.dev और developer.chrome.com पर सुविधाओं के बारे में बात करते हैं, तो मुझे इस समस्या को हल करने में मदद करनी है. मैं चाहता हूं कि जब आप हमारा कॉन्टेंट पढ़ें, तो सुविधाओं की स्थिति साफ़ तौर पर पता चल जाए. साथ ही, हम सहायता से जुड़ी समस्याओं को हल करने के लिए, काम के तरीके उपलब्ध कराएं.
हमने कई बुनियादी कोर्स लॉन्च किए हैं. आने वाले समय में और भी कोर्स लॉन्च किए जाएंगे. इन कोर्स की मदद से, आपको आधुनिक वेब के लिए वेबसाइट बनाने का तरीका पता चलता है. इसके लिए, वेब प्लैटफ़ॉर्म की मुख्य टेक्नोलॉजी का इस्तेमाल किया जाता है. चेक आउट:
हम इस साइट पर ऐसे कॉन्टेंट पर फ़ोकस कर रहे हैं जिसका इस्तेमाल सुरक्षित तरीके से किया जा सकता है. हम अभी इस प्रोसेस को पूरी तरह से पूरा नहीं कर पाए हैं. हालांकि, आने वाले महीनों में आपको इस प्रोसेस में कुछ बदलाव दिखने लगेंगे.
हम Open Web Docs प्रोजेक्ट की मदद से, वेब से जोड़ने का तरीका बताने वाले दस्तावेज़ों को भी उपलब्ध कराते हैं. इससे यह पक्का होता है कि हमारे पास MDN पर बेहतरीन दस्तावेज़ हों. साथ ही, अलग-अलग ब्राउज़र पर साइट की जांच करने से जुड़ा अप-टू-डेट डेटा भी हो. इसके बाद, हम इस डेटा का इस्तेमाल web.dev पर, सुविधाओं के लिए सहायता दिखाने के लिए करते हैं. फ़्लेक्स लेआउट में gap
के इस्तेमाल से जुड़ी मौजूदा जानकारी यहां दी गई है.
ब्राउज़र के इस्तेमाल से जुड़ी सहायता
अगर आपको वेब के लिए Chrome के विज़न के बारे में ज़्यादा जानना है, तो आपको वह कॉन्टेंट हमारी साइट—developer.chrome.com पर मिलेगा. इस कॉन्टेंट में, Origin और डेवलपर ट्रायल में आज़माए जा रहे नए फ़ीचर के बारे में बताया गया है. हो सकता है कि यह कॉन्टेंट एक्सपेरिमेंटल हो या फ़िलहाल सिर्फ़ Chrome में काम करता हो. हालांकि, हमें आपको इस कॉन्टेंट को एक्सप्लोर करने और उससे जुड़ा सुझाव या राय देने में खुशी होगी.
फ़िलहाल, वेब के लिए यह एक रोमांचक समय है. हमें उम्मीद है कि हम आपको मुख्य सुविधाएं जल्दी से जल्दी उपलब्ध करा पाएंगे. साथ ही, वेब डेवलपमेंट को ज़्यादा मज़ेदार और कम परेशानी भरा बनाने के लिए, मौजूद गैप के बारे में साफ़ तौर पर बता पाएंगे.
फ़ोटो Cristofer Maximilian की है.