Chrome 100 में नया

Pete LePage

यहां आवश्यक जानकारी दी गई है:

मेरा नाम पीट लीपेज है. चलिए, जानते हैं और देखते हैं कि Chrome 100 में डेवलपर के लिए नया क्या है.

Chrome 100

जब ब्राउज़र पहली बार वर्शन 10 पर पहुंचे, तो कुछ समस्याएं थीं, क्योंकि मेजर वर्शन नंबर एक अंक से दो अंकों में गया. उम्मीद है, हमने कुछ ऐसी चीज़ें सीखी हैं जो दो अंकों से तीन के ट्रांज़िशन को आसान बना देंगी.

Chrome और Firefox का लोगो

Chrome 100 अब उपलब्ध है और Firefox 100 जल्द ही लॉन्च होने वाला है. तीन अंकों वाले इन वर्शन नंबर से उन साइटों पर समस्या हो सकती है जो किसी तरीके से ब्राउज़र के वर्शन की पहचान करती हैं. पिछले कुछ महीनों में, Firefox टीम और Chrome टीम ने ऐसे प्रयोग किए जिनमें ब्राउज़र ने वर्शन नंबर 100 रिपोर्ट किया, जबकि ऐसा नहीं था.

इसकी वजह से, कुछ समस्याएं हुईं, जिनमें से कई को पहले ही ठीक कर दिया गया है. लेकिन, हमें अब भी आपकी सहायता चाहिए.

  • अगर आप वेबसाइट मैनेज करने वाले व्यक्ति हैं, तो Chrome और Firefox 100 की मदद से अपनी वेबसाइट की जांच करें.
  • अगर आपने उपयोगकर्ता-एजेंट की पार्स करने वाली लाइब्रेरी डेवलप की है, तो 100 से ज़्यादा या उसके बराबर वर्शन पार्स करने के लिए, टेस्ट जोड़ें.

ज़्यादा जानकारी के लिए, web.dev पर Chrome और Firefox के मेजर वर्शन 100 पर जल्द ही पहुंचें.

100 शानदार वेब मोमेंट

100 कूल वेब मोमेंट की प्रोमो इमेज

वेब को विकसित होते हुए देखना और Chrome की पिछली 100 रिलीज़ में आपने जो भी शानदार चीज़ें बनाई हैं उन्हें देखना, रोमांचक होता है. हमने सोचा कि मेमोरी के गलियारे में चलने और पिछले 14 सालों में हुए #100CoolWeb जाएँ का जश्न मनाना काफ़ी मज़ेदार होगा.

हमें बताएं कि आपको कौनसे पल सबसे ज़्यादा पसंद आए. अगर हमसे कोई जानकारी छूट गई है (और हमें पक्का पता है कि ऐसा हुआ है), तो हमें @Chromiumdev को ट्वीट करें. इसके लिए, #100CoolWeb जाएँ. आनंद लें!

उपयोगकर्ता एजेंट स्ट्रिंग को कम किया गया

उपयोगकर्ता एजेंट की बात करें, तो Chrome 100 डिफ़ॉल्ट रूप से उपयोगकर्ता-एजेंट स्ट्रिंग के साथ काम करने का आखिरी वर्शन होगा. यह उपयोगकर्ता-एजेंट स्ट्रिंग के इस्तेमाल को नए User-Agent Client Hints API से बदलने की रणनीति का हिस्सा है.

Chrome 101 से, उपयोगकर्ता एजेंट को धीरे-धीरे कम किया जाएगा.

[Chromium ब्लॉग][crblog] पर, उपयोगकर्ता एजेंट को कम करने की प्रोसेस के ऑरिजिन ट्रायल और तारीखें देखें. इससे, इस बारे में ज़्यादा जानकारी मिल सकती है कि क्या और कब हटाया जाएगा.

मल्टी-स्क्रीन विंडो प्लेसमेंट एपीआई

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

मल्टी-स्क्रीन विंडो प्लेसमेंट एपीआई की मदद से, उपयोगकर्ता की मशीन से कनेक्ट किए गए डिसप्ले की गिनती की जा सकती है और विंडो को खास स्क्रीन पर रखा जा सकता है.

आप तुरंत देख सकते हैं कि window.screen.isExtended वाले डिवाइस से एक से ज़्यादा स्क्रीन कनेक्ट की गई हैं या नहीं.

const isExtended = window.screen.isExtended;
// returns true/false

हालांकि, मुख्य फ़ंक्शन window.getScreenDetails() में है, जिससे अटैच किए गए डिसप्ले के बारे में जानकारी मिलती है.

const x = await window.getScreenDetails();
// returns
// {
//    currentScreen: {...}
//    oncurrentscreenchange: null
//    onscreenschange: null
//    screens: [{...}, {...}]
// }

उदाहरण के लिए, पहले मुख्य स्क्रीन का पता लगाया जा सकता है. इसके बाद, उस डिसप्ले पर किसी एलिमेंट को फ़ुल स्क्रीन पर दिखाने के लिए, requestFullscreen() का इस्तेमाल किया जा सकता है.

try {
  const screens = await window.getScreenDetails();
  const primary = screens
         .filter((screen) => screen.primary)[0]
  await elem.requestFullscreen({ screen: primary });
} catch (err) {
  console.error(err);
}

और यह बदलावों को सुनने का एक तरीका है. उदाहरण के लिए, अगर कोई नया डिस्प्ले प्लग इन किया गया है या निकाला गया है, तो रिज़ॉल्यूशन बदल जाता है और दूसरी चीज़ें.

const screens = await window.getScreenDetails();
let numScreens = screens.screens.length;
screens.addEventListener('screenschange', (event) => {
  if (screens.screens.length !== numScreens) {
    console.log('Screen count changed');
    numScreens = screens.screens.length;
  }
});

ज़्यादा जानने के लिए, टॉम का अपडेट किया गया लेख देखें web.dev पर मल्टी-स्क्रीन विंडो प्लेसमेंट एपीआई की मदद से कई डिसप्ले मैनेज करना.

और ज़्यादा!

बेशक, यहां बहुत कुछ है.

एचआईडी डिवाइसों के लिए, forget() का एक नया तरीका मौजूद है. इसकी मदद से, किसी उपयोगकर्ता से मिले एचआईडी डिवाइस को दी गई अनुमति वापस ली जा सकती है.

// Request an HID device.
const [device] = await navigator.hid.requestDevice(opts);


// Then later, revoke permission to the device.
await device.forget();

Webएनएफ़सी के लिए, makeReadOnly() तरीके का इस्तेमाल करके, एनएफ़सी टैग को हमेशा के लिए रीड-ओनली मोड में बदला जा सकता है.

const ndef = new NDEFReader();
await ndef.makeReadOnly();

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

इसमें सिर्फ़ कुछ खास बातों के बारे में बताया गया है. Chrome 100 में दूसरे बदलावों के बारे में जानने के लिए, नीचे दिए गए लिंक देखें.

सदस्यता लें

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

मैं हूं पीट लेपेज और Chrome 101 के रिलीज़ होते ही, मैं आपको बताऊंगी कि Chrome में नया क्या है!