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

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

Rachel Andrew

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

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

inert एट्रिब्यूट

Firefox 112 में inert ग्लोबल एट्रिब्यूट शामिल है. यह एट्रिब्यूट, ब्राउज़र को एलिमेंट को अनदेखा करने के लिए कहता है. इससे यह पता चलता है कि कॉन्टेंट इंटरैक्टिव नहीं होना चाहिए. इससे:

  • click इवेंट ट्रिगर होने से रोकता है.
  • इससे एलिमेंट पर फ़ोकस नहीं होता.
  • सुलभता ट्री से एलिमेंट और उसके कॉन्टेंट को बाहर रखता है.

यह एट्रिब्यूट अब तीनों इंजन में काम करता है.

ब्राउज़र के इस्तेमाल से जुड़ी सहायता

  • Chrome: 102.
  • Edge: 102.
  • Firefox: 112.
  • Safari: 15.5.

सोर्स

linear() easing फ़ंक्शन

linear() ईज़िंग फ़ंक्शन, कई पॉइंट के बीच लीनियर इंटरपोलेशन की सुविधा देता है. इससे, बाउंस और इलास्टिक इफ़ेक्ट जैसे ज़्यादा जटिल ऐनिमेशन इस्तेमाल किए जा सकते हैं. यह सुविधा Firefox 112 में उपलब्ध है.

ब्राउज़र के इस्तेमाल से जुड़ी सहायता

  • Chrome: 113.
  • Edge: 113.
  • Firefox: 112.
  • Safari: 17.2.

सीएसएस नेस्टिंग

Chrome 112 में सीएसएस नेस्टिंग की सुविधा जोड़ी गई है. यह ऐसी सुविधा है जिसका कई डेवलपर बेसब्री से इंतज़ार कर रहे थे. इसमें एक नया नेस्टिंग सिलेक्टर > जोड़ा गया है. इसका इस्तेमाल, मिलते-जुलते स्टाइल नियमों को नेस्ट करने के लिए किया जाता है. यह तरीका, उन डेवलपर के लिए जाना-पहचाना होगा जिन्होंने पहले प्री-प्रोसेसर का इस्तेमाल किया है:

.nesting {
  color: hotpink;

  > .is {
    color: rebeccapurple;

    > .awesome {
      color: deeppink;
    }
  }
}

ब्राउज़र के इस्तेमाल से जुड़ी सहायता

  • Chrome: 120.
  • Edge: 120.
  • Firefox: 117.
  • Safari: 17.2.

सोर्स

सीएसएस animation-composition

Chrome 112 में animation-composition के लिए भी सहायता शामिल है. बताएं कि ऐनिमेशन-कंपोज़िशन के साथ कई ऐनिमेशन इफ़ेक्ट कैसे कंपोज़ होने चाहिए में जानें कि यह प्रॉपर्टी कैसे काम करती है.

ब्राउज़र के इस्तेमाल से जुड़ी सहायता

  • Chrome: 112.
  • किनारा: 112.
  • Firefox: 115.
  • Safari: 16.

सोर्स

बिना ग्राफ़िक यूज़र इंटरफ़ेस वाला नया मोड

अगर Puppeteer के साथ Chrome के हेडलेस मोड का इस्तेमाल किया जाता है, तो 112 में एक नया हेडलेस मोड उपलब्ध होगा. इस बारे में Chrome के हेडलेस मोड को अपग्रेड किया गया लेख में जानें.

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

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

Firefox 113 में color(), lab(), lch(), oklab(), और oklch() फ़ंक्शन शामिल हैं. इसमें सीएसएस कलर 5 का color-mix() फ़ंक्शन और forced-color-adjust प्रॉपर्टी भी शामिल है.

Firefox में nth-child of <selector> सिंटैक्स भी शामिल है. इससे आपको यह कंट्रोल करने में मदद मिलती है कि आपको कौनसे एलिमेंट चुनने हैं. S सिंटैक्स की मदद से, :nth-child() से चुने गए एलिमेंट पर ज़्यादा कंट्रोल लेख में ज़्यादा जानें.

सीएसएस के लिए, Chrome 113 में overflow-inline, overflow-block, और update मीडिया फ़ीचर शामिल हैं. यह linear() ईज़िंग फ़ंक्शन और बिना प्रीफ़िक्स वाले image-set() टाइप में भी शामिल है.

Chrome 113 में WebGPU भी शामिल है. यह वेब के लिए, WebGL और WebGL 2 ग्राफ़िक्स एपीआई का नया वर्शन है. इसमें जीपीयू कंप्यूट, जीपीयू हार्डवेयर के लिए कम ओवरहेड ऐक्सेस, एक ही ग्राफ़िक्स डिवाइस से कई कैनवस को रेंडर करने की सुविधा, और बेहतर और अनुमानित परफ़ॉर्मेंस जैसी आधुनिक सुविधाएं मिलती हैं.

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