Chrome 95 में नया

Pete LePage

यहां कुछ ज़रूरी जानकारी दी गई है:

  • ब्राउज़र में पहले से मौजूद URLPattern की मदद से, राउटिंग को आसान बनाया जा सकता है.
  • आई ड्रॉपर एपीआई, रंग चुनने के लिए एक इन-बिल्ट टूल उपलब्ध कराता है.
  • एक नई ओरिजिन ट्रायल उपलब्ध है. इसकी मदद से, अब कम की गई यूज़र एजेंट स्ट्रिंग पाने के लिए ऑप्ट-इन किया जा सकता है.
  • PWA Summit के सभी वीडियो ऑनलाइन उपलब्ध हैं.
  • इसके अलावा, और भी कई सुविधाएं उपलब्ध हैं.

मैं पीट लेपेज हूं. मैं घर से काम कर रहा हूं और वीडियो बना रहा हूं. आइए, देखते हैं कि Chrome 95 में डेवलपर के लिए क्या नया है.

URLPattern की मदद से रूटिंग करना

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

यह मौजूदा फ़्रेमवर्क के आधार पर बनाया गया है. इससे सामान्य राउटिंग टास्क आसानी से किए जा सकते हैं. उदाहरण के लिए, पूरे यूआरएल या यूआरएल पाथनेम से मिलान करना. इसके बाद, टोकन और ग्रुप के मिलान के बारे में जानकारी देना.

अगर आपको Express, Ruby on Rails या path-to-regexp में इस्तेमाल किए गए राउटिंग सिंटैक्स के बारे में पहले से पता है, तो आपको यह सिंटैक्स जाना-पहचाना लगेगा.

इसका इस्तेमाल करने के लिए, एक नया URLPattern() बनाएं और वह जानकारी दें जिससे आपको पैटर्न मैच करना है. पैटर्न में वाइल्डकार्ड, नाम वाले टोकन ग्रुप, रेगुलर एक्सप्रेशन ग्रुप, और ग्रुप मॉडिफ़ायर शामिल हो सकते हैं.

const p = new URLPattern({
  protocol: 'https',
  hostname: 'example.com',
  pathname: '/:folder/*/:fileName.jpg',
  search: '*',
  hash: '*',
});

उदाहरण के लिए, आइए URLPattern पर नज़र डालते हैं, जिसका इस्तेमाल Google Docs कर सकता है. हम फ़ाइल का kind, फ़ाइल ID, और इसे खोलने के लिए mode के बारे में बताएंगे. इसके बाद, पैटर्न का इस्तेमाल करने के लिए, हम test() या exec() को कॉल कर सकते हैं.

const url = 'https://docs.google.com/document/d/1s...5c/edit#heading=h.8...c';

const pattern = new URLPattern({
  pathname: '/:kind/d/:fileID/:mode',
  hash: '*',
});

const r = pattern.exec(url);
// {
//   "pathname": {"groups": {
//     "fileID": "1s...5c",
//     "kind": "document",
//     "mode": "edit"
//   }, ...},
//   "hash": {"groups": {"0":"heading=h.8...c"}, ...},
//   ...
// }

URLPattern, Chrome और Edge के वर्शन 95 और उसके बाद के वर्शन में डिफ़ॉल्ट रूप से चालू होता है. साथ ही, Node जैसे ब्राउज़र या एनवायरमेंट के लिए, जो अब तक इसका समर्थन नहीं करते हैं, urlpattern-polyfill लाइब्रेरी का इस्तेमाल किया जा सकता है.

पूरी जानकारी के लिए, जेफ़ का लेख URLPattern brings routing to the web platform पढ़ें!

आई ड्रॉपर एपीआई की मदद से रंग चुनना

मैंने अब तक जितने भी डिज़ाइन ऐप्लिकेशन इस्तेमाल किए हैं उन सभी में आईड्रॉपर टूल होता है. इससे किसी भी चीज़ के रंग का पता लगाना आसान हो जाता है. कुछ ब्राउज़र में <input type=color> में आईड्रॉपर की सुविधा पहले से मौजूद होती है, लेकिन यह सही नहीं है.

Microsoft के कुछ लोगों ने आई ड्रॉपर एपीआई को लागू किया है. इससे वेब पर भी यह सुविधा उपलब्ध हो गई है. इसका इस्तेमाल करने के लिए, एक नया EyeDropper() इंस्टेंस बनाएं. इसके बाद, उस पर open() को कॉल करें.

const eyeDropper = new EyeDropper();
const result = await eyeDropper.open();
// result = {sRGBHex: '#160731'}

कई अन्य मॉडर्न वेब एपीआई की तरह, यह एसिंक्रोनस तरीके से काम करता है, ताकि यह मुख्य थ्रेड को ब्लॉक न करे. जब उपयोगकर्ता अपनी पसंद के रंग पर क्लिक करेगा, तो उसे वही रंग दिखेगा.

PWA Summit

क्या आपने इस महीने की शुरुआत में हुए PWA Summit में हिस्सा लिया था?

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

यूज़र-एजेंट रिडक्शन का ऑरिजिन ट्रायल

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

Chrome 95 में, एक नया ऑरिजिन ट्रायल शुरू किया गया है. इससे आपको कम की गई यूए स्ट्रिंग पाने के लिए, अभी ऑप्ट इन करने की सुविधा मिलती है. इससे आपको समस्याओं का पता लगाने और उन्हें ठीक करने में मदद मिलेगी. ऐसा तब तक किया जा सकेगा, जब तक Chrome में यूज़र एजेंट (यूए) को कम करने की सुविधा डिफ़ॉल्ट रूप से चालू नहीं हो जाती.

बदलावों को कई रिलीज़ में धीरे-धीरे लागू किया जाएगा. हालांकि, आपको तैयारी करने और जांच करने के लिए जो भी चाहिए वह अभी उपलब्ध है.

इस बारे में पूरी जानकारी और टाइमलाइन, User-Agent Reduction origin trial पोस्ट में दी गई है. यह पोस्ट developer.chrome.com पर उपलब्ध है.

और भी कई सुविधाएं!

बेशक, इसमें और भी कई सुविधाएं हैं.

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

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

सदस्यता लें

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

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