AVIF बनाम WebP — छोटी फ़ाइल हमेशा सही फ़ाइल नहीं होती
Dov Azencot
@DovAzencotएक बार मैंने एक शर्मिंदा कर देने वाली पूरी शाम एक ही हीरो इमेज को WebP और AVIF के रूप में A/B करते हुए बिता दी, दो ब्राउज़र टैब के बीच पलटते हुए, ऐसा फ़र्क़ पकड़ने की कोशिश में जो मेरी आँखें सचमुच देख पातीं। AVIF 31% छोटी थी। मैं दोनों में अंतर नहीं बता पाया। मैं वहाँ बैठा ऐसा महसूस कर रहा था मानो मुफ़्त का पैसा मिल गया हो — और फिर मैंने 200 इमेज के एक फ़ोल्डर पर पूरा बैच चलाया और वो पेच याद आ गया।
AVIF ज़्यादातर मौक़ों पर छोटी फ़ाइल होती है। यह बात सच है और जानने लायक है। पर "छोटी" स्प्रेडशीट का बस एक कॉलम है, और असली फ़ैसला बाक़ी कॉलम में रहता है।
AVIF कहाँ जीतता है
AVIF, AV1 वीडियो कोडेक पर बना है, और यह WebP से सचमुच नया, ज़्यादा चतुर डिज़ाइन है। फ़ोटोग्राफ़िक कंटेंट पर यह मिलती-जुलती विज़ुअल क्वालिटी पर आमतौर पर WebP से 15–30% छोटा उतरता है। यह मुलायम ग्रेडिएंट — आसमान, त्वचा, हल्की परछाइयाँ — को उन खानेदार आर्टिफ़ैक्ट के बिना संभालता है जो पुराने कोडेक उन पर पोत देते हैं। यह HDR और वाइड कलर गैमट को सपोर्ट करता है, जो WebP नहीं करता। यह WebP की ही तरह पूरा अल्फा चैनल बनाए रखता है।
जिस फ़ोल्डर का ज़िक्र किया, उसके कुछ मोटे-मोटे आँकड़े, सब एक ऐसी क्वालिटी सेटिंग पर जहाँ मुझे कोई फ़र्क़ नज़र नहीं आया:
| सोर्स | WebP | AVIF |
|---|---|---|
| एक हीरो फ़ोटो — 3.1 MB PNG | ~360 KB | ~250 KB |
| एक प्रोडक्ट शॉट — 1.4 MB JPG | ~180 KB | ~140 KB |
| एक सपाट UI इलस्ट्रेशन | ~28 KB | ~30 KB |
उस आख़िरी पंक्ति को फिर देखिए। सपाट, सादे ग्राफ़िक्स पर AVIF कभी-कभी बड़ा निकल आता है। इसकी चतुराई फ़ोटोग्राफ़िक जटिलता के लिए ट्यून की गई है, और दो-रंग के इलस्ट्रेशन में इसके चबाने को कुछ होता ही नहीं। वहाँ WebP, या PNG भी, जीत सकता है।
AVIF आपसे क्या क़ीमत लेता है
साइज़ की जीत मुफ़्त नहीं है। दो असली दाम:
एनकोड समय। AVIF को कंप्रेस करना बहुत धीमा है। एक ही इमेज पर, एक AVIF एनकोड किसी WebP से कई गुना ज़्यादा समय ले सकता है — कभी-कभी यह "तुरंत" और "हर फ़ाइल पर एक-दो सेकंड रुको" के बीच का फ़र्क़ होता है। एक हीरो इमेज के लिए किसे परवाह। पर 200 के बैच के लिए आप हर सेकंड महसूस करते हैं। WebP इतनी तेज़ी से एनकोड होता है कि वह क़रीब-क़रीब मुफ़्त है।
डिकोड और सपोर्ट। जिन ब्राउज़रों को लोग सचमुच इस्तेमाल करते हैं वे सब अब AVIF डिकोड करते हैं — Chrome 2020 से, Firefox उसके कुछ ही बाद, Safari 2022 के आख़िर में वर्शन 16 से। 2026 में यह असली ट्रैफ़िक के बड़े हिस्से को समेट लेता है। पर "सपोर्टेड" और "सर्वव्यापी" एक ही शब्द नहीं हैं। WebP के पीछे कुछ और साल की संतृप्ति है, और यह कम ताक़त वाले फ़ोन पर तेज़ी से डिकोड होता है, जहाँ AV1 डिकोडिंग सचमुच ध्यान देने लायक बैटरी और CPU खा सकती है। कुछ ईमेल क्लाइंट और पुराने एम्बेडेड webview आज भी AVIF को बिल्कुल नहीं छूते।
20% वाला सवाल
तो असली फ़ैसला इस पर आकर टिकता है: क्या इस इमेज के लिए, इस जगह पर, वह अतिरिक्त ~20% मायने रखता है?
किसी लैंडिंग पेज पर एक बड़ी हीरो इमेज के लिए — वह एक भारी एसेट जिसे हर विज़िटर डाउनलोड करता है — हाँ। जो चीज़ आपके पहले पेंट को रोक रही है उसमें से 100 KB छाँट देना, एक बार भरी जाने वाली धीमी एनकोड के लायक है। AVIF के लिए मुझे मालूम सबसे साफ़ मामला यही है।
किसी थंबनेल ग्रिड, ब्लॉग के इनलाइन स्क्रीनशॉट, या ऐसी किसी भी चीज़ के लिए जो WebP के रूप में पहले ही क़रीब 50 KB से कम है, जवाब आमतौर पर ना है। एक छोटी संख्या का बीस प्रतिशत और छोटी संख्या ही होती है। आपने एनकोड समय और थोड़ी-सी संगतता कुर्बान कर दी उन बाइट को बचाने के लिए जिनका किसी को इंतज़ार ही नहीं था। वहाँ WebP ज़्यादा शांत डिफ़ॉल्ट है।
मैं कब AVIF की झंझट नहीं पालता
अगर कोई फ़ाइल किसी आधुनिक ब्राउज़र के बाहर कहीं जा रही है — एक ईमेल न्यूज़लेटर, कोई पुराना CMS, किसी पार्टनर का सिस्टम जो मेरे बस में नहीं — तो मैं AVIF पर दाँव नहीं लगाता। मैं WebP इस्तेमाल करता हूँ, या ज़ीरो रिस्क चाहिए तो सादी JPG। जो सबसे छोटी फ़ाइल रेंडर ही न हो, उसकी क़ीमत कुछ भी नहीं।
और मैं सपाट ग्राफ़िक्स, लोगो या लाइन-आर्ट को AVIF में एनकोड नहीं करता। कोडेक इसके लिए बना ही नहीं है, और मैंने इसे इन चीज़ों पर WebP से इतनी बार हारते देखा है कि कोशिश करना छोड़ दिया।
मैं असल में फ़ैसला कैसे करता हूँ
मेरा ईमानदार तरीक़ा: भारी फ़ोटोग्राफ़िक सामान को मैं AVIF में कन्वर्ट करता हूँ और हल्के, सादे और चौतरफ़ा बँटने वाले सामान को WebP ही रहने देता हूँ। यह "एक फ़ॉर्मैट सब पर राज करे" वाली बात नहीं है। यह हर इमेज के हिसाब से चुनना है।
अगर आप ख़ुद यह तुलना आज़माना चाहें, तो दोनों यहीं आपके ब्राउज़र में चलते हैं — मौजूदा WebP एसेट को और निचोड़ने के लिए WebP से AVIF, और सीधे किसी मास्टर से जाने के लिए PNG से AVIF। कुछ भी कहीं अपलोड नहीं होता; एनकोड आपकी अपनी मशीन पर होता है, यही वजह भी है कि AVIF की सुस्ती आप ख़ुद महसूस करेंगे। यह कोई बग नहीं है। यह कोडेक है जो एक छोटी फ़ाइल के लिए ज़्यादा मेहनत कर रहा है, ठीक आपकी आँखों के सामने।
अपनी ही हीरो इमेज को दोनों से गुज़ारें। अगर आपको फ़र्क़ न दिखे और AVIF मायने रखने भर छोटी हो, तो आपका जवाब मिल गया। बस यह मत मान लीजिए कि अगली 200 फ़ाइलों के लिए भी जवाब यही होगा।
संबंधित लेख
PNG को WebP में क्यों बदलता हूँ (और वो एक मौका जब नहीं बदलता)
PNG में एडिट करना बढ़िया है, पर उसे वेब पर भेजना फ़िज़ूलख़र्ची है। WebP असल में कितना बचाता है, कहाँ कुछ नहीं बचाता, और वो एक नियम जो मैं कभी नहीं तोड़ता।
आपके स्क्रीनशॉट 2 MB के क्यों होते हैं, और उन्हें 60–90% कैसे छोटा करें
ज़्यादातर ख़ाली किसी डैशबोर्ड के स्क्रीनशॉट का 2 MB होना बनता ही नहीं। PNG आपके साथ ऐसा क्यों करता है, और WebP में बदलने से यह 60–90% कैसे घट जाता है, बिना कुछ दिखने वाला खोए।
सभी लेख