Chrome 89 में नया

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

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

मेरा नाम पीट लीपेज है, मैं घर से काम कर रहा/रही हूं और शूट कर रहा हूं. चलिए, देखते हैं कि Chrome 89 में डेवलपर के लिए नया क्या है!

WebHID, Webएनएफ़सी, और वेब सीरियल

मैं WebHID, Webएनएफ़सी, और वेब सीरियल को लेकर बहुत उत्साहित हूं. इनसे उन लोगों के लिए नए माहौल की जानकारी मिलती है जो असल में इस्तेमाल होने वाले हार्डवेयर के साथ काम करते हुए पहले संभव नहीं थे.

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

@AndreBan ने वेब सीरियल और कोड की करीब 60 लाइनों का कोड का इस्तेमाल करके, एक पेज बनाया है. यह Raspबेरी Pico पर मौजूद MicroPython REPL से इंटरैक्ट कर सकता है. Espruino अपने वेब आधारित IDE में भी वेब सीरियल का इस्तेमाल करता है.

CDS 2019 में, फ़्रैंकॉइस ने वेब एनएफ़सी का इस्तेमाल करके, मेमोरी-स्टाइल वाला एक मज़ेदार गेम लिखा. आपको फ़ोन को सही कार्ड पर, सही क्रम में टैप करना था.

StreamDeck के साथ डैफ़्ट पंक ड्रम पैड

साथ ही, मेरे पसंदीदा @bramus चैनल ने WebHID का इस्तेमाल करके, StreamDeck से कनेक्ट करने के लिए, डैफ़्ट पंक ड्रम पैड बनाया. अगर आपके पास StreamDeck नहीं है, तो YouTube पर उनका डेमो वीडियो देखें और GitHub पर कोड देखें.

चाहे आपकी साइट आपके हार्डवेयर से इंटरैक्ट करती हो या ऐसा हार्डवेयर जो कई साइटों के साथ इंटरैक्ट कर सकता हो, उपयोगकर्ता जीतते हैं, क्योंकि उन्हें खास ड्राइवर या सॉफ़्टवेयर इंस्टॉल करने की ज़रूरत नहीं होती.

web.dev/devices पर जाकर ऐसे कुछ डिवाइसों के बारे में ज़्यादा जानें जिनसे कनेक्ट किया जा सकता है. इसके अलावा, WebHID, WebNFC, और वेब सीरियल के लिए शुरू करने की गाइड देखें.

PWA को इंस्टॉल करने की शर्तों में बदलाव

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

इस साल के आखिर में, हम एक लूपहोल बंद करने की योजना बना रहे हैं. इसकी वजह से कुछ साइटें, ऑफ़लाइन अनुभव के बिना, इंस्टॉल करने की ज़रूरी शर्तों को पूरा कर पाईं. अगर आपके PWA में पहले से ही ऑफ़लाइन वर्शन का इस्तेमाल किया जा रहा है, तो आपको इसका इस्तेमाल करना चाहिए. आपको कुछ करने की ज़रूरत नहीं है. अगर नहीं है, तो इसे जोड़ें!

Chrome 89 की शुरुआत में, अगर ऑफ़लाइन होने पर आपका PWA कोई मान्य जवाब नहीं देता है, तो आपको 'समस्याएं' टैब में DevTools में एक चेतावनी दिखेगी. साथ ही, Lighthouse से पता चलेगा कि कोई समस्या है. इस साल के आखिर में, Chrome 93 में नीति उल्लंघन ठीक करने का तरीका (एनफ़ोर्समेंट) शुरू हो जाएगा.

DevTools की मदद से, Console में चेतावनी का मैसेज दिखाया जा रहा है.
Chrome DevTools कंसोल में चेतावनी का मैसेज.
DevTools में ऐप्लिकेशन टैब में चेतावनी का मैसेज दिखाया गया है.
ऐप्लिकेशन टैब > मेनिफ़ेस्ट > इंस्टॉल करने की क्षमता में चेतावनी का मैसेज.

आपके पास यह तय करने का विकल्प होता है कि आपको किस तरह का ऑफ़लाइन अनुभव देना है. आम तौर पर, आपको ज़्यादा से ज़्यादा अनुभव देना चाहिए. हालांकि, यह ऑफ़लाइन फ़ॉलबैक पेज जितना आसान हो सकता है.

बदलाव के बारे में ज़्यादा जानकारी पाने और यह भी जानें कि हम इसे क्यों कर रहे हैं. इसके लिए, प्रोग्रेसिव वेब ऐप्लिकेशन में ऑफ़लाइन सहायता का पता लगाने की सुविधा को बेहतर बनाना लेख पढ़ें.

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

डेस्कटॉप के लिए वेब शेयर और वेब शेयर लक्ष्य

अगर आपकी साइट पर उपयोगकर्ताओं को फ़ाइलें बनाने, उनमें बदलाव करने या उनसे इंटरैक्ट करने की अनुमति है, तो आपको 'वेब शेयर और वेब शेयर टारगेट एपीआई' इस्तेमाल करना चाहिए. ये एपीआई कुछ समय से मोबाइल पर उपलब्ध हैं. हालांकि, अब ये ChromeOS और Windows पर काम करते हैं.

वेब शेयर की मदद से उपयोगकर्ता, अपने डिवाइस पर इंस्टॉल किए गए दूसरे ऐप्लिकेशन पर फ़ाइलें या डेटा भेज सकते हैं. जैसे, Google Photos से Twitter पर फ़ोटो शेयर करना.

async function share(title, text, url) {
  try {
    await navigator.share({title, text, url});
    return true;
  } catch (ex) {
    console.error('Share failed', ex);
    return false;
  }
}

अगर आपको टारगेट के तौर पर रजिस्टर करना है, ताकि दूसरे ऐप्लिकेशन आपके साथ फ़ाइलें या डेटा शेयर कर सकें, तो आपको Web Share Target API का इस्तेमाल करना होगा.

"share_target": {
  "action": "/?share-target",
  "method": "POST",
  "enctype": "multipart/form-data",
  "params": {
    "files": [
      {
        "name": "file",
        "accept": ["image/*"],
      },
    ],
  },
},

शुरू करने की गाइड के लिए, Web Share API के साथ ओएस शेयरिंग यूज़र इंटरफ़ेस (यूआई) के साथ इंटिग्रेट करें और Web Share Target API से शेयर किया गया डेटा पाना देखें.

अन्य डेटा

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

Chrome अब JavaScript मॉड्यूल में टॉप लेवल await को अनुमति देता है.

PWA के लिए, खोज वाली पट्टी में ऐप्लिकेशन इंस्टॉल करने का नया आइकॉन

उपयोगकर्ताओं को होने वाली उलझन को कम करने के लिए, हमने इंस्टॉल किए जा सकने वाले PWA के लिए, खोज वाली पट्टी में दिखाए जाने वाले आइकॉन को अपडेट किया है.


साथ ही, अगर आपने ChromeOS के लिए Play Store में PWA उपलब्ध कराने के लिए, भरोसेमंद वेब गतिविधि का इस्तेमाल किया है, तो डिजिटल प्रॉडक्ट एपीआई के ऑरिजिन ट्रायल के लिए साइन अप करें.

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

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

सदस्यता लें

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

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

क्रेडिट देखें

रास्पबेरी पिस और अर्डुइनो की फ़ोटो Unsplash पर हैरिसन ब्रॉडबेंट ने ली है