इस पेज का अनुवाद Cloud Translation API से किया गया है.

Chrome 115 में नया

Adriana Jara

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

ScrollTimeline और ViewTimeline का इस्तेमाल करके, स्क्रोल से चलने वाले ऐनिमेशन बनाएं. इससे उपयोगकर्ता अनुभव बेहतर होता है.
फ़ेंस किए गए फ़्रेम, Privacy Sandbox के अन्य एपीआई के साथ काम करते हैं. इससे, काम का कॉन्टेंट एम्बेड करने के साथ-साथ, ग़ैर-ज़रूरी कॉन्टेक्स्ट शेयर होने से रोका जा सकता है.
Topics API की मदद से, ब्राउज़र उपयोगकर्ता की निजता बनाए रखते हुए, तीसरे पक्षों के साथ उसकी दिलचस्पी से जुड़ी जानकारी शेयर कर सकता है.
इसके अलावा, और भी सुविधाएं हैं.

मेरा नाम अड्रिआना जारा है. आइए, जानें कि Chrome 115 में डेवलपर के लिए क्या नया है.

स्क्रोल करने पर दिखने वाले ऐनिमेशन

वेब पर, स्क्रोल करने पर दिखने वाले ऐनिमेशन, UX का एक सामान्य पैटर्न है. स्क्रोल-ड्रिवन ऐनिमेशन, स्क्रोल कंटेनर की स्क्रोल पोज़िशन से जुड़ा होता है. इसका मतलब है कि ऊपर या नीचे स्क्रोल करने पर, लिंक किया गया ऐनिमेशन सीधे तौर पर आगे या पीछे जाएगा.

यहां दिए गए उदाहरणों में, इस्तेमाल के कुछ उदाहरण दिए गए हैं. उदाहरण के लिए, स्क्रोल करने पर चलने वाले रीडिंग इंडिकेटर बनाए जा सकते हैं:

दस्तावेज़ के ऊपर मौजूद, स्क्रोल से चलने वाला रीडिंग इंडिकेटर.

स्क्रोल-ड्रिवन ऐनिमेशन से ऐसे एलिमेंट भी बनाए जा सकते हैं जो दिखने पर धीरे-धीरे फ़ेड-इन होते हैं:

इस पेज पर मौजूद इमेज, दिखने के साथ-साथ धीरे-धीरे साफ़ होती हैं.

डिफ़ॉल्ट रूप से, किसी एलिमेंट से जुड़ा ऐनिमेशन, दस्तावेज़ की टाइमलाइन पर चलता है. पेज लोड होने पर, इसकी शुरुआत 0 से होती है और घड़ी के समय के साथ आगे बढ़ने लगती है. यह ऐनिमेशन की डिफ़ॉल्ट टाइमलाइन है. अब तक, आपके पास सिर्फ़ इस ऐनिमेशन टाइमलाइन का ऐक्सेस था.

स्क्रोल-ड्रिवन ऐनिमेशन स्पेसिफ़िकेशन में, दो तरह की नई टाइमलाइन के बारे में बताया गया है जिनका इस्तेमाल किया जा सकता है:

स्क्रोल प्रोग्रेस टाइमलाइन: यह एक ऐसी टाइमलाइन होती है जो किसी खास अक्ष के साथ स्क्रोल कंटेनर की स्क्रोल पोज़िशन से जुड़ी होती है.
प्रगति की टाइमलाइन देखें: यह एक ऐसी टाइमलाइन होती है जो स्क्रोल कंटेनर में किसी खास एलिमेंट की रिलेटिव पोज़िशन से जुड़ी होती है.

यहां एक कोड सैंपल दिया गया है, जो व्यूपोर्ट के सबसे ऊपर, पढ़ने की प्रोग्रेस का इंडिकेटर बनाने के लिए, स्क्रोल प्रोग्रेस टाइमलाइन का इस्तेमाल करता है.

<body>
  <div id="progress"></div>
  …
</body>

@keyframes grow-progress {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}

#progress {
  position: fixed;
  left: 0; top: 0;
  width: 100%; height: 1em;
  background: red;

  transform-origin: 0 50%;
  animation: grow-progress auto linear;
  animation-timeline: scroll();
}

ज़्यादा जानकारी और उदाहरणों के लिए, स्क्रोल-ड्राइव ऐनिमेशन पढ़ें.

फ़ेंस्ड फ़्रेम

Privacy Sandbox एक ऐसा इनिशिएटिव है जिसका मकसद ऐसी टेक्नोलॉजी बनाना है जो इंटरनेट पर, लोगों की निजता को सुरक्षित रखे. साथ ही, डेवलपर को डिजिटल कारोबार को आगे बढ़ाने के लिए टूल उपलब्ध कराए.

इसके कई प्रस्तावों का मकसद, तीसरे पक्ष की कुकी या अन्य ट्रैकिंग सिस्टम के बिना, क्रॉस-साइट इस्तेमाल के उदाहरणों को पूरा करना है. उदाहरण के लिए:

Protected Audience API: इसकी मदद से, निजता बनाए रखते हुए दिलचस्पी के हिसाब से विज्ञापन दिखाए जा सकते हैं.
शेयर किया गया स्टोरेज: इससे सुरक्षित माहौल में, अलग-अलग साइटों के डेटा को ऐक्सेस किया जा सकता है.

निजता को बनाए रखने के लिए, इनमें से कुछ एपीआई को कॉन्टेंट को एम्बेड करने के लिए नए तरीके की ज़रूरत होती है. इस समस्या को हल करने के लिए, फ़ेंस्ड फ़्रेम का इस्तेमाल किया जाता है.

फ़ेंस किए गए फ़्रेम, Privacy Sandbox के अन्य प्रस्तावों के साथ मिलकर काम करते हैं. इससे, एक ही पेज पर अलग-अलग स्टोरेज पार्टिशन के दस्तावेज़ दिखाए जा सकते हैं.

फ़ेंस्ड फ़्रेम, iframe की तरह होता है. इसे एम्बेड किए गए कॉन्टेंट के लिए एचटीएमएल एलिमेंट के तौर पर सुझाया जाता है. iframe के ठीक उलट फ़ेंस्ड फ़्रेम, एम्बेड करने के कॉन्टेक्स्ट के साथ कम्यूनिकेशन पर पाबंदी लगाता है, ताकि फ़्रेम दूसरी साइट पर मौजूद डेटा को, एम्बेड करने के कॉन्टेक्स्ट के साथ शेयर किए बिना ऐक्सेस कर सके.

इसी तरह, एम्बेड किए गए कॉन्टेक्स्ट में मौजूद पहले पक्ष का कोई भी डेटा, फ़ेंस किए गए फ़्रेम के साथ शेयर नहीं किया जा सकता.

सुविधा	`iframe`	`fencedframe`
कॉन्टेंट एम्बेड करना	हां	हां
एम्बेड किया गया कॉन्टेंट, एम्बेड करने के कॉन्टेक्स्ट के DOM को ऐक्सेस कर सकता है	हां	नहीं
संदर्भ जोड़ने की सुविधा, एम्बेड किए गए कॉन्टेंट के DOM को ऐक्सेस कर सकती है	हां	नहीं
निगरानी किए जा सकने वाले एट्रिब्यूट, जैसे कि `name`	हां	नहीं
यूआरएल (`http://example.com`)	हां	हां (इस्तेमाल के उदाहरण के हिसाब से)
ब्राउज़र से मैनेज किया जाने वाला ओपेक सोर्स (`urn:uuid`)	नहीं	हां
अलग-अलग साइटों के डेटा का ऐक्सेस	नहीं	हां (इस्तेमाल के उदाहरण के हिसाब से)

उदाहरण के लिए, मान लें कि news.example (एम्बेड करने का कॉन्टेक्स्ट) shoes.example से किसी विज्ञापन को फ़ेंस किए गए फ़्रेम में एम्बेड करता है. news.example, shoes.example विज्ञापन से डेटा नहीं निकाल सकता और shoes.example, news.example से पहले पक्ष (ग्राहक) का डेटा नहीं हासिल कर सकता.

स्टोरेज को अलग-अलग हिस्सों में बांटने से पहले और बाद की स्थिति की तुलना.

फ़ेंस किए गए फ़्रेम, Protected Audience API, शेयर किए गए स्टोरेज वगैरह के दस्तावेज़ देखने के लिए, ये लेख पढ़ें

Topics API

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

Topics API की मदद से, ब्राउज़र उपयोगकर्ता की निजता बनाए रखते हुए, तीसरे पक्षों के साथ उसकी दिलचस्पी से जुड़ी जानकारी शेयर कर सकता है.

Topics API, उपयोगकर्ता की विज़िट की गई साइटों को ट्रैक किए बिना, दिलचस्पी के हिसाब से विज्ञापन (आईबीए) दिखाता है. ब्राउज़र, उपयोगकर्ता की ब्राउज़िंग गतिविधि के आधार पर, उन विषयों को देखता और रिकॉर्ड करता है जिनमें उपयोगकर्ता की दिलचस्पी है. यह जानकारी, उपयोगकर्ता के डिवाइस पर रिकॉर्ड की जाती है.

उदाहरण के लिए, हो सकता है कि एपीआई, knitting.example वेबसाइट पर आने वाले उपयोगकर्ता के लिए "Fiber & Textile Arts" विषय का सुझाव दे.

विषय, विज्ञापन टेक्नोलॉजी प्लैटफ़ॉर्म को काम के विज्ञापन चुनने में मदद करने वाला सिग्नल होता है. तीसरे पक्ष की कुकी के उलट, यह जानकारी शेयर करते समय उपयोगकर्ता या उसकी ब्राउज़िंग गतिविधि के बारे में ज़्यादा जानकारी नहीं दी जाती.

Topics टैक्सोनॉमी और Topics API के इस्तेमाल के बारे में पूरी जानकारी पाने के लिए, Privacy Sandbox की खास जानकारी पढ़ें

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

इसके अलावा, और भी कई चीज़ें हैं.

मुख्य थ्रेड पर WebAssembly.Module का ज़्यादा से ज़्यादा साइज़ 8 मेगाबाइट हो गया
सीएसएस display प्रॉपर्टी में, अब वैल्यू के तौर पर एक से ज़्यादा कीवर्ड इस्तेमाल किए जा सकते हैं. इसमें, पहले से बनाए गए लेगसी कीवर्ड भी शामिल हैं.
Compute Pressure API के लिए, ऑरिजिन ट्रायल उपलब्ध है. इससे, डिवाइस के हार्डवेयर की मौजूदा स्थिति के बारे में बेहतर जानकारी मिलती है.

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

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

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

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