नवंबर में वेब प्लैटफ़ॉर्म पर नया है

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

Rachel Andrew

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

नवंबर में, Firefox 107 और Chrome 108 ठीक से काम कर रहे थे. आइए, देखें कि वेब प्लैटफ़ॉर्म के लिए इसका क्या मतलब है.

Android पर, Chrome के लेआउट व्यूपोर्ट के व्यवहार में बदलाव

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

नई व्यूपोर्ट इकाइयां

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

बड़ी, छोटी, और डाइनैमिक व्यूपोर्ट यूनिट पढ़ें.

Firefox 107 में, contain-intrinsic-size शॉर्टहैंड सीएसएस प्रॉपर्टी के साथ-साथ, contain-intrinsic-width, contain-intrinsic-height, और लॉजिकल प्रॉपर्टी contain-intrinsic-block-size और contain-intrinsic-inline-size का इस्तेमाल किया जा सकता है.

इनका इस्तेमाल, ऐसे यूज़र इंटरफ़ेस (यूआई) एलिमेंट के साइज़ की जानकारी देने के लिए किया जाता है जिसे साइज़ में कंट्रोल किया जा सकता है. इससे उपयोगकर्ता एजेंट, किसी एलिमेंट के चाइल्ड एलिमेंट को रेंडर किए बिना ही उसका साइज़ तय कर सकता है. ये तब काम के होते हैं, जब किसी एलिमेंट को साइज़ में कंट्रोल किया जाता है.

सीएसएस फ़्रैगमेंटेशन avoid कीवर्ड के लिए सहायता

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

figure {
    break-inside: avoid;
}

यह सुविधा, LayoutNG का इस्तेमाल करके प्रिंट की सुविधा को शामिल करने की वजह से जोड़ी गई है. इससे आपको आधुनिक और कम गड़बड़ियों वाला अनुभव मिलता है. LayoutNG के बारे में ज़्यादा जानें.

Federated Credential Management API

Federated Credential Management API (FedCM), वेब पर फ़ेडरेटेड आइडेंटिटी फ़्लो के लिए एक एब्स्ट्रैक्शन उपलब्ध कराता है. यह ब्राउज़र से जुड़ा डायलॉग दिखाता है. इसकी मदद से, उपयोगकर्ता वेबसाइटों पर लॉगिन करने के लिए, पहचान की पुष्टि करने वाली सेवा देने वाली कंपनियों से खाते चुन सकते हैं. FedCM, Chrome 108 में उपलब्ध है. इस बारे में ज़्यादा जानने के लिए, FedCM के बारे में सूचना देने वाली ब्लॉग पोस्ट पढ़ें.

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

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

Firefox 108 में, <source> एलिमेंट के लिए height और width एट्रिब्यूट का इस्तेमाल किया जा सकता है. हालांकि, ऐसा तब ही किया जा सकता है, जब यह <picture> एलिमेंट का चाइल्ड एलिमेंट हो. इन एट्रिब्यूट में, इमेज की ऊंचाई या चौड़ाई को पिक्सल में, बिना किसी यूनिट के पूर्णांक के तौर पर स्वीकार किया जाता है.

फ़ायरफ़ॉक्स में कंटेनर क्वेरी लागू की जा रही हैं. Firefox 108 बीटा में layout.css.container-queries.enabled फ़्लैग के पीछे आपको कंटेनर क्वेरी की लंबाई वाली यूनिट दिखेंगी—cqw, cqh, cqi, cqb, cqmin, cqmax. ये क्वेरी कंटेनर के साइज़ के हिसाब से लंबाई की इकाइयां हैं.

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