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

Rachel Andrew

पब्लिश होने की तारीख: 28 जुलाई, 2026

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

इस रिलीज़ की खास बातें:

कैपेबिलिटी एलिमेंट: <usermedia> एमवीपी

<usermedia> एलिमेंट, कैपेबिलिटी एलिमेंट सुइट में लॉन्च होने वाला नया एलिमेंट है. इससे पहले, <geolocation> एलिमेंट लॉन्च किया गया था. पीईपीसी पहल के तहत, <permission> के ओरिजनल प्रपोज़ल से इस बदलाव की वजह से, ब्राउज़र अलग-अलग हार्डवेयर कैपेबिलिटी की जटिलताओं और व्यवहारों को ज़्यादा असरदार तरीके से मैनेज कर सकता है. शुरुआती प्रपोज़ल में, अनुमति की स्थितियों को मैनेज करने पर फ़ोकस किया गया था. जैसे, अनुमति देना या अस्वीकार करना. वहीं, कैपेबिलिटी एलिमेंट, डेटा मीडिएटर के तौर पर काम करते हैं.

<geolocation> एलिमेंट, आपकी साइट को जगह की जानकारी वाला ऑब्जेक्ट उपलब्ध कराता है. वहीं, <usermedia>, कैमरे और माइक्रोफ़ोन के ऐक्सेस के लिए पूरे फ़्लो को मैनेज करता है. यह उपयोगकर्ता के इरादे को कैप्चर करता है, ब्राउज़र के प्रॉम्प्ट को मैनेज करता है, और ऐप्लिकेशन को MediaStream ऑब्जेक्ट उपलब्ध कराता है. इस बदलाव से, getUserMedia() कॉल की ज़रूरत नहीं होती. साथ ही, इसे लागू करना आसान हो जाता है. इसके अलावा, यह पक्का किया जाता है कि ब्राउज़र के पास उपयोगकर्ता के इरादे का भरोसेमंद सिग्नल हो.

एचटीएमएल एलिमेंट के बारे में ज़्यादा जानने के लिए, <usermedia> एचटीएमएल एलिमेंट के बारे में जानकारी देखें.

डिक्लेरेटिव शैडो DOM: shadowrootslotassignment एट्रिब्यूट

Chrome 151 में, shadowrootslotassignment एट्रिब्यूट के लिए <template> एलिमेंट पर सहायता जोड़ी गई है. इससे, डिक्लेरेटिव शैडो रूट बनाए जा सकते हैं. इनमें, सीधे आपके एचटीएमएल में मैन्युअल स्लॉट असाइनमेंट का इस्तेमाल किया जाता है.

अब तक, मैन्युअल स्लॉट असाइनमेंट सिर्फ़ ज़रूरी तौर पर उपलब्ध था. इस अपडेट के बाद, शैडो रूट टेंप्लेट पर shadowrootslotassignment="manual" तय किया जा सकता है

यह एट्रिब्यूट, named (डिफ़ॉल्ट व्यवहार) और manual को स्वीकार करता है. साथ ही, यह HTMLTemplateElement पर shadowRootSlotAssignment प्रॉपर्टी से दिखता है. ज़्यादा जानकारी के लिए, MDN पर HTMLTemplateElement.shadowRootSlotAssignment से जुड़ा दस्तावेज़ देखें.

यह एट्रिब्यूट, Firefox और Safari 27 के बीटा वर्शन में पहले से उपलब्ध है. इसलिए, यह जल्द ही Baseline Newly available में शामिल हो जाएगा.

सॉफ़्ट नेविगेशन और इंटरैक्शन परफ़ॉर्मेंस मेट्रिक

Chrome 151 में, वेब परफ़ॉर्मेंस टाइमलाइन को बढ़ाया गया है. इसके लिए, PerformanceEntry की दो नई टाइप जोड़ी गई हैं: soft-navigation और interaction-contentful-paint. इन एंट्री की मदद से, डेवलपर एक पेज वाले ऐप्लिकेशन (एसपीए) में इंटरैक्शन की वजह से होने वाली परफ़ॉर्मेंस और इंतज़ार के समय को ट्रैक कर सकते हैं. इसके लिए, Core Web Vitals की स्थापित मेट्रिक का इस्तेमाल किया जाता है. जैसे, सबसे बड़े एलिमेंट को रेंडर करने में लगने वाला समय (एलसीपी) और पेज के रिस्पॉन्स में लगने वाला समय (आईएनपी).

एसपीए में, JavaScript की मदद से रूट ट्रांज़िशन, ब्राउज़र के पेज लोड होने की पारंपरिक प्रोसेस को ट्रिगर नहीं करते. soft-navigation एंट्री, उपयोगकर्ता के इंटरैक्शन से शुरू होने वाले, एक ही दस्तावेज़ में इतिहास की स्थिति में होने वाले इन बदलावों को कैप्चर करती है. सॉफ़्ट नेविगेशन होने पर, ब्राउज़र एक नया टाइम ओरिजन बनाता है. इससे, शुरुआती दस्तावेज़ के यूआरएल के बजाय, ऐक्टिव एसपीए रूट के लिए, परफ़ॉर्मेंस डेटा सटीक तौर पर एट्रिब्यूट किया जा सकता है.

interaction-contentful-paint एंट्री, उपयोगकर्ता के इंटरैक्शन से बदले गए DOM क्षेत्रों में, नए कॉन्टेंटफ़ुल पेंट को मेज़र करती है. इससे, इंटरैक्शन लोड होने में लगने वाली लेटेन्सी के बारे में पता चलता है. भले ही, कॉन्टेंट के अपडेट, fetch() अनुरोधों जैसे एसिंक्रोनस ऑपरेशन पर निर्भर हों.

PerformanceObserver का इस्तेमाल करके, अपने ऐप्लिकेशन में इन नई एंट्री को देखा जा सकता है. यहां दिया गया कोड स्निपेट, कंसोल में सॉफ़्ट नेविगेशन एंट्री लॉग करता है. इसमें, बफ़र किए गए विकल्प का इस्तेमाल करके, इस पेज पर पहले हुए सॉफ़्ट नेविगेशन भी शामिल हैं:

const observer = new PerformanceObserver(console.log);
observer.observe({ type: "soft-navigation", buffered: true });

एसपीए नेविगेशन को लागू करने और मेज़र करने के बारे में ज़्यादा जानने के लिए, Chrome for Developers पर सॉफ़्ट नेविगेशन से जुड़ा दस्तावेज़ पढ़ें.

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

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

सदस्यता लें

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

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