अक्टूबर में वेब प्लैटफ़ॉर्म पर नई सुविधाएं

अक्टूबर 2022 में, स्टेबल और बीटा वेब ब्राउज़र में लॉन्च की गई कुछ दिलचस्प सुविधाओं के बारे में जानें.

Rachel Andrew

स्टेबल ब्राउज़र रिलीज़

अक्टूबर में, Firefox 106, Chrome 107, और Safari 16.1 के स्टेबल वर्शन रिलीज़ किए गए. आइए, देखें कि वेब प्लैटफ़ॉर्म के लिए इसका क्या मतलब है.

ग्रिड ट्रैक का ऐनिमेशन

Microsoft में योगदान देने वाले लोगों की मदद से, Chrome अब grid-template-columns और grid-template-rows वैल्यू को इंटरपोलेट कर सकता है. इसका मतलब है कि ग्रिड लेआउट, ऐनिमेशन या ट्रांज़िशन के आधे हिस्से पर स्नैप करने के बजाय, एक से दूसरे स्टेटस में आसानी से ट्रांज़िशन कर सकते हैं.

getDisplayMedia() में जोड़े गए आइटम

Chrome में getDisplayMedia() में कुछ बदलाव भी किए गए हैं. इनका मकसद, स्क्रीन शेयर करते समय गलती से ज़्यादा जानकारी शेयर होने से रोकना है.

• displaySurface विकल्प से यह पता चल सकता है कि वेब ऐप्लिकेशन, किसी खास डिसप्ले प्लैटफ़ॉर्म (टैब, विंडो या स्क्रीन) को दिखाना चाहता है.
• surfaceSwitching विकल्प से पता चलता है कि Chrome को उपयोगकर्ता को शेयर किए गए टैब के बीच डाइनैमिक तौर पर स्विच करने की अनुमति देनी चाहिए या नहीं.
• selfBrowserSurface विकल्प का इस्तेमाल करके, उपयोगकर्ता को मौजूदा टैब शेयर करने से रोका जा सकता है. यह "हॉल ऑफ़ मिरर" इफ़ेक्ट से बचाता है.
• systemAudio विकल्प से यह पक्का होता है कि Chrome, उपयोगकर्ता को सिर्फ़ काम का ऑडियो-कैप्चर दिखाए.

Safari 16.1 में getDisplayMedia के लिए भी सहायता शामिल है. इससे, किसी खास Safari विंडो को कैप्चर करने की सुविधा मिलती है.

सीएसएस से फ़ॉन्ट टेक्नोलॉजी और सुविधाओं के साथ काम करने की जांच करना

Firefox ने @supports के साथ क्वेरी की सुविधा के लिए, font-tech() और font-format() फ़ंक्शन जोड़े हैं. यहां दिए गए उदाहरण में, COLRv1 फ़ॉन्ट के साथ काम करने की जांच की गई है.

@supports font-tech(color-COLRv1) {

}

ज़्यादा उदाहरणों के लिए, MDN पर जाएं.

टेक्स्ट फ़्रैगमेंट तक स्क्रोल करना

Safari 16.1 में, टेक्स्ट फ़्रैगमेंट तक स्क्रोल करने की सुविधा शामिल है. इसकी मदद से, किसी खास टेक्स्ट फ़्रैगमेंट वाले यूआरएल पर नेविगेट किया जा सकता है.

AVIF फ़ॉर्मैट के साथ काम करना

Safari 16 में, स्टिल AVIF इमेज के लिए सहायता शामिल थी. Safari 16.1 में, macOS Ventura, iOS 16, और iPadOS 16 पर ऐनिमेट की गई AVIF इमेज के लिए सहायता शामिल है.

Safari के लिए वेब पुश

Safari 16.1 में, macOS Ventura पर Safari के लिए वेब पुश की सुविधा जोड़ी गई है. इसमें Push API और Notifications API का इस्तेमाल किया जाता है. इस बारे में ज़्यादा जानने के लिए, Meet वेब पुश लेख पढ़ें. Safari में वेब पुश लैंडिंग का मतलब है कि यह सुविधा अब तीनों मुख्य इंजन पर उपलब्ध है.

ब्राउज़र के बीटा वर्शन की रिलीज़

बीटा ब्राउज़र वर्शन से आपको उन चीज़ों की झलक देखने को मिलती है जो ब्राउज़र के अगले स्थिर वर्शन में होंगी. यह नई सुविधाओं या हटाए गए ऐसे कॉन्टेंट को टेस्ट करने का बेहतरीन समय है जो दुनिया के लिए रिलीज़ होने से पहले आपकी साइट पर असर डाल सकता है. इस महीने के नए बीटा वर्शन में, Chrome 108, Firefox 107, और Safari 16.2 शामिल हैं.

Chrome 108 में प्रिंट करते समय, सीएसएस फ़्रैगमेंटेशन प्रॉपर्टी break-before, break-after, और break-inside की avoid वैल्यू के लिए सहायता उपलब्ध है. यह वैल्यू ब्राउज़र को बताती है कि जिस एलिमेंट पर यह लागू किया गया है उसके पहले, बाद या अंदर ब्रेक न लगाएं. उदाहरण के लिए, यहां दी गई सीएसएस, पेज ब्रेक के दौरान किसी आंकड़े के अलग-अलग पेजों पर दिखने से रोकती है.

figure {
    break-inside: avoid;
}

Chrome 108 में, बदले गए एलिमेंट पर ओवरफ़्लो के व्यवहार में बदलाव किया जा रहा है. इससे कुछ मामलों में विज़ुअल में बदलाव हो सकते हैं. ज़्यादा जानकारी के लिए, सीएसएस में बदले गए एलिमेंट पर ओवरफ़्लो में बदलाव लेख पढ़ें. साथ ही, किसी भी समस्या को हल करने का तरीका जानें.

Android पर Chrome में, ऑन-स्क्रीन कीबोर्ड दिखने पर लेआउट व्यूपोर्ट के काम करने के तरीके में बदलाव किया गया है. ज़्यादा जानने के लिए, Android पर Chrome में, व्यूपोर्ट के साइज़ में होने वाले बदलावों के लिए तैयारी करना लेख पढ़ें. साथ ही, अगले महीने इस सुविधा को स्टेबल वर्शन में रिलीज़ करने के लिए तैयारी करने का तरीका जानें.

Chrome में, सीएसएस व्यूपोर्ट यूनिट भी नई हैं. इनमें छोटी (svw, svh, svi, svb, svmin, svmax), बड़ी (lvw, lvh, lvi, lvb, lvmin, lvmax), डाइनैमिक (dvw, dvh, dvi, dvb, dvmin, dvmax), और लॉजिकल (vi, vb) यूनिट शामिल हैं. ये यूनिट, Firefox और Safari में पहले से लागू हैं.

Firefox 107 में COLRv1 फ़ॉन्ट की सुविधा चालू की गई है. इस तरह, यह फ़ॉन्ट टेक्नोलॉजी इस्तेमाल करने वाले ब्राउज़र की सूची में Chrome के साथ शामिल हो गया है. फ़ॉन्ट में, Chrome 108 में font-tech() और font-format() फ़ंक्शन के लिए भी सहायता जोड़ी गई है, ताकि @supports के साथ क्वेरी दिखाई जा सकें.

Firefox में भी contain-intrinsic-size की सुविधा जोड़ी गई है. इस तरह, Chrome के साथ अब दो ब्राउज़र में यह सुविधा काम करेगी.

Safari 16.2 बीटा में, सीएसएस से जुड़ी कई गड़बड़ियों को ठीक किया गया है. इनमें साइज़ और स्क्रोल स्नैप शामिल हैं.

वेब सीरीज़ के लिए नया है का हिस्सा