मोबाइल पर वीडियो म्यूट करके अपने-आप वीडियो चलने की सुविधा - कैनवस हैक और ऐनिमेशन वाले GIF से छुटकारा पाएं!

Android के लिए Chrome के 53 वर्शन से, वीडियो के लिए म्यूट करके अपने-आप चलने की सुविधा काम करती है. अगर autoplay और muted, दोनों सेट हैं, तो वीडियो एलिमेंट दिखने पर वह अपने-आप चलने लगेगा. साथ ही, म्यूट किए गए वीडियो को play() की मदद से चलाया जा सकता है. पहले, मोबाइल पर वीडियो चलाने के लिए, उपयोगकर्ता के जेस्चर का इस्तेमाल करना पड़ता था. भले ही, वीडियो म्यूट न हो.

<video playsinline autoplay muted>
    <source src="video.webm" type="video/webm" />
    <source src="video.mp4" type="video/mp4" />
</video>

इस सैंपल पर जाकर, इसे काम करते हुए देखा जा सकता है. muted वीडियो, Chrome 53 या उसके बाद के वर्शन में अपने-आप चलने लगता है.

वीडियो प्लेयर का स्क्रीनशॉट.

इसके अलावा, म्यूट किए गए वीडियो को अब play() तरीके से भी शुरू किया जा सकता है. पहले, play() सिर्फ़ तब वीडियो चलाता था, जब उपयोगकर्ता ने बटन पर क्लिक किया हो या कोई अन्य जेस्चर किया हो. Android पर इन दो डेमो की तुलना करें — पहले उन्हें Chrome 53 पर आज़माएं, फिर किसी पुराने वर्शन पर:

हमारा सुझाव है कि जब भी हो सके, autoplay एट्रिब्यूट का इस्तेमाल करें. साथ ही, ज़रूरत पड़ने पर ही play() तरीके का इस्तेमाल करें.

click जैसे उपयोगकर्ता के जेस्चर के जवाब में, प्रोग्राम के हिसाब से वीडियो को अनम्यूट किया जा सकता है. हालांकि, अगर उपयोगकर्ता के जेस्चर के बिना प्रोग्राम के हिसाब से वीडियो को अनम्यूट करने की कोशिश की जाती है, तो वीडियो चलना बंद हो जाएगा.

muted autoplay बदलाव से, DOM में नहीं बनाए गए video एलिमेंट के साथ play() का इस्तेमाल भी किया जा सकेगा, जैसे कि WebGL प्लेबैक को चलाने के लिए.

play() तरीका, एक प्रॉमिस भी दिखाता है. इसका इस्तेमाल करके, यह देखा जा सकता है कि म्यूट किया गया प्रोग्रामैटिक वीडियो चलाने की सुविधा चालू है या नहीं. इसका एक उदाहरण simpl.info/video/scripted पर दिया गया है.

यह बदलाव क्यों किया जा रहा है?

Android पर, Chrome के पिछले वर्शन में, वीडियो के अपने-आप चलने की सुविधा बंद कर दी गई थी. ऐसा इसलिए, क्योंकि इससे गेम में रुकावट आ सकती है और आपको डेटा की ज़रूरत पड़ सकती है. साथ ही, हो सकता है कि कई लोगों को यह पसंद न हो.

वीडियो अपने-आप चलने की सुविधा बंद करने से, डेवलपर को एनिमेटेड GIF के साथ-साथ <canvas> और <img> हैक जैसे विकल्पों का इस्तेमाल करने के लिए मजबूर होना पड़ा. बिजली की खपत, परफ़ॉर्मेंस, बैंडविड्थ की ज़रूरतों, डेटा की लागत, और मेमोरी के इस्तेमाल के मामले में, ये तकनीकें ऑप्टिमाइज़ किए गए वीडियो से काफ़ी खराब हैं. वीडियो, ऐनिमेशन वाले GIF की तुलना में बेहतर क्वालिटी में दिख सकता है. साथ ही, वीडियो का साइज़ भी GIF के मुकाबले काफ़ी कम होता है. औसतन, वीडियो का साइज़ GIF के साइज़ से 10 गुना और ज़्यादा से ज़्यादा 100 गुना कम हो सकता है. JavaScript में वीडियो को डिकोड करना संभव है, लेकिन इससे बैटरी की खपत बहुत ज़्यादा होती है.

इन दोनों की तुलना करें — पहला एक वीडियो है और दूसरा ऐनिमेट किया गया GIF:

वीडियो क्लिप चल रही है.

दोनों एक जैसे दिखते हैं, लेकिन वीडियो का साइज़ 200 केबी से कम है और ऐनिमेशन वाला GIF 900 केबी से ज़्यादा का है.

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

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

ज़्यादा जानकारी

  • सुलभता के लिहाज़ से, वीडियो के अपने-आप चलने की सुविधा से खास तौर पर कोई समस्या हो सकती है. Android पर Chrome 53 और उसके बाद के वर्शन में, वीडियो अपने-आप चलने की सुविधा को पूरी तरह से बंद करने की सेटिंग उपलब्ध है: मीडिया सेटिंग में जाकर, वीडियो अपने-आप चलने की सुविधा चुनें.
  • इस बदलाव का audio एलिमेंट पर कोई असर नहीं पड़ेगा: Android पर Chrome में, वीडियो अपने-आप चलने की सुविधा अब भी बंद है. ऐसा इसलिए है, क्योंकि ऑडियो के लिए म्यूट करके वीडियो अपने-आप चलने की सुविधा का कोई मतलब नहीं है.
  • डेटा बचाने वाला मोड चालू होने पर, वीडियो अपने-आप नहीं चलता. अगर डेटा बचाने वाला मोड चालू है, तो मीडिया सेटिंग में जाकर, वीडियो अपने-आप चलने की सुविधा बंद हो जाती है.
  • म्यूट करके वीडियो अपने-आप चलने की सुविधा, किसी भी दस्तावेज़, iframe या अन्य जगहों पर दिखने वाले किसी भी वीडियो एलिमेंट के लिए काम करेगी.
  • याद रखें कि इस नई सुविधा का फ़ायदा पाने के लिए, आपको muted के साथ-साथ autoplay को भी जोड़ना होगा: simpl.info/video की तुलना simpl.info/video/muted से तुलना करें.

सहायता

  • iOS 10 और उसके बाद के वर्शन पर, Safari में वीडियो अपने-आप चलने की सुविधा, म्यूट करके इस्तेमाल की जा सकती है.
  • Android पर Firefox और UC ब्राउज़र के ज़रिए, ऑटोप्ले की सुविधा पहले से ही मौजूद है. भले ही, उसे म्यूट किया गया हो या न किया गया हो. ये अपने-आप चलने की किसी भी सुविधा को ब्लॉक नहीं करती.

ज़्यादा जानें