नेटवर्क में AVIF का इस्तेमाल कैसे किया जा रहा है, इस बारे में अपडेट.
AVIF एक नया इमेज फ़ॉर्मैट है, जो अपनी हाई कंप्रेशन रेट, बेहतर परफ़ॉर्मेंस, और बड़े पैमाने पर इस्तेमाल किए जाने की वजह से, वेब पर तेज़ी से लोकप्रिय हो रहा है. AVIF एक ओपन और रॉयल्टी-फ़्री इमेज फ़ॉर्मैट है, जो Alliance for Open Media के स्टैंडर्ड AV1 वीडियो कोडेक पर आधारित है. यह ब्लॉग पोस्ट इस बारे में खास जानकारी देगी कि नेटवर्क में AVIF का इस्तेमाल कैसे किया जाता है. साथ ही, स्टिल इमेज और ऐनिमेशन के लिए डेवलपर, AVIF से किस तरह की परफ़ॉर्मेंस और क्वालिटी के फ़ायदे की उम्मीद कर सकते हैं.
AVIF नेटवर्क में नया क्या है?
Chrome, Firefox, और Safari में AVIF का आना शुरू होने के बाद से, वेब पर AVIF का इस्तेमाल तेज़ी से बढ़ रहा है. फ़िलहाल, करीब सभी ब्राउज़र पर AVIF की सुविधा काम करती है.
सिर्फ़ Chrome में, Chrome के स्टेबल तरीके से AVIF की सुविधा जोड़ने के बाद, AVIF का इस्तेमाल करीब एक साल में करीब एक प्रतिशत तक बढ़ गया है.
Akamai, Cloudflare, Cloudinary, और Imgix जैसे कई इमेज सीडीएन, अब AVIF इमेज दिखा रहे हैं. AVIF सपोर्ट की घोषणा करने वाली ब्लॉग पोस्ट में, Imgix ने बताया है कि JPEG के मुकाबले फ़ाइल के साइज़ में 60% और WebP की तुलना में 35% की बचत हुई है. फ़ाइल के साइज़ की इस बचत से, आपके डिवाइस के स्टोरेज की काफ़ी बचत होती है. साथ ही, पेज तेज़ी से लोड होते हैं और सबसे बड़े एलिमेंट को रेंडर करने में लगने वाले समय की अवधि कम होती है. एलसीपी, वेबसाइट की परफ़ॉर्मेंस की अहम जानकारी देने वाली मेट्रिक में से एक है. इससे यह पता चलता है कि पेज पर, कॉन्टेंट का सबसे बड़ा ब्लॉक कितनी तेज़ी से लोड हुआ है. इमेज को कंप्रेस करने के लिए, मॉडर्न कोडेक का इस्तेमाल करना, एलसीपी को कम करने की मुख्य तकनीकों में से एक है. Lighthouse, Chrome डेवलपर के लिए बना एक बेहतरीन टूल है. इसकी मदद से, आपकी वेबसाइट की टेस्टिंग की जा सकती है. साथ ही, यह भी देखा जा सकता है कि AVIF से कितनी बचत होगी.
WordPress दुनिया का सबसे लोकप्रिय वेबसाइट प्लैटफ़ॉर्म है. डेवलपर अपनी इमेज को AVIF में बदलने के लिए ऐसे कई प्लगिन उपलब्ध हैं, जैसे:
ज़्यादा काम करने वाले डेवलपर के लिए, ImageMagick और FFmpeg जैसे टूल, शुरुआत करने का अच्छा तरीका हैं.
AVIF को कोड में बदलने की स्पीड
इमेज कंप्रेशन को बड़े पैमाने पर डिप्लॉय करने के लिए, तेज़ एन्कोडिंग की स्पीड और अच्छी विज़ुअल क्वालिटी ज़रूरी है. AVIF सॉफ़्टवेयर की एन्कोडिंग की स्पीड में पिछले दो सालों में काफ़ी सुधार हुआ है. दूसरे मॉडर्न इमेज फ़ॉर्मैट की तुलना में, AVIF एक जैसी विज़ुअल क्वालिटी वाली छोटी फ़ाइलें बनाता है. नीचे दिया गया ग्राफ़ देखें. नीचे दिया गया ग्राफ़ बेहतर है, लेकिन इसे एन्कोड करना भी तेज़ है.
नीचे दिया गया चार्ट (ज़्यादा बेहतर है) दिखाता है कि अन्य इमेज फ़ॉर्मैट की तुलना में AVIF एन्कोडिंग स्पीड कैसी है. WebP जैसे पिछली जनरेशन के कोडेक, कम जटिल (लेकिन कम असरदार) कंप्रेशन एल्गोरिदम से काम करते हैं. मल्टी-थ्रेड एन्कोडिंग स्कीम की मदद से, AVIF आम इस्तेमाल के उदाहरणों के लिए भी ऐसा ही परफ़ॉर्म करता है, जिससे कंप्रेशन फ़ायदा मिलता है.
जिन डेवलपर को कोड में बदलने की स्पीड और विज़ुअल क्वालिटी के बारे में ज़्यादा जानकारी चाहिए वे इमेज कोडिंग की तुलना वाली साइट पर, फिर से जनरेट किए जा सकने वाले मानदंड के नतीजे देख सकते हैं.
जहां AVIF और WebP जैसे आधुनिक इमेज कोडेक के लिए सॉफ़्टवेयर लागू करना, x86 और ARM प्रोसेसर आर्किटेक्चर के लिए ऑप्टिमाइज़ किया जाता है, वहीं बड़ी मात्रा में इमेज को कंप्रेस करना कंप्यूटेशन के हिसाब से महंगा हो सकता है. कंप्रेशन की लागत को कम करने का एक विकल्प यह है कि हार्डवेयर से तेज़ी लाने की प्रक्रिया एक्सप्लोर की जाए. bluedot ने एक हार्डवेयर Accelerated Pulser-AVIF एन्कोडर बनाया है जो प्रोग्राम किए जा सकने वाले FPGAs पर चल रहा है, जैसे कि AMD का Alveo U250. सॉफ़्टवेयर पर आधारित एवीफ़ेंक की तुलना में, Pulser-AVIF भी कंप्रेशन की क्षमता के साथ-साथ स्पीड में 7 से 23 गुना बढ़ोतरी करता है.
- टेस्ट सेट: Kodak (768x512 वाली 24 इमेज)
- 24 इमेज को एक साथ कोड में बदलना (24 प्रोसेस)
- सॉफ़्टवेयर को कोड में बदलने की हर प्रोसेस चार थ्रेड से चलती है. (-j 4)
डेवलपर, Azure NP-Series जैसी क्लाउड वर्चुअल मशीनों के साथ Pulser-AVIF एन्कोडर को डिप्लॉय कर सकते हैं.
रिस्पॉन्सिव वेब पेजों के लिए AVIF सुविधाएं
AVIF में कुछ दिलचस्प सुविधाएं हैं, जो ज़्यादा रिस्पॉन्सिव वेब पेज बनाने में मदद करेंगी. इस बार हम ऐनिमेशन वाले AVIF के बारे में बात करेंगे, जो वेब पर शानदार ऐनिमेशन डिलीवर करने का अब तक का सबसे असरदार तरीका है.
ऐनिमेशन वाला AVIF
ऐनिमेटेड GIF की उम्र 35 साल होने के बावजूद, ऐनिमेशन वाली इमेज के लिए अब भी लोकप्रिय फ़ॉर्मैट है. ऐनिमेशन वाले GIF की सबसे बड़ी कमी यह है कि यह सिर्फ़ 256 रंगों में काम करता है. साथ ही, इनकी वजह से फ़ाइलों का साइज़ कम होता है और उनका साइज़ बहुत कम होता है. साथ ही, इनका इस्तेमाल आसानी से किया जा सकता है. साथ ही, इनका रिज़ॉल्यूशन या फ़्रेम रेट भी कम हो जाता है. वहीं दूसरी ओर, ऐनिमेशन वाली AVIF कोडिंग, AV1 वीडियो कोडिंग स्कीम की तरह ही है. इसमें ऐनिमेट किए गए GIF के मुकाबले, फ़ाइल के साइज़ को काफ़ी कम किया जाता है.
हमने एक आसान मानदंड लागू किया है, जहां हमने ऐनिमेशन वाले GIF के सेट को AVIF और JPEG XL, दोनों के लिए एन्कोड किया है. टेस्ट सेट में, मूल GIF फ़ाइलों की तुलना में फ़ाइल के साइज़ की मीडियन बचत प्रतिशत करीब 86% और ऐनिमेटेड JPEG XL फ़ाइलों की तुलना में करीब 73% था*.
Chrome, Firefox, और Safari सभी फ़ॉर्मैट में, ऐनिमेशन वाले AVIF वीडियो चलाने की सुविधा काम करती है.
FFmpeg एक टूल है, जिसका इस्तेमाल ऐनिमेशन वाली AVIF फ़ाइलें बनाने के लिए किया जा सकता है. FFmpeg का इस्तेमाल करके GIF को AVIF में बदलने का बुनियादी उदाहरण यहां दिया गया है:
ffmpeg -i "$INPUT_GIF" -crf $CRF -b:v 0 "$OUTPUT.avif"
0 से 63 के स्केल पर $CRF आउटपुट क्वालिटी चाहिए. कम वैल्यू का मतलब है कि अच्छी क्वालिटी और ज़्यादा फ़ाइल साइज़. 0, लॉसलेस कंप्रेशन का इस्तेमाल करता है. छोटी ऐनिमेटेड AVIF फ़ाइलों के लिए, 23 की वैल्यू से शुरू करें.
FFmpeg, AVIF इमेज को कोड में बदलने के लिए डिफ़ॉल्ट रूप से libaom का इस्तेमाल करता है. हालांकि, rav1e या SVT-AV1 उपलब्ध होने पर, इसका इस्तेमाल भी किया जा सकता है. एन्कोडर के विकल्पों और स्पीड/क्वालिटी के लिए, एन्कोडिंग पैरामीटर को ट्यून करने के बारे में ज़्यादा जानकारी, FFmpeg की AV1 एन्कोडिंग गाइड में मिल सकती है.
इस्तेमाल का एक और उदाहरण, ओरिजनल फ़ाइल को फिर से एन्कोड किए बिना AV1 वीडियो को AVIF में बदलना है. यह मूल AV1 फ़ाइल को डिकोड/कोड करने के मुकाबले काफ़ी सस्ता है. इससे AV1 वीडियो, <img> एलिमेंट के साथ इस्तेमाल करने के लिए उपलब्ध हो जाता है. -c:v copy को FFmpeg में पास करके ऐसा किया जा सकता है.
ffmpeg -i "$INPUT_AV1_VIDEO" -c:v copy -an "$OUTPUT.avif"
मीटिंग में सामने आए नतीजे
लॉन्च के बाद से वेब पर AVIF का इस्तेमाल लगातार बढ़ रहा है और ब्राउज़र, इमेज CDN, WordPress प्लगिन, और एन्कोडिंग टूल के साथ यह बड़े पैमाने पर काम करता है. कुल मिलाकर, AVIF, वेब पर इमेज दिखाने के लिए एक बेहतरीन विकल्प है. अपनी वेबसाइट के लिए, AVIF सबसे अच्छी क्वालिटी या सबसे छोटा फ़ाइल साइज़ देते हुए, तेज़ी से एन्कोड और डिकोड करता है. AVIF, वेब पर ऐनिमेशन डिलीवर करने का सबसे असरदार तरीका है. अगर आपके पास कोई सवाल, टिप्पणियां या सुविधा का अनुरोध है, तो कृपया av1-discuss ईमेल पाने वाले लोगों की सूची, AOM Github कम्यूनिटी, और AVIF wiki पर संपर्क करें.