जून में वेब प्लैटफ़ॉर्म पर नई सुविधाएं जोड़ी गई हैं

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

जून 2024 में, Firefox 127 और Chrome 126 के स्टेबल वर्शन रिलीज़ हो गए. इस पोस्ट में, वेब प्लैटफ़ॉर्म में जोड़ी गई नई सुविधाओं के बारे में बताया गया है.

JavaScript के सेट करने के तरीके

सेट, किसी भी प्रोग्रामिंग भाषा में डेटा का एक ज़रूरी स्ट्रक्चर होता है. अब सेट ऑपरेशन करने के लिए, JavaScript के पहले से मौजूद तरीकों का इस्तेमाल किया जा सकता है. सेट करने के ये तरीके, अब Firefox 127 से उपलब्ध हैं. साथ ही, ये बेसलाइन के तौर पर उपलब्ध हैं:

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

  • Chrome: 122.
  • Edge: 122.
  • Firefox: 127.
  • Safari: 17.

सोर्स

ज़्यादा जानने के लिए, JavaScript सेट करने के तरीके अब बेसलाइन का हिस्सा हैं लेख पढ़ें.

Async Clipboard API

क्लिपबोर्ड एपीआई अब Firefox 127 के साथ पूरी तरह से काम करता है. Firefox अब क्लिपबोर्ड इंटरफ़ेस के read() और write() तरीकों के साथ-साथ, ClipboardItem इंटरफ़ेस के साथ काम करता है. क्लिपबोर्ड का ऐक्सेस अनब्लॉक करना लेख में, क्लिपबोर्ड एपीआई के बारे में ज़्यादा जानें.

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

  • Chrome: 76.
  • Edge: 79.
  • Firefox: 127.
  • Safari: 13.1.

सोर्स

सीएसएस ग्रेडिएंट में कलर इंटरपोलेशन

सीएसएस ग्रेडिएंट में <color-interpolation-method> को स्वीकार करने के लिए तय किया गया है. अब यह Firefox में काम करता है. इससे यह सभी मुख्य इंजन के साथ काम कर सकता है. उदाहरण के लिए, अब hsl कलर सिस्टम और लंबे इंटरपोलेशन का इस्तेमाल करके, linear-gradient() तय किया जा सकता है.

.longer {
  background: linear-gradient(90deg in hsl longer hue, red, blue);
}

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

  • Chrome: 111.
  • Edge: 111.
  • Firefox: 127.
  • Safari: 16.2.

एक दस्तावेज़ से दूसरे दस्तावेज़ में व्यू ट्रांज़िशन

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

एक दस्तावेज़ से दूसरे दस्तावेज़ पर व्यू ट्रांज़िशन करने की सुविधा चालू करने के लिए, दोनों दस्तावेज़ों के लिए ऑप्ट-इन करना ज़रूरी है. ऐसा करने के लिए, @view-transition at-rule का इस्तेमाल करें और नेविगेशन डिस्क्रिप्टर को auto पर सेट करें.

@view-transition {
  navigation: auto;
}

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

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

एक से दूसरे दस्तावेज़ के व्यू में ट्रांज़िशन के दस्तावेज़ में ज़्यादा जानें.

Gamepad API trigger-rumble एक्सटेंशन

Chrome 126 में GamepadHapticActuator इंटरफ़ेस को बेहतर बनाया गया है, ताकि वेब पर काम करने वाले गेमपैड के लिए trigger-rumble की सुविधा का इस्तेमाल किया जा सके. इस एक्सटेंशन की मदद से, वेब ऐप्लिकेशन इस सुविधा वाले गेमपैड डिवाइसों के ट्रिगर को भी वाइब्रेट कर पाएंगे.

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

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

Safari 17.6 में, मौजूदा सुविधाओं से जुड़ी गड़बड़ियों को ठीक किया गया है. Safari 18 में कई नई सुविधाएं हैं. इनमें स्टाइल कंटेनर क्वेरी, एक पेज वाले ऐप्लिकेशन के लिए व्यू ट्रांज़िशन एपीआई, और फ़्लेक्सबॉक्स प्रॉपर्टी में safe कीवर्ड के लिए सहायता शामिल है.

Chrome 127 में font-size-adjust सीएसएस प्रॉपर्टी शामिल है. साथ ही, जनरेट किए गए कॉन्टेंट पर, अपनी पसंद के मुताबिक किसी भी संख्या में एलिमेंट के तौर पर वैकल्पिक टेक्स्ट तय करने की सुविधा भी है. इसके अलावा, MediaMetaData में किसी चैप्टर की जानकारी जोड़ने की सुविधा भी है.

Firefox 128 में सीएसएस प्रॉपर्टी और वैल्यू शामिल हैं. इस वजह से, यह सुविधा अब बेसलाइन के तौर पर उपलब्ध है. type तय करने के लिए @property का इस्तेमाल करें और सीएसएस कस्टम प्रॉपर्टी के लिए फ़ॉलबैक वैल्यू सेट करें.