Chrome 84 में नया

Pete LePage

Chrome 84 को अब स्टेबल वर्शन के तौर पर रोल आउट किया जा रहा है.

यहां आपके जानने योग्य तथ्य दिए गए हैं:

नमस्ते, पीट लेपेज बोल रहा हूं. फ़िलहाल, मैं घर से काम और वीडियो रिकॉर्ड कर रहा हूं. आइए, Chrome 84 में डेवलपर के लिए उपलब्ध नई सुविधाओं के बारे में जानें!

ऐप्लिकेशन आइकॉन के शॉर्टकट

Twitter के PWA के लिए ऐप्लिकेशन आइकॉन के शॉर्टकट

ऐप्लिकेशन आइकॉन के शॉर्टकट की मदद से, उपयोगकर्ता आपके ऐप्लिकेशन में सामान्य टास्क तुरंत शुरू कर सकते हैं. उदाहरण के लिए, नया ट्वीट लिखना, मैसेज भेजना या अपनी सूचनाएं देखना. ये सुविधाएं, 'Android के लिए Chrome' में काम करती हैं.

Android पर ऐप्लिकेशन आइकॉन को दबाकर रखकर, ये शॉर्टकट इस्तेमाल किए जा सकते हैं. अपने PWA में शॉर्टकट जोड़ना आसान है. इसके लिए, अपने वेब ऐप्लिकेशन मेनिफ़ेस्ट में एक नई shortcuts प्रॉपर्टी बनाएं, शॉर्टकट के बारे में बताएं, और अपने आइकॉन जोड़ें.


"shortcuts": [
  {
    "name": "Open Play Later",
    "short_name": "Play Later",
    "description": "View the list you saved for later",
    "url": "/play-later",
    "icons": [
      { "src": "//play-later.png", "sizes": "192x192" }
    ]
  },
]

पूरी जानकारी के लिए, ऐप्लिकेशन के शॉर्टकट की मदद से तेज़ी से काम करना लेख पढ़ें.

वेब ऐनिमेशन एपीआई

Chrome 84 में, वेब ऐनिमेशन एपीआई में कई ऐसी सुविधाएं जोड़ी गई हैं जो पहले काम नहीं करती थीं.

  • animation.ready और animation.finished को प्रॉमिज़ फ़ंक्शन में बदल दिया गया है.
  • ब्राउज़र अब पुराने ऐनिमेशन को हटा सकता है और उन्हें साफ़ कर सकता है. इससे मेमोरी बचती है और परफ़ॉर्मेंस बेहतर होती है.
  • साथ ही, अब add और accumulate विकल्पों की मदद से, कॉम्पोज़िट मोड का इस्तेमाल करके ऐनिमेशन को जोड़ा जा सकता है.

मैं यहां सभी सुधारों के बारे में पूरी जानकारी नहीं दे सकता या अच्छे उदाहरण नहीं दे सकता. इसलिए, पूरी जानकारी के लिए, Chromium 84 में वेब ऐनिमेशन एपीआई के सुधार देखें.

Content indexing API

अगर आपका कॉन्टेंट इंटरनेट कनेक्शन के बिना उपलब्ध है. लेकिन उपयोगकर्ता को इसके बारे में जानकारी नहीं है? क्या यह सुविधा वाकई उपलब्ध है? डिस्कवरी से जुड़ी समस्या है!

Content Indexing API की मदद से, ऑफ़लाइन उपलब्ध कॉन्टेंट के लिए यूआरएल और मेटाडेटा जोड़ा जा सकता है. इस एपीआई को हाल ही में ओरिजनल ट्रायल से बाहर किया गया है. उस मेटाडेटा का इस्तेमाल करके, कॉन्टेंट को उपयोगकर्ता को दिखाया जाता है. इससे कॉन्टेंट को खोजने में आसानी होती है.

इंडेक्स में कॉन्टेंट जोड़ने के लिए, सेवा वर्कर रजिस्टरेशन पर index.add() को कॉल करें और कॉन्टेंट के बारे में ज़रूरी मेटाडेटा दें.


const registration = await navigator.serviceWorker.ready;
await registration.index.add({
  id: 'article-123',
  url: '/articles/123',
  launchUrl: '/articles/123',
  title: 'Article title',
  description: 'Amazing article about things!',
  icons: [{
    src: '/img/article-123.png',
    sizes: '64x64',
    type: 'image/png',
  }],
});

क्या आपको यह देखना है कि आपके इंडेक्स में पहले से क्या मौजूद है? सेवा देने वाले व्यक्ति के रजिस्ट्रेशन के लिए, index.getAll() पर कॉल करें.

const registration = await navigator.serviceWorker.ready;
const entries = await registration.index.getAll();
for (const entry of entries) {
  // entry.id, entry.launchUrl, etc. are all exposed.
}

पूरी जानकारी के लिए, Content Indexing API की मदद से, ऑफ़लाइन काम करने वाले पेजों को इंडेक्स करना लेख पढ़ें.

Wake lock API

Betty Crocker की वेबसाइट पर, 'सक्रियता लॉक' लागू करना.

मुझे खाना बनाना पसंद है. हालांकि, रेसिपी के हिसाब से खाना बनाते समय, स्क्रीन सेवर चालू होने पर मुझे बहुत परेशानी होती है! वेक लॉक एपीआई की मदद से, साइटें वेक लॉक का अनुरोध कर सकती हैं. इससे स्क्रीन को मंद होने और लॉक होने से रोका जा सकता है. यह एपीआई, Chrome 84 में ऑरिजिन ट्रायल से बाहर आ गया है.

असल में, Betty Crocker की वेबसाइट आज इसका इस्तेमाल कर रही है. साथ ही, web.dev पर एक केस स्टडी पब्लिश की है, जिसमें खरीदारी के इंटेंट के इंडिकेटर में 300% की बढ़ोतरी दिख रही है.

वेक लॉक पाने के लिए, navigator.wakeLock.request() को कॉल करें. इससे WakeLockSentinel ऑब्जेक्ट मिलता है, जिसका इस्तेमाल वेक लॉक को "रिलीज़" करने के लिए किया जाता है.


// Request the wake lock
const wl = await navigator.wakeLock.request('screen');

// Release the wake lock
wl.release();

हालांकि, इसमें और भी चीज़ें शामिल हैं. इसलिए, स्क्रीन वेक लॉक एपीआई की मदद से डिवाइस की स्क्रीन चालू रखना लेख पढ़ें. हालांकि, कम से कम अब मेरी स्क्रीन पर आटा नहीं पड़ेगा!

ऑरिजिन ट्रायल

मुझे दो नए ऑरिजिन ट्रायल के बारे में बताना है. अगर आपने पहले कभी ऑरिजिन ट्रायल का इस्तेमाल नहीं किया है, तो Chrome के ऑरिजिन ट्रायल का इस्तेमाल शुरू करना लेख पढ़ें.

डिवाइस के इस्तेमाल में न होने का पता लगाने की सुविधा

जब कोई उपयोगकर्ता कुछ समय तक कोई गतिविधि नहीं करता है, तो Idle Detection API आपको इसकी सूचना देता है. इससे पता चलता है कि वह उपयोगकर्ता शायद अपने कंप्यूटर से दूर है. चैट ऐप्लिकेशन या सोशल नेटवर्किंग साइटों के लिए यह सुविधा काफ़ी अच्छी है. इससे उपयोगकर्ताओं को यह पता चलता है कि उनके संपर्क उपलब्ध हैं या नहीं.

// Create the idle detector
const idleDetector = new IdleDetector();

// Set up an event listener that fires when idle state changes.
idleDetector.addEventListener('change', () => {
  const uState = idleDetector.userState;
  const sState = idleDetector.screenState;
  console.log(`Idle change: ${uState}, ${sState}.`);
});

// Start the idle detector.
await idleDetector.start({
  threshold: 60000,
  signal,
});

एपीआई के बारे में ज़्यादा जानने और आज ही इसका इस्तेमाल शुरू करने का तरीका जानने के लिए, इनऐक्टिव उपयोगकर्ताओं का पता लगाने के लिए, इनऐक्टिविटी का पता लगाने वाले एपीआई का इस्तेमाल करना देखें.

वेब असेंबली SIMD

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

WebAssembly SIMD के बारे में ज़्यादा जानने के लिए, WebAssembly SIMD की मदद से तेज़ी से काम करने वाले पैरलल ऐप्लिकेशन लेख पढ़ें.

अन्य डेटा

Chrome 84 में कई अहम अपडेट हैं. हालांकि, हम कुछ और अहम अपडेट के बारे में बताना चाहते हैं.

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

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

सदस्यता लें

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

मेरा नाम पीट लेपेज है. मुझे अभी भी बाल कटवाने हैं, लेकिन Chrome 85 के रिलीज़ होने के बाद, मैं आपको बताऊंगा कि Chrome में क्या नया है!