Chrome 49 में API को बंद करना और हटाना

हमें Chrome के करीब-करीब सभी वर्शन में प्रॉडक्ट, उसकी परफ़ॉर्मेंस, और वेब प्लैटफ़ॉर्म की क्षमताओं में अहम अपडेट और सुधार देखने को मिले हैं.

Chrome 49 (बीटा 2 फ़रवरी, 2016) में. स्थिर होने का अनुमानित तारीख: मार्च 2016) Chrome में कई बदलाव किए गए हैं

getComputedStyle(e.cssX) में "css" प्रीफ़िक्स का इस्तेमाल रोक दिया गया है

TL;DR: getComputedStyle(e) में "css" प्रीफ़िक्स का इस्तेमाल रोक दिया गया है, क्योंकि यह औपचारिक spec का हिस्सा नहीं था.

• हटाने का इरादा
• Chromestatus ट्रैकर
• CRBug की समस्या

getComputedStyle एक बेहतरीन छोटा फ़ंक्शन है. यह, डीओएम एलिमेंट के स्टाइल के सभी सीएसएस वैल्यू दिखाएगा, क्योंकि वे रेंडरिंग इंजन ने कंप्यूट किए हैं. उदाहरण के लिए, आप getComputedStyle(_someElement_).height चला सकते हैं और हो सकता है कि यह 224.1px दिखाए, क्योंकि यह एलिमेंट की ऊंचाई है, जो फ़िलहाल दिख रही है.

यह एक आसान एपीआई है. तो हम क्या बदलाव कर रहे हैं?

Chrome के रेंडरिंग इंजन को Blink में बदलने से पहले, यह WebKit के साथ काम करता था और इसने आपको प्रॉपर्टी की शुरुआत में "css" लगाने की सुविधा दी थी. उदाहरण के लिए, getComputedStyle(e).height के बजाय getComputedStyle(e).cssHeight. दोनों वही डेटा दिखाएंगे जो उन्हें एक जैसे बुनियादी वैल्यू पर मैप करते हैं, लेकिन "css" प्रीफ़िक्स का इस्तेमाल हो रहा है जो स्टैंडर्ड नहीं है. इसलिए, इसे अब सेवा में नहीं रखा गया है और हटा दिया गया है.

ध्यान दें - cssFloat एक स्टैंडर्ड प्रॉपर्टी है और इस पर इस सुविधा को बंद करने का कोई असर नहीं पड़ता है.

अगर आप Chrome 49 में किसी प्रॉपर्टी को इस तरह ऐक्सेस करते हैं, तो यह undefined दिखाएगा और आपको अपना कोड ठीक करना होगा.

initTouchEvent का इस्तेमाल बंद कर दिया गया है

कम शब्दों में लिखें: initTouchEvent की जगह अब TouchEvent constructor की सुविधा दी जाती है, ताकि निर्देशों को बेहतर बनाया जा सके. इसे Chrome 54 में हटा दिया जाएगा.

हटाएं Chromestatus Tracker CRBug से जुड़ी समस्या

लंबे समय से आप initTouchEvent एपीआई का इस्तेमाल करके, Chrome में सिंथेटिक टच इवेंट बना रहे हैं. इनका इस्तेमाल अक्सर, आपकी साइट के कुछ यूज़र इंटरफ़ेस (यूआई) की जांच करने या उसे ऑटोमेट करने के लिए, टच इवेंट को सिम्युलेट करने के लिए किया जाता है. Chrome 49 में, हमने इस एपीआई को बंद कर दिया है. साथ ही, इसे Chrome 53 से पूरी तरह हटाने के इरादे से, नीचे दी गई चेतावनी दिखाएंगे.

यह बदलाव अच्छा क्यों है, इसकी कई वजहें हो सकती हैं. यह टच इवेंट स्पेसिफ़िकेशन में भी नहीं है. Chrome पर initTouchEvent को लागू करना, Safari के initTouchEvent API के साथ किसी भी तरह से काम नहीं करता था. साथ ही, वह Android के Firefox से अलग था. TouchEvent कंस्ट्रक्टर को इस्तेमाल करना बहुत आसान है.

यह फ़ैसला लिया गया कि हम किसी ऐसे एपीआई को बनाए रखने के बजाय स्पेसिफ़िकेशन का पालन करेंगे जो न तो खास तौर पर बताया गया है और न ही किसी अन्य एपीआई के साथ काम करता है. इसलिए, हम सबसे पहले initTouchEvent फ़ंक्शन को रोक रहे हैं और फिर हटा रहे हैं. साथ ही, डेवलपर को TouchEvent कंस्ट्रक्टर का इस्तेमाल करना होगा.

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

iOS और Android/Chrome, दोनों में initTouchEvent API लागू करने का तरीका काफ़ी अलग-अलग था. इसलिए, आपके पास अक्सर साथ-साथ कुछ कोड भी होते थे (अक्सर, Firefox को भूल जाते हैं)

    var event = document.createEvent('TouchEvent');
    
    if(ua === 'Android') {
      event.initTouchEvent(touchItem, touchItem, touchItem, "touchstart", window,
        300, 300, 200, 200, false, false, false, false);
    } else {
      event.initTouchEvent("touchstart", false, false, window, 0, 300, 300, 200,
        200, false, false, false, false, touches, targetTouches, changedTouches, 0, 0);
    }
    
    document.body.dispatchEvent(touchEvent);

पहली बात, यह ठीक नहीं है, क्योंकि उपयोगकर्ता-एजेंट में "Android" लिखा हुआ है और Android पर Chrome इससे मेल खाएगा और इस सुविधा को बंद कर देगा. इसे अभी हटाया नहीं जा सकता, क्योंकि Android पर कुछ समय के लिए अन्य WebKit और पुराने Blink आधारित ब्राउज़र होंगे इसलिए, आपको अब भी पुराने एपीआई की सुविधा देनी होगी.

वेब पर TouchEvents को सही तरीके से मैनेज करने के लिए, आपको Firefox, IE Edge, और Chrome पर काम करने वाले कोड को बदलना होगा. इसके लिए, window ऑब्जेक्ट पर TouchEvent की मौजूदगी की जांच करें. अगर कोड की वैल्यू "लंबा" है, तो आपको इसका इस्तेमाल करना चाहिए.

    if('TouchEvent' in window && TouchEvent.length > 0) {
      var touch = new Touch({
        identifier: 42,
        target: document.body,
        clientX: 200,
        clientY: 200,
        screenX: 300,
        screenY: 300,
        pageX: 200,
        pageY: 200,
        radiusX: 5,
        radiusY: 5
      });
    
      event = new TouchEvent("touchstart", {
        cancelable: true,
        bubbles: true,
        touches: [touch],
        targetTouches: [touch],
        changedTouches: [touch]
      });
    }
    else {
      event = document.createEvent('TouchEvent');
    
      if(ua === 'Android') {
        event.initTouchEvent(touchItem, touchItem, touchItem, "touchstart", window,
          300, 300, 200, 200, false, false, false, false);
      } else {
        event.initTouchEvent("touchstart", false, false, window, 0, 300, 300, 200,
          200, false, false, false, false, touches, targetTouches, 
          changedTouches, 0, 0);
      }
    }
    
    document.body.dispatchEvent(touchEvent);

RTCPeerConnection विधियों में ज़रूरी गड़बड़ी और सफलता हैंडलर

बहुत ज़्यादा शब्द हैं, पढ़ा नहीं गया: WebRTC RTCPeerConnection के तरीकों createOffer() और createAnswer() को अब गड़बड़ी हैंडलर के साथ-साथ सक्सेस हैंडलर की भी ज़रूरत होगी. पहले, इन तरीकों को सिर्फ़ एक सक्सेस हैंडलर से कॉल किया जा सकता था. इसका इस्तेमाल रोक दिया गया है.

हमने Chrome 49 में, एक चेतावनी भी जोड़ी है. ऐसा तब किया जाता है, जब setLocalDescription() या setRemoteDescription() कोई गड़बड़ी हैंडलर दिए बिना कॉल किया जाता है. हम Chrome 50 में इन तरीकों के लिए, गड़बड़ी हैंडलर को ज़रूरी बनाने की उम्मीद करते हैं.

यह WebRTC की खास जानकारी के मुताबिक, इन तरीकों से वादों को पेश करने के तरीके को मंज़ूरी देने का एक हिस्सा है.

यहां WebRTC के RTCPeerConnection डेमो का उदाहरण दिया गया है (main.js, लाइन 126):

    function onCreateOfferSuccess(desc) {
      pc1.setLocalDescription(desc, function() {
         onSetLocalSuccess(pc1);
      }, onSetSessionDescriptionError);
      pc2.setRemoteDescription(desc, function() {
        onSetRemoteSuccess(pc2);
      }, onSetSessionDescriptionError);
      pc2.createAnswer(onCreateAnswerSuccess, onCreateSessionDescriptionError);
    }

ध्यान दें कि setLocalDescription() और setRemoteDescription(), दोनों में हमेशा एक गड़बड़ी हैंडलर पैरामीटर होता था. इसलिए, सिर्फ़ उस पैरामीटर के बारे में बताना एक सुरक्षित बदलाव है.

आम तौर पर, WebRTC के प्रोडक्शन ऐप्लिकेशन के लिए, हमारा सुझाव है कि आप adapter.js का इस्तेमाल करें. यह एक शिम है, जो WebRTC प्रोजेक्ट मैनेज करता है. इससे ऐप्लिकेशन में खास बदलावों और प्रीफ़िक्स के अंतर को समझने में मदद मिलती है.

Docs.defaultCharset अब काम नहीं करता

बहुत ज़्यादा शब्द हैं, पढ़ा नहीं गया: Document.defaultCharset को बेहतर बनाने के लिए, अब इसे बंद कर दिया गया है.

हटाएं Chromestatus Tracker CRBug से जुड़ी समस्या

Document.defaultCharset एक रीड-ओनली प्रॉपर्टी है, जो उपयोगकर्ता के सिस्टम की रीजनल सेटिंग के आधार पर, डिफ़ॉल्ट कैरेक्टर एन्कोडिंग को दिखाती है. एचटीटीपी रिस्पॉन्स में या पेज में एम्बेड किए गए मेटा टैग में, ब्राउज़र जिस तरीके से कैरेक्टर एन्कोडिंग की जानकारी का इस्तेमाल करते हैं उस तरीके की वजह से, इस वैल्यू को बनाए रखना फ़ायदेमंद नहीं पाया जाता.

document.characterSet का इस्तेमाल करने से आपको एचटीटीपी हेडर में बताया गया पहला मान मिलेगा. अगर यह मौजूद नहीं है, तो आपको <meta> एलिमेंट के charset एट्रिब्यूट में दी गई वैल्यू मिलेगी, जैसे कि <meta charset="utf-8">. अगर इनमें से कोई भी वैल्यू उपलब्ध नहीं होती, तो document.characterSet, उपयोगकर्ता की सिस्टम सेटिंग होगी.

Gecko ने इस प्रॉपर्टी के साथ काम नहीं किया है और यह साफ़ तौर पर नहीं बताई गई है. इसलिए, इस प्रॉपर्टी को Chrome 49 (जनवरी 2016 में बीटा वर्शन) में Blink से हटा दिया जाएगा. यह चेतावनी आपके कंसोल में तब तक दिखेगी, जब तक कि Chrome 50 में प्रॉपर्टी को हटा नहीं दिया जाता:

इसे न बताने की वजह के बारे में ज़्यादा जानकारी GitHub पर मिल सकती है https://github.com/whatwg/dom/issues/58

getStorageअपडेट() को हटाया गया

बहुत ज़्यादा शब्द हैं, पढ़ा नहीं गया: Navigator.getStorageUpdates() को हटा दिया गया है, क्योंकि अब यह नेविगेशन की खास जानकारी में मौजूद नहीं है.

हटाएं Chromestatus Tracker CRBug से जुड़ी समस्या

अगर इससे किसी पर असर पड़ा, तो मैं अपनी हैट पहनूंगा. getStorageUpdates() का वेब पर शायद ही कभी (अगर है तो भी) इस्तेमाल किया गया हो.

HTML5 स्पेसिफ़िकेशन के (बहुत पुराने वर्शन) को कोट करने के लिए:

है न? यहां तक कि नियम में "कब" शब्द का इस्तेमाल हुआ है (यहां बताए गए नियम में सिर्फ़ खुशी का मामला है). खास जानकारी के लेवल पर, एक StorageMutex था जो localStorage और कुकी जैसे स्टोरेज को ब्लॉक करने के ऐक्सेस को कंट्रोल करता था. यह एपीआई उस म्यूटेक्स को मुफ़्त में करने में मदद करेगा, ताकि इस StorageMutex से अन्य स्क्रिप्ट ब्लॉक न हों. हालांकि, इसे कभी लागू नहीं किया गया. IE या Gecko में यह काम नहीं करता है. साथ ही, WebKit का और इस तरह Blink का इस्तेमाल नहीं किया जा सकता.

यह काफ़ी समय से तकनीकी जानकारी से हटा दिया गया है और Blink से पूरी तरह से हटा दिया गया है. लंबे समय से यह इस्तेमाल के लिए तैयार नहीं है और कॉल करने पर भी कुछ नहीं किया गया है.

अगर आपके पास navigator.getStorageUpdates() नाम का कोड है, जिसकी संभावना नहीं है, तो आपको कॉल करने से पहले फ़ंक्शन की मौजूदगी की जांच करनी होगी.

Object.observe() अब काम नहीं करता

बहुत ज़्यादा शब्द हैं, पढ़ा नहीं गया: Object.observe() को बंद कर दिया गया है, क्योंकि यह अब स्टैंडर्ड तय करने के ट्रैक पर नहीं है. इसे आने वाले वर्शन में हटा दिया जाएगा.

हटाएं Chromestatus Tracker CRBug से जुड़ी समस्या

नवंबर 2015 में, यह एलान किया गया था कि Object.Observe को TC39 से हटा लिया गया है. इसे Chrome 49 से रोक दिया गया है और अगर आप इसका इस्तेमाल करने की कोशिश करेंगे, तो आपको कंसोल में यह चेतावनी दिखेगी:

कई डेवलपर को यह एपीआई पसंद आया और अगर आपने इसके साथ एक्सपेरिमेंट किया है और अब आपको ट्रांज़िशन पाथ चाहिए, तो पॉलीफ़िल का इस्तेमाल करें. जैसे, MaxArt2501/object-observe या polymer/observe-js जैसी रैपर लाइब्रेरी.