अगर कुछ और नहीं बताया गया है, तो यहां बताए गए बदलाव, Android, ChromeOS, Linux, macOS, और Windows के लिए, Chrome के बीटा चैनल की नई रिलीज़ पर लागू होंगे. यहां दी गई सुविधाओं के बारे में ज़्यादा जानने के लिए, दिए गए लिंक पर जाएं या ChromeStatus.com पर दी गई सूची देखें. Chrome 123, 21 फ़रवरी, 2024 तक बीटा वर्शन में उपलब्ध है. डेस्कटॉप के लिए Google.com पर या Android पर Google Play Store से, सबसे नया वर्शन डाउनलोड किया जा सकता है.
सीएसएस
इस रिलीज़ में, सीएसएस की पांच नई सुविधाएं जोड़ी गई हैं.
सीएसएस light-dark() कलर फ़ंक्शन
सीएसएस में light-dark() फ़ंक्शन की मदद से, डेवलपर आसानी से रंग-योजना को उपयोगकर्ता की प्राथमिकता के हिसाब से, लाइट या डार्क मोड में बदल सकते हैं.
किसी एक सीएसएस प्रॉपर्टी में दो अलग-अलग कलर वैल्यू तय करने के लिए, light-dark() का इस्तेमाल करें. एलिमेंट की कैलकुलेट की गई color-scheme वैल्यू के आधार पर, ब्राउज़र (या डिवाइस) अपने-आप सही रंग चुन लेगा. उदाहरण के लिए, इस सीएसएस के साथ:
- अगर उपयोगकर्ता ने हल्की थीम चुनी है, तो
.targetएलिमेंट का बैकग्राउंड लाइम रंग का होगा. - अगर उपयोगकर्ता ने डार्क थीम चुनी है, तो
.targetएलिमेंट का बैकग्राउंड हरा होगा.
html {
color-scheme: light dark;
}
.target {
background-color: light-dark(lime, green);
}
सीएसएस पिक्चर में पिक्चर डिसप्ले मोड
picture-in-picture वैल्यू के लिए, सीएसएस display-mode मीडिया फ़ीचर के साथ काम करता है. इससे वेब डेवलपर, सीएसएस के ऐसे खास नियम लिख सकते हैं जो सिर्फ़ तब लागू होते हैं, जब वेब ऐप्लिकेशन का कुछ हिस्सा पिक्चर में पिक्चर मोड में दिखाया जाता है.
मीडिया की इस सुविधा के बारे में ज़्यादा जानने के लिए, पिक्चर में पिक्चर की सुविधा के दस्तावेज़ देखें.
ब्लॉक के लिए align-content सीएसएस प्रॉपर्टी
align-content सीएसएस प्रॉपर्टी अब ब्लॉक कंटेनर और टेबल सेल पर काम करती है. पहले, यह प्रॉपर्टी सिर्फ़ ग्रिड और फ़्लेक्स आइटम के साथ काम करती थी. उदाहरण के लिए, display: block, display: list-item, और display: table-cell को अब align-content का इस्तेमाल करके अलाइन किया जा सकता है.
ज़्यादा जानने के लिए, ब्लॉक और टेबल लेआउट में align-content के लिए सहायता लेख पढ़ें.
field-sizing सीएसएस प्रॉपर्टी
field-sizing प्रॉपर्टी का इस्तेमाल करके, डेवलपर फ़ॉर्म कंट्रोल के डिफ़ॉल्ट साइज़ को बंद कर सकते हैं. साथ ही, उनके साइज़ को कॉन्टेंट के हिसाब से तय कर सकते हैं. इससे, अपने-आप बड़े होने वाले टेक्स्ट फ़ील्ड बनाने का तरीका मिलता है.
सीएसएस text-spacing-trim प्रॉपर्टी
यह प्रॉपर्टी, चाइनीज़, जैपनीज़, और कोरियन (CJK) विराम चिह्न वाले वर्णों पर कर्निंग लागू करती है. इससे, विज़ुअल तौर पर बेहतर टाइपोग्राफ़ी बनती है. इस प्रॉपर्टी के लिए, JLREQ (जापानी टेक्स्ट लेआउट की ज़रूरी शर्तें) और CLREQ (चाइनीज़ टेक्स्ट लेआउट की ज़रूरी शर्तें) का पालन किया जाता है.
सीजेके प्यूंक्चुएशन कैरेक्टर में, ग्लिफ़ के बीच में स्पेस होता है. उदाहरण के लिए, CJK फ़ुल स्टॉप और CJK क्लोज़ पैरेन्थिसिस के ग्लिफ़ स्पेस के दाएं आधे हिस्से में, आम तौर पर ग्लिफ़ के बीच में स्पेस होता है. ऐसा इसलिए किया जाता है, ताकि इन्हें अन्य आइडियोग्राफ़िक वर्णों के तौर पर लगातार आगे बढ़ाया जा सके. हालांकि, जब ये एक पंक्ति में दिखते हैं, तो ग्लिफ़ के बीच की जगह बहुत ज़्यादा हो जाती है. यह सुविधा, ज़रूरत से ज़्यादा स्पेस को अडजस्ट करती है.
text-spacing-trim प्रॉपर्टी में इनमें से कोई एक वैल्यू दी जा सकती है:
normal, trim-start, space-all, और space-first.
ज़्यादा जानने के लिए, पेश हैं सीएसएस में अंतरराष्ट्रीय स्तर पर उपलब्ध चार नई सुविधाएं लेख पढ़ें.
वेब एपीआई
क्रॉस-ऑरिजिन iframe में WebAuthn क्रेडेंशियल बनाने की अनुमति देना
इस सुविधा की मदद से, वेब डेवलपर क्रॉस-ऑरिजिन iframes में WebAuthn क्रेडेंशियल (यानी, "publickey" क्रेडेंशियल, जिन्हें पासकी कहा जाता है) बना सकते हैं. इस नई सुविधा के लिए, दो शर्तें ज़रूरी हैं:
- iframe में
publickey-credentials-create-featureअनुमति नीति है. - iframe में उपयोगकर्ता ऐक्टिवेशन की अवधि कम होती है.
इससे डेवलपर, एम्बेड की गई स्थितियों में पासकी बना पाएंगे. जैसे, पहचान की पुष्टि करने के लिए ज़्यादा जानकारी देने के बाद, जब भरोसेमंद पक्ष, फ़ेडरेटेड पहचान की सुविधा दे रहा हो.
एट्रिब्यूशन रिपोर्टिंग की सुविधाओं का बंडल
Chrome 123, एट्रिब्यूशन रिपोर्टिंग एपीआई में ट्रिगर डेटा को पसंद के मुताबिक बनाने और एग्रीगेट की जा सकने वाली वैल्यू फ़िल्टर जोड़ता है. ये फ़िल्टर इन पर फ़ोकस करते हैं:
- इवेंट-लेवल की रिपोर्टिंग के लिए, एपीआई को ज़्यादा कॉन्फ़िगर किया जा सकता है. इसके लिए, ट्रिगर डेटा की एलिमेंट की संख्या और वैल्यू को पसंद के मुताबिक बनाया जा सकता है.
- एग्रीगेट की जा सकने वाली वैल्यू में फ़िल्टर की सुविधा जोड़कर, खास जानकारी वाली रिपोर्ट के लिए एपीआई को ज़्यादा कॉन्फ़िगर किया जा सकता है.
अलग-अलग ऐप्लिकेशन और वेब के लिए एट्रिब्यूशन मेज़रमेंट
एट्रिब्यूशन रिपोर्टिंग एपीआई को बढ़ाता है, ताकि वेब पर होने वाले कन्वर्ज़न को, ब्राउज़र के बाहर होने वाले इवेंट के लिए एट्रिब्यूट किया जा सके.
यहां दिए गए प्रस्ताव में, एट्रिब्यूशन के लिए ओएस-लेवल की सहायता का फ़ायदा लिया जाता है. खास तौर पर, इससे डेवलपर को मोबाइल वेब पर मौजूद इवेंट को Android के प्राइवसी सैंडबॉक्स में मौजूद इवेंट से जोड़ने की अनुमति मिलती है. हालांकि, अन्य प्लैटफ़ॉर्म के लिए भी यह सुविधा लागू की जा सकती है.
blocking=render इनलाइन मॉड्यूल स्क्रिप्ट पर
यह एक छोटा सा बदलाव है, जिससे <script blocking="render"> से जुड़ी एक कृत्रिम पाबंदी हट जाएगी.
इस बदलाव से पहले, <script blocking="render"type="module"> के लिए src एट्रिब्यूट की ज़रूरत होती थी. भले ही, यह src डेटा यूआरआई हो.
यह एक ग़ैर-ज़रूरी शर्त है, क्योंकि अन्य स्क्रिप्ट को इंपोर्ट करने वाली इनलाइन मॉड्यूल स्क्रिप्ट अब भी रेंडर-ब्लॉक कर सकती हैं.
इसकी वजह यह है कि क्रॉस-दस्तावेज़ व्यू ट्रांज़िशन, अक्सर पसंद के मुताबिक बनाने के लिए रेंडर ब्लॉक करने वाली स्क्रिप्ट पर निर्भर करते हैं. इसलिए, रेंडर ब्लॉक करने वाली स्क्रिप्ट को लिखना आसान बनाने से, इस सुविधा का इस्तेमाल किया जा सकेगा.
दस्तावेज़ में पिक्चर में पिक्चर की सुविधा: focus() एपीआई को ओपनर पर फ़ोकस करने की अनुमति दें
अब दस्तावेज़ की पिक्चर में पिक्चर विंडो से, opener.focus() का इस्तेमाल करके, उस टैब पर सिस्टम-लेवल फ़ोकस लाया जा सकता है जिस पर दस्तावेज़ की पिक्चर में पिक्चर विंडो मौजूद है.
इससे डेवलपर, ज़रूरत पड़ने पर ओरिजनल टैब को फिर से फ़ोरग्राउंड पर ला सकते हैं. उदाहरण के लिए, जब उपयोगकर्ता को किसी ऐसे यूज़र इंटरफ़ेस (यूआई) को ऐक्सेस करना हो जो स्क्रीन पर छोटी पिक्चर में पिक्चर विंडो में फ़िट न होता हो.
इंपोर्ट एट्रिब्यूट with सिंटैक्स
इंपोर्ट एट्रिब्यूट, JavaScript की एक सुविधा है. इसकी मदद से, इंपोर्ट एलानेशन पर एनोटेट किया जा सकता है. जैसे, import xxx from "mod" with { type: "json" }. Chrome ने शुरू में, Chrome 91 में, assert को कीवर्ड के तौर पर इस्तेमाल करके, प्रस्ताव का पिछला वर्शन शिप किया था. इसके बाद, इस वर्शन को with का इस्तेमाल करने के लिए अपडेट किया गया है. ऐसा इसलिए किया गया है, क्योंकि इसे JSON और सीएसएस मॉड्यूल के लिए एचटीएमएल के साथ इंटिग्रेट करते समय कुछ बदलाव करने की ज़रूरत थी.
jitterBufferTarget
jitterBufferTarget एट्रिब्यूट की मदद से, ऐप्लिकेशन यह तय कर सकते हैं कि RTCRtpReceiver जटर बफ़र में मीडिया को कितने मिलीसेकंड तक सेव रखा जाए. इससे, उपयोगकर्ता एजेंट के बफ़र करने की अवधि पर असर पड़ता है. टारगेट वैल्यू में बदलाव करने से, ऐप्लिकेशन को प्लेआउट में लगने वाले समय और नेटवर्क के झटके की वजह से ऑडियो या वीडियो फ़्रेम खत्म होने के जोखिम के बीच के समझौते को कंट्रोल करने में मदद मिलती है.
लंबे ऐनिमेशन फ़्रेम की टाइमिंग
Long Animation Frames API, Long Tasks API का एक वर्शन है. यह टास्क को रेंडर करने के बाद के अपडेट के साथ मेज़र करता है. साथ ही, इसमें लंबे समय तक चलने वाली स्क्रिप्ट, रेंडर करने में लगने वाला समय, और ज़बरदस्ती लागू किए गए लेआउट और स्टाइल में बिताया गया समय जैसी जानकारी जोड़ता है. इसे लेआउट थ्रैशिंग कहा जाता है.
डेवलपर इसका इस्तेमाल, "धीमी गति" के डाइग्नोस्टिक्स के तौर पर कर सकते हैं. इसे INP से मेज़र किया जाता है. इसके लिए, मुख्य थ्रेड के भीड़भाड़ की वजहों का पता लगाया जाता है. आम तौर पर, खराब INP की वजह भी यही होती है.
NavigationActivation
NavigationActivation इंटरफ़ेस, navigation.activation जोड़ता है. इसमें यह जानकारी सेव की जाती है कि मौजूदा दस्तावेज़ कब चालू किया गया था. उदाहरण के लिए, इसे कब शुरू किया गया था या बैक/फ़ॉरवर्ड कैश मेमोरी से कब वापस लाया गया था.
इसका मतलब है कि डेवलपर, उपयोगकर्ता के नेविगेट करने के तरीके के आधार पर, पसंद के मुताबिक पेज दिखा सकते हैं. उदाहरण के लिए, अगर उपयोगकर्ता होम पेज से आए हैं, तो कोई दूसरा ऐनिमेशन चलाएं.
pagereveal इवेंट
pagereveal इवेंट, दस्तावेज़ के विंडो ऑब्जेक्ट पर तब ट्रिगर होता है, जब दस्तावेज़ को पहली बार रेंडर करने का मौका मिलता है. ऐसा तब होता है, जब दस्तावेज़: शुरू में लोड किया जाता है, बैक-फ़ॉरवर्ड कैश मेमोरी से वापस लाया जाता है या पहले से रेंडर किए गए दस्तावेज़ से चालू किया जाता है.
पेज के लेखक इसका इस्तेमाल, पेज पर आने का अनुभव सेट अप करने के लिए कर सकते हैं. जैसे, किसी पिछली स्थिति से व्यू ट्रांज़िशन.
एक से ज़्यादा पेन से इनकिंग करने के लिए PointerEvent.deviceId
पेन इनपुट की बेहतर सुविधाओं वाले डिवाइसों का इस्तेमाल बढ़ता जा रहा है. इसलिए, यह ज़रूरी है कि वेब प्लैटफ़ॉर्म इन बेहतर सुविधाओं के साथ काम करता रहे, ताकि उपयोगकर्ताओं और डेवलपर, दोनों को बेहतर अनुभव मिल सके. इनमें से एक, डिवाइस के डिजिटाइज़र की क्षमता है, जो एक साथ एक से ज़्यादा पेन डिवाइसों की पहचान कर सकता है. यह सुविधा, PointerEvent इंटरफ़ेस का एक एक्सटेंशन है. इसमें एक नया एट्रिब्यूट, deviceId शामिल किया गया है. यह सेशन के दौरान मौजूद रहने वाला, दस्तावेज़ से अलग, यूनीक आइडेंटिफ़ायर होता है. डेवलपर इसका इस्तेमाल, पेज के साथ इंटरैक्ट करने वाले अलग-अलग पेन की पहचान करने के लिए कर सकता है.
नेविगेशन अनुरोधों के लिए निजी नेटवर्क ऐक्सेस की जांच: सिर्फ़ चेतावनी वाला मोड
वेबसाइट A, उपयोगकर्ता के निजी नेटवर्क में किसी दूसरी साइट B पर जाने से पहले, यह सुविधा ये काम करती है:
- यह जांचता है कि अनुरोध किसी सुरक्षित संदर्भ से किया गया है या नहीं.
- प्रीफ़्लाइट अनुरोध भेजता है और यह जांच करता है कि B, निजी नेटवर्क ऐक्सेस की अनुमति देने वाले हेडर के साथ जवाब देता है या नहीं.
सब-रिसॉर्स और वर्कर्स के लिए पहले से ही सुविधाएं मौजूद हैं. हालांकि, यह सुविधा खास तौर पर नेविगेशन अनुरोधों के लिए जोड़ी गई है.
ये जांच, उपयोगकर्ता के निजी नेटवर्क को सुरक्षित रखने के लिए की जाती हैं. यह सुविधा "सिर्फ़ चेतावनी" मोड में काम करती है. इसलिए, अगर कोई भी जांच पूरी नहीं होती है, तो भी अनुरोध अस्वीकार नहीं किए जाएंगे. इसके बजाय, DevTools में एक चेतावनी दिखेगी, ताकि डेवलपर, नीति उल्लंघन ठीक करने के लिए ज़रूरी कार्रवाई के लिए तैयार हो सकें.
Sec-CH-UA-Form-Factor क्लाइंट हिंट
यह हिंट, उपयोगकर्ता एजेंट या डिवाइस के "फ़ॉर्म-फ़ैक्टर" के बारे में बताता है, ताकि साइट अपने हिसाब से जवाब दे सके.
Service Worker Static Routing API
इस एपीआई की मदद से, डेवलपर रूटिंग को कॉन्फ़िगर कर सकते हैं. साथ ही, वे सेवा वर्कर के ज़रिए की जाने वाली आसान कार्रवाइयों को ऑफ़लोड कर सकते हैं. अगर शर्त पूरी होती है, तो सेवा वर्कर को शुरू किए बिना या JavaScript को लागू किए बिना नेविगेशन होता है. इससे वेब पेजों को, सेवा वर्कर के इंटरसेप्शन की वजह से परफ़ॉर्मेंस में होने वाले नुकसान से बचाने में मदद मिलती है. ज़्यादा जानकारी के लिए, इस एपीआई के बारे में पिछली ब्लॉग पोस्ट देखें.
शेयर किए गए स्टोरेज से जुड़ा अपडेट
इस अपडेट की मदद से, क्रॉस-ऑरिजिन वर्कलेट चलाए जा सकते हैं. इसके लिए, आपको iframe बनाने की ज़रूरत नहीं है.
zstd Content-Encoding
Zstandard या zstd, डेटा को कंप्रेस करने का एक तरीका है. इस बारे में RFC8878 में बताया गया है. यह एक तेज़ लॉसलेस कंप्रेसन एल्गोरिदम है. यह zlib-लेवल पर रीयल-टाइम कंप्रेसन के मामलों और बेहतर कंप्रेसन रेशियो को टारगेट करता है. zstd टोकन को IANA से रजिस्टर किए गए Content-Encoding टोकन के तौर पर जोड़ा गया था.
कॉन्टेंट-कोडिंग के तौर पर zstd का इस्तेमाल करने से, पेजों को तेज़ी से लोड करने और कम बैंडविड्थ का इस्तेमाल करने में मदद मिलेगी. साथ ही, हमारे सर्वर पर कंप्रेस करने में कम समय, सीपीयू, और बिजली खर्च होगी. इससे सर्वर की लागत कम हो जाएगी.
नए ऑरिजिन ट्रायल
Chrome 123 में, इन नए ऑरिजिन ट्रायल में ऑप्ट इन किया जा सकता है.
WebAssembly JavaScript promise इंटिग्रेशन
WebAssembly का इस्तेमाल करके लिखे गए रिस्पॉन्सिव ऐप्लिकेशन के साथ काम करने के लिए, ऐसी सुविधाएं देना ज़रूरी है जिनकी मदद से WebAssembly प्रोग्राम को निलंबित और फिर से शुरू किया जा सके.
Promise इंटिग्रेशन का इस्तेमाल करने का मुख्य उदाहरण यह है कि वेब प्लैटफ़ॉर्म पर सिंक्रोनस एपीआई के ज़्यादा इस्तेमाल होने की वजह से, वेबअसेंबली प्रोग्राम के सोर्स को सिंक्रोनस एपीआई के बजाय असिंक्रोनस एपीआई का इस्तेमाल करने की अनुमति दी जा सके.
Promise Integration के ऑरिजिन ट्रायल के लिए रजिस्टर करें.
हटाने की प्रोसेस
Chrome 123 में यह सुविधा हटा दी गई है.
अनुमति और अनुमति नीति window-management के लिए window-placement का दूसरा नाम
Chrome 111 में, window-placement अनुमति और अनुमति-नीति स्ट्रिंग के लिए, window-management को एक दूसरा नाम के तौर पर जोड़ा गया था.
यह window-placement को हटाने और इस्तेमाल बंद करने के बाद, स्ट्रिंग का नाम बदलने की बड़ी कोशिश का हिस्सा था. शब्दावली में हुए बदलाव से, Window Management API के समय के साथ बेहतर होने की वजह से, डिस्क्रिप्टर की लाइफ़ बेहतर होती है.
window-placement के लिए, Chrome 113 में इस्तेमाल बंद होने की चेतावनियां शुरू हुई थीं. अब इसे हटा दिया जाएगा.