Chrome 137 में नया क्या है

Rachel Andrew

पब्लिश होने की तारीख: 27 मई, 2025

Chrome 137 का वर्शन अब रोल आउट किया जा रहा है. इस पोस्ट में, इस रिलीज़ की कुछ मुख्य सुविधाओं के बारे में बताया गया है. Chrome 137 के रिलीज़ नोट पढ़ें.

इस रिलीज़ की हाइलाइट:

जटिल लेआउट में टैब का क्रम लॉजिकल हो, यह पक्का करने के लिए reading-flow और reading-order का इस्तेमाल करें. CSS if() फ़ंक्शन, शर्त के साथ वैल्यू दिखाने का एक आसान तरीका उपलब्ध कराता है. JavaScript Promise Integration (JSPI) की मदद से, WebAssembly ऐप्लिकेशन को JavaScript Promises के साथ इंटिग्रेट किया जा सकता है.

सीएसएस reading-flow और reading-order

reading-flow सीएसएस प्रॉपर्टी, यह तय करती है कि फ़्लेक्स, ग्रिड या ब्लॉक लेआउट में मौजूद एलिमेंट, सुलभता टूल के लिए किस क्रम में दिखें. साथ ही, यह भी तय करती है कि लीनियर क्रम वाले नेविगेशन के तरीकों का इस्तेमाल करके, उन पर फ़ोकस कैसे किया जाए. इससे ग्रिड और फ़्लेक्स लेआउट से जुड़ी एक पुरानी समस्या हल हो जाती है. इस समस्या में, टैब का क्रम, आइटम के लेआउट के क्रम से अलग हो सकता है.

इसमें एक कीवर्ड वैल्यू होती है, जिसकी डिफ़ॉल्ट वैल्यू normal होती है. इससे, एलिमेंट को डीओएम के क्रम में व्यवस्थित करने की सुविधा काम करती रहती है. इसे फ़्लेक्स कंटेनर में इस्तेमाल करने के लिए, इसकी वैल्यू को flex-visual या flex-flow पर सेट करें. ग्रिड कंटेनर में इसका इस्तेमाल करने के लिए, इसकी वैल्यू को grid-rows, grid-columns या grid-order पर सेट करें.

reading-order सीएसएस प्रॉपर्टी की मदद से, रीडिंग फ़्लो कंटेनर में मौजूद आइटम के क्रम को मैन्युअल तरीके से बदला जा सकता है. ग्रिड, फ़्लेक्स या ब्लॉक कंटेनर में इस प्रॉपर्टी का इस्तेमाल करने के लिए, कंटेनर पर reading-flow वैल्यू को source-order पर सेट करें और अलग-अलग आइटम की reading-order वैल्यू को पूर्णांक पर सेट करें.

ज़्यादा जानने के लिए, लॉजिकल क्रम में फ़ोकस नेविगेशन के लिए सीएसएस reading-flow का इस्तेमाल करना लेख पढ़ें.

सीएसएस if() फ़ंक्शन

CSS if() फ़ंक्शन, शर्त के साथ वैल्यू दिखाने का एक आसान तरीका उपलब्ध कराता है. यह, सेमीकोलन से अलग की गई शर्त-वैल्यू के पेयर की सीरीज़ स्वीकार करता है. यह फ़ंक्शन, हर शर्त का क्रम से आकलन करता है और पहली सही शर्त से जुड़ी वैल्यू दिखाता है. अगर कोई भी शर्त सही नहीं होती है, तो फ़ंक्शन एक खाली टोकन स्ट्रीम दिखाता है.

div {
  color: var(--color);
  background-color: if(style(--color: white): black; else: white);
}

.dark {
  --color: black;
}

.light {
  --color: white;
}

<div class="dark">dark</div>
<div class="light">light</div>

WebAssembly JavaScript Promise Integration (JSPI)

JavaScript Promise Integration (JSPI) एक एपीआई है. इसकी मदद से, WebAssembly ऐप्लिकेशन को JavaScript के प्रॉमिस के साथ इंटिग्रेट किया जा सकता है.

इससे WebAssembly प्रोग्राम, प्रॉमिस जनरेटर के तौर पर काम कर सकता है. साथ ही, इससे WebAssembly प्रोग्राम, प्रॉमिस देने वाले एपीआई के साथ इंटरैक्ट कर सकता है.

खास तौर पर, जब कोई ऐप्लिकेशन, वादा करने वाले (JavaScript) एपीआई को कॉल करने के लिए JSPI का इस्तेमाल करता है, तो WebAssembly कोड को निलंबित कर दिया जाता है. साथ ही, WebAssembly प्रोग्राम को कॉल करने वाले मूल व्यक्ति को एक वादा दिया जाता है. यह वादा तब पूरा किया जाएगा, जब WebAssembly प्रोग्राम पूरा हो जाएगा.

और भी कई सुविधाएं!

इसके अलावा, और भी बहुत कुछ है:

  • स्टोरेज का बंटवारा करने की सुविधा के तहत, Chrome ने स्टोरेज पासकोड के हिसाब से, ब्लॉब यूआरएल के ऐक्सेस को अलग-अलग हिस्सों में बांटने की सुविधा लागू की है.
  • कैनवस फ़्लोटिंग पॉइंट पिक्सल फ़ॉर्मैट अब लागू हो गए हैं.
  • offset-path: shape() का इस्तेमाल किया जा सकता है, ताकि एनिमेशन पाथ सेट करने के लिए रिस्पॉन्सिव आकार का इस्तेमाल किया जा सके.

इसके बारे में और पढ़ें

इसमें सिर्फ़ कुछ खास हाइलाइट शामिल हैं. Chrome 137 में किए गए अन्य बदलावों के बारे में जानने के लिए, यहां दिए गए लिंक देखें.

सदस्यता लें

अप-टू-डेट रहने के लिए, Chrome डेवलपर के YouTube चैनल की सदस्यता लें. इससे, जब भी हम कोई नया वीडियो लॉन्च करेंगे, आपको ईमेल से सूचना मिलेगी. इसके अलावा, नए लेख और ब्लॉग पोस्ट के लिए, हमें X या LinkedIn पर फ़ॉलो करें.

Chrome 138 रिलीज़ होने के बाद, हम आपको बताएंगे कि Chrome में नया क्या है!