Hello.

I am Paul Kinlan.

A Developer Advocate for Chrome and the Open Web at Google.

Wood Carving found in Engakuji Shrine near Kamakura

Paul Kinlan

Trying to make the web and developers better.

RSS Github Medium

Sakura

Paul Kinlan

मुझे बताया गया है कि अधिक विशेष रूप से यह 'याज़ाकुरा' है

Read More

Debugging Web Pages on the Nokia 8110 with KaiOS using Chrome OS

Paul Kinlan

यह पोस्ट एक KaiOS device with Web IDE डिबगिंग पर पोस्ट का एक निरंतरता है, लेकिन KaiOS device with Web IDE का उपयोग करने के बजाय, अब आप Crostini के साथ Chrome OS (m75) का उपयोग कर सकते हैं। मैं KaiOS Environment Setup से KaiOS Environment Setup रहा हूं जो एक अच्छी शुरुआत है, लेकिन क्रोम ओएस और क्रॉस्टिनी के साथ जाने के लिए पर्याप्त नहीं है। नीचे किसी न किसी गाइड का अनुसरण किया गया है।

Read More

New WebKit Features in Safari 12.1 | WebKit

Paul Kinlan

नवीनतम सफारी के लिए बड़े अपडेट!

मैंने सोचा था कि यह एक बहुत बड़ी घोषणा थी, और Google के विपरीत जो कुछ समय पहले कहा गया था कि Google पे लीब पेमेंट को लागू करने का तरीका है … मेरा मतलब है कि यह एक लाख मील दूर नहीं है, Google पे सबसे ऊपर बनाया गया भुगतान का अनुरोध, लेकिन यह पहले पीआर नहीं है।

Payment Request is now the recommended way to pay implement Apple Pay on the web.

Read full post

और मेरी पसंदीदा विशेषता ने वेब इंटेंट्स के साथ मेरा इतिहास दिया।

Web Share API

The Web Share API adds navigator.share(), a promise-based API developers can use to invoke a native sharing dialog provided the host operating system. This allows users to share text, links, and other content to an arbitrary destination of their choice, such as apps or contacts.

अब सिर्फ Share Target API प्राप्त करना है और हम एक विजेता की ओर हैं! :)

Offline fallback page with service worker

Paul Kinlan

वर्षों पहले, मैंने कुछ शोध किया कि कैसे नेटवर्क्स कनेक्टिविटी ने नेटवर्क कनेक्टिविटी की कमी का जवाब दिया। जब तक मैंने विश्लेषण के लिंक को खो दिया है (मैं यह Google+ पर शपथ ले सकता था), ओवररचिंग कथा यह थी कि कई देशी अनुप्रयोगों को इंटरनेट से अटैच किया जाता है कि वे सीधे कार्य करने से इनकार करते हैं। बहुत सारे वेब ऐप की तरह लगता है, जो चीज़ उन्हें वेब से अलग करती है, हालांकि यह अनुभव अभी भी 'ऑन-ब्रांड' है, बार्ट सिम्पसन आपको बताएगा कि आपको ऑनलाइन (उदाहरण के लिए) होने की आवश्यकता है, और अभी तक अधिकांश वेब अनुभव आपको एक 'डिनो' (क्रोम: // डिनो देखें) मिलते हैं।

हम लंबे समय से सेवा कार्यकर्ता पर काम कर रहे हैं, और जब तक हम देख रहे हैं कि अधिक से अधिक साइटों में सेवा कार्यकर्ता द्वारा नियंत्रित पृष्ठ हैं, तो अधिकांश साइटों के पास तब भी बुनियादी कमी नहीं होती है जब नेटवर्क नहीं होता उपलब्ध।

मैंने अपने अच्छे चुम जेक से पूछा कि क्या हम इस बात पर कोई दोषी हैं कि इस धारणा पर एक जेनेरिक फॉल-बैक पेज कैसे बनाया जाए जिसे आप पूरी तरह से ऑफ़लाइन-पहला अनुभव नहीं बनाना चाहते हैं, और 10 मिनट के भीतर उन्होंने इसे बनाया था। Check it out

संक्षिप्तता के लिए, मैंने नीचे दिए गए कोड को चिपकाया है क्योंकि यह केवल लगभग 20 लाइनें लंबी है। यह ऑफ़लाइन संपत्तियों को कैश करता है, और फिर प्रत्येक भ्रूण के लिए जो एक 'नेविगेशन' भ्रूण है, यह देखेगा कि क्या यह त्रुटि (नेटवर्क के कारण) है और फिर मूल सामग्री के स्थान पर ऑफ़लाइन पृष्ठ को प्रस्तुत करेगा।

addEventListener('install', (event) => {
  event.waitUntil(async function() {
    const cache = await caches.open('static-v1');
    await cache.addAll(['offline.html', 'styles.css']);
  }());
});

// See https://developers.google.com/web/updates/2017/02/navigation-preload#activating_navigation_preload
addEventListener('activate', event => {
  event.waitUntil(async function() {
    // Feature-detect
    if (self.registration.navigationPreload) {
      // Enable navigation preloads!
      await self.registration.navigationPreload.enable();
    }
  }());
});

addEventListener('fetch', (event) => {
  const { request } = event;

  // Always bypass for range requests, due to browser bugs
  if (request.headers.has('range')) return;
  event.respondWith(async function() {
    // Try to get from the cache:
    const cachedResponse = await caches.match(request);
    if (cachedResponse) return cachedResponse;

    try {
      // See https://developers.google.com/web/updates/2017/02/navigation-preload#using_the_preloaded_response
      const response = await event.preloadResponse;
      if (response) return response;

      // Otherwise, get from the network
      return await fetch(request);
    } catch (err) {
      // If this was a navigation, show the offline page:
      if (request.mode === 'navigate') {
        return caches.match('offline.html');
      }

      // Otherwise throw
      throw err;
    }
  }());
});

बस इतना ही। जब उपयोगकर्ता ऑनलाइन होगा तो उन्हें डिफ़ॉल्ट अनुभव दिखाई देगा।

और जब उपयोगकर्ता ऑफ़लाइन होगा, तो उन्हें फ़ॉलबैक पेज मिलेगा।

मुझे यह सरल स्क्रिप्ट अविश्वसनीय रूप से शक्तिशाली लगती है, और हाँ, जबकि यह अभी भी सुधार किया जा सकता है, मुझे विश्वास है कि जिस तरह से नेटवर्क के साथ एक समस्या है, हम अपने उपयोगकर्ताओं से बात करने के तरीके में भी एक साधारण बदलाव करते हैं, जिसमें मौलिक रूप से सुधार करने की क्षमता है दुनिया भर के उपयोगकर्ताओं के लिए वेब की धारणा।

** अद्यतन ** जेफरी पॉस्निक किल्डी ने मुझे नेविगेशन प्रीलोड का उपयोग करने के बारे में याद दिलाया कि सभी अनुरोधों के लिए SW बूट पर इंतजार नहीं करना होगा, यह विशेष रूप से महत्वपूर्ण है यदि आप केवल failed नेटवर्क अनुरोधों को नियंत्रित कर रहे हैं।

testing block image upload

Paul Kinlan

यह केवल देखने के लिए एक परीक्षण है कि क्या मुझे छवि अपलोड सही मिली। यदि आप इसे देखते हैं, तो हाँ मैंने किया :)

Read More

Editor.js

Paul Kinlan

मैंने Hugo आधारित संपादक द्वारा अपडेट किया गया है और संपादकजेस के रूप में, साथ ही, ब्लॉग के लिए संपादक का उपयोग करने का प्रयास किया है।

Workspace in classic editors is made of a single contenteditable element, used to create different HTML markups. Editor.js workspace consists of separate Blocks: paragraphs, headings, images, lists, quotes, etc. Each of them is an independent contenteditable element (or more complex structure) provided by Plugin and united by Editor’s Core.

Read full post

मुझे लगता है कि यह काम करता है।

मैंने कोडबेस के साथ थोड़ा संघर्ष किया, उदाहरण सभी ईएस मॉड्यूल का उपयोग करते हैं, हालांकि एनपीएम डिस्ट IIFE ES5 कोड में सभी आउटपुट है। लेकिन एक बार जब मैंने उस बाधा को पार कर लिया, तो यूआई का निर्माण करना काफी आसान हो गया है जो मध्यम की तरह थोड़ा अधिक दिखता है।

Debugging Web Pages on the Nokia 8110 with KaiOS

Paul Kinlan

हम हाल ही में फीचर फोन पर बहुत विकास कर रहे हैं और यह कठिन, लेकिन मजेदार है। सबसे कठिन बिट यह है कि KaiOS पर हमें वेब पेजों को डिबग करना असंभव लगता है, विशेषकर उस हार्डवेयर पर जो हमारे पास था (नोकिया 8110)। नोकिया एक बेहतरीन डिवाइस है, इसे KaiOS के साथ बनाया गया है, जिसे हम जानते हैं कि यह फ़ायरफ़ॉक्स 48 के समान कुछ पर आधारित है, लेकिन यह बंद है, जैसा कि आप अन्य एंड्रॉइड डिवाइस पर प्राप्त करते हैं, कोई पारंपरिक डेवलपर मोड नहीं है, जिसका अर्थ है कि आप फ़ायरफ़ॉक्स कनेक्ट नहीं कर सकते आसानी से वेबाइड।

Read More

Object Detection and Augmentation

Paul Kinlan

मैं क्रोम में Shape Detection API साथ बहुत कुछ खेल रहा हूं और मुझे वास्तव में यह पसंद है, उदाहरण के लिए एक बहुत ही सरल QRCode detector मैंने बहुत पहले लिखा था एक JS new BarcodeDetector() , लेकिन उपलब्ध है तो new BarcodeDetector() एपीआई का उपयोग करता है।

आप आकार का पता लगाने की एपीआई की अन्य क्षमताओं का उपयोग करके यहां बनाए गए कुछ अन्य डेमो देख सकते हैं: Face Detection , Barcode Detection और Text Detection

जब मैं सप्ताहांत में Jeeliz से Jeeliz तो मुझे सुखद आश्चर्य हुआ और मैं उनके टूलकिट के प्रदर्शन पर अविश्वसनीय रूप से प्रभावित हुआ - बशर्ते कि मैं Pixel3 XL का उपयोग कर रहा था, लेकिन चेहरे का पता लगाना काफी आसान लग रहा था जो कि FaceDetector API के साथ संभव है।

Checkout some of their demos

इससे मुझे बहुत कुछ सोचने को मिला। ऑब्जेक्ट डिटेक्शन के लिए यह टूलकिट (और इसे पसंद करने वाले) एपीआई का उपयोग करते हैं जो कि वेब पर विशेष रूप से कैमरा एक्सेस, वेबजीएल और डब्ल्यूएएसएम पर उपलब्ध हैं, जो क्रोम के आकृति डिटेक्शन एपीआई के विपरीत है (जो केवल क्रोम में है और सभी प्लेटफार्मों पर संगत नहीं है) ) का उपयोग समृद्ध अनुभवों को आसानी से बनाने और सभी प्लेटफार्मों पर एक सुसंगत अनुभव के साथ अरबों उपयोगकर्ताओं तक पहुंचने के लिए किया जा सकता है।

ऑग्मेंटेशन वह जगह है जहाँ यह दिलचस्प हो जाता है (और वास्तव में मैं इस पोस्ट में क्या दिखाना चाहता था) और जहाँ आपको मिडलवेयर लाइब्रेरी की आवश्यकता होती है जो अब प्लेटफ़ॉर्म पर आ रही है, हम मज़ेदार स्नैपचैट-एस्क फेस फ़िल्टर ऐप बना सकते हैं, जिनके बिना उपयोगकर्ता मैसिव एप्लिकेशन इंस्टॉल कर सकते हैं उपयोगकर्ताओं के डिवाइस से बड़ी मात्रा में डेटा काटा जाता है (क्योंकि सिस्टम में कोई अंतर्निहित पहुंच नहीं है)।

मज़ेदार डेमो के बाहर, उपयोगकर्ता के लिए बहुत उन्नत उपयोग-मामलों को जल्दी और आसानी से हल करना संभव है, जैसे:

  • कैमरा या उपयोगकर्ता से सीधे फोटो का चयन करें
  • कैमरे से भाषाओं का लाइव अनुवाद
  • इनलाइन क्यूआरकोड डिटेक्शन ताकि लोगों को हर समय वीचैट को खोलना न पड़े :)
  • ऑटो एक्सट्रैक्शन वेबसाइट के URL या किसी इमेज से एड्रेस
  • क्रेडिट कार्ड का पता लगाना और नंबर निकालना
  • आपके स्टोर के वेब ऐप में विजुअल प्रोडक्ट सर्च।
  • अपने स्टोर वेब ऐप में अधिक उत्पाद विवरण के लिए बारकोड लुकअप।
  • लोगों के चेहरों पर प्रोफाइल फोटो की त्वरित कटाई।
  • सरल A11Y एक उपयोगकर्ता छवियों में पाया पाठ सुनने के लिए सुविधाएँ।

मैंने इन उपयोग-मामलों के बारे में सोचने में केवल 5 मिनट बिताए हैं - मुझे पता है कि बहुत अधिक हैं - लेकिन इसने मुझे मारा कि हम कैमरे का उपयोग करने वाली बहुत सी साइटें या वेब ऐप नहीं देखते हैं, इसके बजाय हम बहुत सी साइटें पूछ रहे हैं। उपयोगकर्ताओं को एक ऐप डाउनलोड करने के लिए, और मुझे नहीं लगता कि हमें ऐसा करने की आवश्यकता है।

** अद्यतन ** हमारी टीम में थॉमस स्टीनर ने हमारी टीम चैट में उल्लेख किया है कि ऐसा लगता है कि मुझे वर्तमान ShapeDetection एपीआई पसंद नहीं है। मैं इस तथ्य से प्यार करता हूं कि यह एपीआई हमें संबंधित प्रणालियों में से प्रत्येक के मूल शिपिंग कार्यान्वयन तक पहुंच प्रदान करता है, हालांकि जैसा कि मैंने The Lumpy Web में लिखा था, वेब डेवलपर्स प्लेटफॉर्म में निरंतरता को The Lumpy Web हैं और शेप डिटेक्शन एपीआई के साथ कई समस्याएं हैं संक्षेप में प्रस्तुत करें:

  1. एपीआई केवल क्रोम में है
  2. क्रोम में एपीआई हर प्लेटफॉर्म पर बहुत अलग है क्योंकि उनके अंतर्निहित कार्यान्वयन अलग हैं। एंड्रॉइड के पास केवल मुंह और आंखों जैसे स्थलों के लिए अंक हैं, जहां macOS की रूपरेखा है। Android पर TextDetector ने पाया हुआ पाठ लौटाया, जहाँ TextDetector रूप में यह 'पाठ उपस्थिति' सूचक देता है … यह सूरमा को मिले सभी बगों का उल्लेख नहीं है।

वितरण के लिए एक मंच के रूप में वेब इन जैसे अनुभवों के लिए इतना अधिक समझ में आता है कि मुझे लगता है कि यह हमें ऐसा नहीं करने के लिए याद होगा, लेकिन उपरोक्त मुद्दों के दो समूहों ने मुझे हर सुविधा को लागू करने की दीर्घकालिक आवश्यकता पर सवाल उठाया वेब प्लेटफ़ॉर्म मूल रूप से, जब हम एक पैकेज में अच्छे समाधानों को लागू कर सकते हैं, जिसे आज वेबजीएल, डब्ल्यूएएसएम और भविष्य के वेब जीपीयू जैसे प्लेटफॉर्म की सुविधाओं का उपयोग करके शिप किया गया है।

वैसे भी, मुझे इस तथ्य से प्यार है कि हम वेब पर ऐसा कर सकते हैं और मैं उनके साथ साइटों को देखने के लिए आगे देख रहा हूं।

Got web performance problems? Just wait...

Paul Kinlan

मैंने एक अच्छा चूम और सहकर्मी, Mariko एक ट्वीट को देखा, Mariko आपको कम अंत वाले उपकरणों की एक श्रेणी में परीक्षण करने के बारे में बताया गया था।

ट्वीट का संदर्भ यह है कि हम देख रहे हैं कि उपयोगकर्ताओं के लिए निर्माण करते समय वेब डेवलपमेंट कैसा होता है जो इन कक्षाओं के उपकरणों पर दैनिक रहता है।

टीम अब इस अंतरिक्ष में बहुत काम कर रही है, लेकिन मैंने एक दिन एक साइट का निर्माण करने में बिताया है और प्रदर्शन के कुछ हद तक उचित स्तर पर कुछ भी काम करना अविश्वसनीय रूप से कठिन था - यहां कुछ समस्याएं हैं जो मैं भाग गया:

  • Viewport विषमताओं, और 300ms क्लिक-विलम्ब के रहस्यमय पुन: परिचय (चारों ओर काम कर सकते हैं)।
  • पूरी स्क्रीन के विशाल प्रतिनिधि, और यह धीमा है।
  • नेटवर्क धीमा है
  • मेमोरी विवश है, और बाद में जीसी का ताला कई सेकंड के लिए मुख्य धागा है
  • अविश्वसनीय रूप से धीमी जेएस निष्पादन
  • DOM मैनिप्युलेशन धीमा है

जिन पृष्ठों का मैं निर्माण कर रहा था, उनमें से कई के लिए, यहां तक कि एक तेज़ वाईफाई कनेक्शन पृष्ठों पर लोड होने में कई सेकंड लगे, और बाद के इंटरैक्शन केवल सादे धीमे थे। यह कठिन था, इसमें मुख्य धागे से जितना संभव हो सके पाने की कोशिश करना शामिल था, लेकिन एल्गोरिदम और तर्क में परिवर्तन देखने के लिए तकनीकी स्तर पर यह अविश्वसनीय रूप से संतुष्टिदायक था कि मैंने अपने सभी पारंपरिक वेब विकास, उपज के लिए नहीं किया है प्रदर्शन में बड़ा सुधार।

मुझे यकीन नहीं है कि लंबे समय तक क्या करना है, मुझे शक है कि डेवलपर्स की एक बड़ी संख्या है जो हम अधिक विकसित बाजारों में काम करते हैं, उनकी प्रतिक्रिया होगी 'मैं [एक्स देश में] डालने के लिए उपयोगकर्ताओं के लिए साइट नहीं बना रहा हूं, और एक पर उच्च-स्तर पर इस कथन के साथ बहस करना कठिन है, लेकिन मैं इस तथ्य को नजरअंदाज नहीं कर सकता कि प्रत्येक वर्ष 10 से लाखों नए उपयोगकर्ता कंप्यूटिंग में आ रहे हैं और वे इन उपकरणों का उपयोग करेंगे और हम चाहते हैं कि वेब * * प्लेटफॉर्म हो कंटेंट और एप्स के चुनाव का विकल्प है कि हम rise of the meta platform खुश हैं।

हमें आने वाले लंबे समय तक प्रदर्शन पर जोर देते रहने की जरूरत है। हम डेवलपर्स को जल्दी से लोड करने में मदद करने के लिए उपकरण और मार्गदर्शन बनाते रहेंगे और उपयोगकर्ता इंटरफ़ेस को सुचारू बनाएंगे :)

Browser Bug Searcher

Paul Kinlan

मैं अभी कुछ work our team has done पर विचार कर रहा था और मुझे 2017 का एक प्रोजेक्ट मिला, जिसे रॉबर्ट निमन और एरिक बिडेलमैन ने बनाया। Browser Bug Searcher!

यह अविश्वसनीय है कि बस कुछ प्रमुख प्रेस के साथ आपको सभी प्रमुख ब्राउज़र इंजनों में अपनी पसंदीदा विशेषताओं का एक बड़ा अवलोकन है।

Source code available

यह वास्तव में उन मुद्दों में से एक को उजागर करता है जो मेरे पास crbug और webkit बग ट्रैकर्स के साथ हैं, उनके पास RSS जैसे प्रारूपों में डेटा का फीड प्राप्त करने का सरल तरीका नहीं है। मैं बग श्रेणियों आदि के साथ अपने topicdeck एग्रीगेटर का उपयोग करने में सक्षम होना पसंद topicdeck इसलिए मेरे पास उन सभी चीजों का एक डैशबोर्ड है, जिनकी मैं प्रत्येक बग ट्रैकर्स से नवीनतम जानकारी के आधार पर रुचि रखता हूं।

Github's Web Components

Paul Kinlan

मैं https://www.webcomponents.org/ पर एक त्वरित https://www.webcomponents.org/ संपादक की तलाश में https://www.webcomponents.org/ ताकि मैं इस ब्लॉग को पोस्ट करना आसान बना https://www.webcomponents.org/ और मैं github द्वारा घटकों के एक स्वच्छ सेट में ठोकर खाई।

मुझे पता था कि उनके पास काम करने का <time-element> लेकिन मुझे नहीं पता था कि उनके पास उपयोगी तत्वों का इतना अच्छा और सरल सेट है।

London from Kingscross

Paul Kinlan

आज थोड़े अच्छे लग रहे हैं।

Read More

The GDPR mess

Paul Kinlan

जिस तरह से हम (एक उद्योग के रूप में) जीडीपीआर सहमति को लागू करते हैं वह एक गड़बड़ है। मुझे यकीन नहीं है कि कोई भी 'केवल आवश्यक कुकीज़ का उपयोग करें' के अलावा कुछ और क्यों चुन सकता है, हालांकि मैं वास्तव में किसी भी विकल्प के विकल्प और व्यापार-बंद के बीच का अंतर नहीं बता सकता, न कि यह उल्लेख करने के लिए कि मैं केवल यह सत्यापित कर सकता हूं केवल आवश्यक कुकीज़ का उपयोग करना।

Read More

Brexit: History will judge us all

Paul Kinlan

इतिहास इस गड़बड़ पर हम सभी का न्याय करेगा, और मुझे उम्मीद है कि यह राष्ट्रवाद, स्व-हितों, औपनिवेशिक-पितृ, सेलिब्रिटी-बाफूनरी के प्रभावों पर सभी के लिए एक केस अध्ययन होगा।

Fuckers।

File Web Share Target

Paul Kinlan

मैंने अक्सर कहा है कि वेब एप्लिकेशन के लिए ऐप्स की दुनिया में प्रभावी रूप से प्रतिस्पर्धा करने के लिए, उन्हें उन सभी स्थानों पर एकीकृत करने की आवश्यकता होती है, जो उपयोगकर्ता ऐप्स के होने की उम्मीद करते हैं। इंटर-ऐप संचार वेब प्लेटफ़ॉर्म के प्रमुख लापता टुकड़ों में से एक है, और विशेष रूप से अंतिम प्रमुख लापता विशेषताओं में से एक देशी स्तर साझाकरण है: वेब ऐप्स को data out of their silo और अन्य वेब साइटों और ऐप्स में सक्षम होने की आवश्यकता है; उन्हें अन्य मूल ऐप्स और साइटों से डेटा प्राप्त करने में भी सक्षम होना चाहिए।

Read More

Testing-file-share-target-from-camera

Paul Kinlan

यह कैमरा ऐप से सीधे साझाकरण का परीक्षण कर रहा है। ऐसा लगता है कि यह काम किया :)

Read More

testing-file-share-target

Paul Kinlan

यह एंड्रॉइड पर शेयर लक्ष्य एपीआई की एक परीक्षा है और यह फाइलों को साझा करने की क्षमता है। अगर आप यहाँ कुछ देखते हैं, तो सब अच्छा है :)

Read More

Ricky Mondello: Adoption of Well-Known URL for Changing Passwords

Paul Kinlan

सफारी टीम पर रिकी मोंडेलो ने हाल ही में एक नोट साझा किया था कि ट्विटर कैसे ./well-ogn/change-password कल्पना का उपयोग कर रहा है।

I just noticed that Twitter has adopted the Well-Known URL for Changing Passwords! Is anyone aware of other sites that have adopted it?

Twitter’s implementation: https://twitter.com/.well-known/change-password; Github’s: https://github.com/.well-known/change-password; Specification :https://github.com/WICG/change-password-url

Read full post

फीचर ने मुझे पूरी तरह से पास कर दिया, लेकिन यह एक अच्छा विचार है: एक प्रसिद्ध स्थान पर एक फ़ाइल दी गई है, क्या ब्राउज़र उपयोगकर्ता को एक यूआई प्रदान कर सकता है जो उन्हें साइटों को जटिल यूआई नेविगेट करने के लिए बिना अपना पासवर्ड रीसेट करने की अनुमति देता है।

कल्पना भ्रामक रूप से सरल है: अच्छी तरह से ज्ञात फ़ाइल में उपयोगकर्ता को निर्देश देने के लिए URL होता है जब वे कार्रवाई करना चाहते हैं। यह मुझे सोच में ले जाता है, क्या हम इनमें से अधिक सुविधाएँ प्रदान कर सकते हैं:

  • GDPR- आधारित सहमति मॉडल (कुकी सहमति) के लिए एक प्रसिद्ध स्थान - साइट के मालिक उस पृष्ठ के लिए एक लिंक प्रदान कर सकते हैं जहाँ उपयोगकर्ता सभी कुकीज़ और अन्य डेटा सहमति आइटम को प्रबंधित और संभावित रूप से रद्द कर सकता है।
  • ब्राउज़र अनुमति प्रबंधन के लिए एक प्रसिद्ध स्थान - साइट के मालिक उपयोगकर्ताओं को जियो-लोकेशन, नोटिफिकेशन और अन्य प्राइमेटिक्स जैसी चीजों के लिए अनुमति देने में सक्षम होने के लिए एक त्वरित स्थान दे सकते हैं।
  • खाता हटाने और परिवर्तनों के लिए एक प्रसिद्ध मार्ग
  • मेल सदस्यता सूची प्रबंधन के लिए एक प्रसिद्ध मार्ग

सूची आगे बढ़ती है …. मुझे वास्तव में उपयोगकर्ताओं को सामान्य उपयोगकर्ता कार्यों की खोज करने में मदद करने के लिए सरल पुनर्निर्देशित फ़ाइलों के लिए विचार पसंद है, और ब्राउज़र के लिए एक तरह से इसे सतह के लिए।

pinch-zoom-element

Paul Kinlan

जेक और टीम ने ब्राउजर के खुद के पिंच-ज़ूम डायनामिक्स (मोबाइल व्यूपोर्ट जूमिंग के बारे में सोचें) के बाहर HTML के किसी भी सेट पर चुटकी जूमिंग को प्रबंधित करने के लिए यह बल्कि भयानक कस्टम तत्व बनाया। तत्व उन केंद्रीय घटकों में से एक था, जिन्हें हमें Chrome देव शिखर सम्मेलन में बनाए गए और जारी किए गए squoosh ऐप के लिए आवश्यक था … (मैं कहता हूं कि 'क्रोम देव शिखर सम्मेलन में रिलीज़' - जेक चीन के Google डेवलपर दिवस पर सभी को दिखा रहा था भले ही टीम के बाकी सदस्य शर्मिंदा थे;) …)

install: npm install --save-dev pinch-zoom-element

<pinch-zoom>
  <h1>Hello!</h1>
</pinch-zoom>

Read full post

मैंने अभी इसे अपने ब्लॉग में जोड़ा है (बस कुछ ही मिनटों में), आप इसे मेरे ' life ' अनुभाग पर देख सकते हैं, जहाँ मैंने अपने द्वारा लिए गए फ़ोटो साझा किए हैं। यदि आप एक टच-सक्षम डिवाइस पर हैं, तो आप जल्दी से तत्व पर चुटकी-ज़ूम कर सकते हैं, यदि आप एक ट्रैक-पैड का उपयोग कर रहे हैं जो कई उंगली इनपुट को संभाल सकता है जो काम भी करता है।

यह तत्व उपयोगकर्ता-इंटरफ़ेस घटकों को बनाने के लिए एक मॉडल के रूप में वेब घटकों से प्यार क्यों करता है, इसका एक बड़ा उदाहरण है। pinch-zoom तत्व तार पर 3kb (असम्पीडित) और निर्माण के लिए न्यूनतम निर्भरता के अंतर्गत है और यह सिर्फ एक काम करता है असाधारण रूप से अच्छी तरह से, किसी भी कस्टम अनुप्रयोग-स्तरीय तर्क को बांधने के बिना जो इसे उपयोग करना कठिन बना देगा (मुझे यूआई तर्क पर कुछ विचार हैं बनाम ऐप लॉजिक घटक जिन्हें मैं अपने सीखने के आधार पर स्क्वॉश ऐप से साझा करूंगा)।

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