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

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

Rachel Andrew

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

मई में, Chrome 102, Safari 15.5, Firefox 100, और Firefox 101 के स्टेबल वर्शन रिलीज़ किए गए.

Chrome 102 और Safari 15.5 में inert एट्रिब्यूट शामिल है. ऐसा करने पर, टैब ऑर्डर और सुलभता ट्री से ऐसे एलिमेंट हट जाते हैं जो इंटरैक्टिव नहीं होते. उदाहरण के लिए, कोई ऐसा एलिमेंट जो फ़िलहाल ऑफ़स्क्रीन या छिपा हुआ है.

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

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

सोर्स

Chrome 102 में, HTML hidden एट्रिब्यूट के लिए नई वैल्यू until-found शामिल है. इससे, पेज पर मौजूद टेक्स्ट को ढूंढने की सुविधा चालू होती है. साथ ही, पेज के उस हिस्से में मौजूद टेक्स्ट पर स्क्रोल करने की सुविधा भी चालू होती है जो छोटा किया गया है. जैसे, आपको अकॉर्डियन पैटर्न में मिल सकता है. ज़्यादा जानकारी के लिए, hidden=until-found का इस्तेमाल करके, छोटा किया गया कॉन्टेंट ऐक्सेस करना पोस्ट पढ़ें.

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

  • Chrome: 102.
  • Edge: 102.
  • Firefox: यह सुविधा काम नहीं करती.
  • Safari: यह सुविधा काम नहीं करती.

सोर्स

Chrome 102 में Navigation API शामिल है. यह एक ऐसा एपीआई है जो सिंगल-पेज ऐप्लिकेशन में क्लाइंट-साइड रूटिंग को स्टैंडर्ड बनाता है. इस एपीआई को पहले ऐप्लिकेशन इतिहास एपीआई कहा जाता था.

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

  • Chrome: 102.
  • Edge: 102.
  • Firefox: यह सुविधा काम नहीं करती.
  • Safari: यह सुविधा काम नहीं करती.

सोर्स

Firefox 101 में कन्स्ट्रक्ट की जा सकने वाली स्टाइलशीट काम करती हैं. इसमें CSSStyleSheet() कन्स्ट्रक्टर और replace() और replaceSync() तरीके शामिल हैं. कॉन्स्ट्रक्ट की जा सकने वाली स्टाइलशीट की मदद से, शैडो DOM के साथ इस्तेमाल करने के लिए स्टाइलशीट बनाना आसान हो जाता है. नीचे दिए गए उदाहरण में, CSSStyleSheet() कन्स्ट्रक्टर का इस्तेमाल करके एक स्टाइलशीट बनाई गई है. साथ ही, replaceSync() तरीके से एक सीएसएस नियम जोड़ा गया है और नतीजे के तौर पर मिला नियम, कंसोल पर प्रिंट किया गया है.

const stylesheet = new CSSStyleSheet();
stylesheet.replaceSync('body { color: red; }');
console.log(stylesheet.rules[0].cssText);

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

  • Chrome: 73.
  • Edge: 79.
  • Firefox: 101.
  • Safari: 16.4.

सोर्स

Firefox 101 में prefers-contrast मीडिया की सुविधा भी है. इसकी मदद से, यह सुविधा सभी ब्राउज़र पर उपलब्ध हो जाती है.

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

  • Chrome: 96.
  • Edge: 96.
  • Firefox: 101.
  • Safari: 14.1.

सोर्स

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

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

अप्रैल में, Chrome 103 और Firefox 102 के नए बीटा वर्शन रिलीज़ किए गए थे.

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

none
रेंडर होने के बाद, कॉन्टेंट को अपडेट नहीं किया जा सकता. उदाहरण के लिए, प्रिंट किया गया दस्तावेज़.
slow
डिवाइस पर कॉन्टेंट अपडेट हो सकता है, लेकिन स्मूद ऐनिमेशन दिखाने के लिए बहुत धीरे. उदाहरण के लिए, ई-इंक स्क्रीन.
fast
ऐनिमेशन रेंडर करने के लिए, कॉन्टेंट डाइनैमिक तरीके से और तेज़ी से बदल सकता है. उदाहरण के लिए, कंप्यूटर या फ़ोन की स्क्रीन.

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

  • Chrome: 113.
  • Edge: 113.
  • Firefox: 102.
  • Safari: 17.

सोर्स

Chrome 103 में Local Font Access API शामिल है. इससे, उपयोगकर्ता के डिवाइस पर इंस्टॉल किए गए फ़ॉन्ट को ऐक्सेस किया जा सकता है.

ये बीटा सुविधाएं, जल्द ही स्टेबल ब्राउज़र में उपलब्ध होंगी.

बदलाव: इस पोस्ट के पिछले वर्शन में, Element.isVisible() तरीके के बारे में बताया गया था. हालांकि, इस रिलीज़ में यह तरीका उपलब्ध नहीं है.

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