আরো প্রতিক্রিয়াশীল ওয়েবসাইটের জন্য AVIF স্থাপন করা হচ্ছে

বাস্তুতন্ত্রে AVIF কীভাবে গৃহীত হয়েছে তার একটি আপডেট।

জানি হুওপোনেন
Jani Huoponen
ভিগনেশ ভেঙ্কটসুব্রহ্মণ্যন
Vignesh Venkatasubramanian

AVIF হল একটি নতুন ইমেজ ফরম্যাট যা ওয়েবে দ্রুত জনপ্রিয়তা অর্জন করছে কারণ এর উচ্চ কম্প্রেশন রেট, দক্ষ কর্মক্ষমতা এবং ব্যাপক গ্রহণযোগ্যতা রয়েছে। AVIF হল একটি উন্মুক্ত, রয়্যালটি-মুক্ত ইমেজ ফরম্যাট যা AV1 ভিডিও কোডেক এর উপর ভিত্তি করে যা অ্যালায়েন্স ফর ওপেন মিডিয়া দ্বারা প্রমিত। এই ব্লগ পোস্টটি ইকোসিস্টেমে AVIF কীভাবে গৃহীত হয় এবং স্থির চিত্র এবং অ্যানিমেশনের জন্য বিকাশকারীরা AVIF থেকে কী ধরনের কর্মক্ষমতা এবং গুণমানের সুবিধা আশা করতে পারে তার একটি ওভারভিউ প্রদান করবে।

ক্রোম, ফায়ারফক্স এবং সাফারিতে AVIF প্রবর্তনের পর থেকে, ওয়েবে AVIF-এর ব্যবহার ক্রমাগত বৃদ্ধি পাচ্ছে; প্রায় সব ব্রাউজার আজ AVIF সমর্থন করে।

শুধুমাত্র ক্রোমেই, ক্রোম স্থিতিশীল অবস্থায় AVIF সমর্থন যোগ করার পর এক বছরের অল্প সময়ের মধ্যে AVIF ব্যবহার প্রায় এক শতাংশে বেড়েছে।

মে 2021 থেকে মার্চ 2023 পর্যন্ত Chrome-এ AVIF ব্যবহারের একটি লাইন গ্রাফ। সমর্থন ক্রমাগতভাবে 0% থেকে বেড়ে 1.4%-এর নিচে হয়েছে।

আকামাই , ক্লাউডফ্লেয়ার , ক্লাউডিনারি এবং ইমজিক্সের মতো বেশ কয়েকটি ইমেজ সিডিএন আজ AVIF ছবি পরিবেশন করছে। AVIF সমর্থন ঘোষণা করে একটি ব্লগ পোস্টে , Imgix JPEG-এর তুলনায় 60% ফাইল আকার সঞ্চয় এবং WebP-এর তুলনায় 35% সঞ্চয়ের কথা জানিয়েছে। এই ফাইলের আকারের সঞ্চয়গুলি উল্লেখযোগ্য সঞ্চয় সঞ্চয়ের দিকে পরিচালিত করে, তবে পৃষ্ঠাগুলিকে দ্রুত লোড করতে সাহায্য করে, যা দ্রুততর বৃহত্তম সামগ্রীপূর্ণ পেইন্ট (LCP) বার দেয়৷ LCP হল অন্যতম প্রধান ওয়েব ভাইটাল , এবং পৃষ্ঠার কন্টেন্টের বৃহত্তম ব্লক কত দ্রুত লোড হয়েছে তা উপস্থাপন করে। ইমেজ কম্প্রেস করার জন্য আধুনিক কোডেক ব্যবহার করা হল LCP কমানোর অন্যতম প্রধান কৌশল । আপনার ওয়েব সাইট পরীক্ষা করার জন্য এবং AVIF কতটা সঞ্চয় আনবে তা দেখার জন্য Lighthouse হল একটি দুর্দান্ত Chrome ডেভেলপার টুল।

ওয়ার্ডপ্রেস হল বিশ্বের সবচেয়ে জনপ্রিয় ওয়েবসাইট প্ল্যাটফর্ম, এবং ডেভেলপারদের তাদের ছবি AVIF-এ রূপান্তর করার জন্য অনেক প্লাগইন উপলব্ধ রয়েছে, যেমন:

আরও হ্যান্ড-অন ডেভেলপারদের জন্য, ImageMagick এবং FFmpeg- এর মতো টুলগুলি একটি ভাল সূচনা পয়েন্ট।

AVIF এনকোড গতি

দ্রুত এনকোডিং গতি এবং উচ্চ ভিজ্যুয়াল গুণমান স্কেলে চিত্র সংকোচন স্থাপনের জন্য গুরুত্বপূর্ণ। AVIF সফ্টওয়্যার এনকোডিং গতি গত দুই বছরে উল্লেখযোগ্যভাবে উন্নত হয়েছে। অন্যান্য আধুনিক স্টিল ইমেজ ফরম্যাটের তুলনায়, AVIF অনুরূপ ভিজ্যুয়াল মানের সাথে ছোট ফাইল তৈরি করে (নিম্নলিখিত গ্রাফটি দেখুন, কমটি ভাল) কিন্তু এনকোড করাও দ্রুত

TurboJPEG-এর আউটপুটের শতাংশ হিসাবে বিভিন্ন ইমেজ কোডেক ফাইলের আকারের তুলনা করে একটি বার চার্ট। AVIF সর্বনিম্ন, তারপর JPEG XL, তারপর WebP, এবং অবশেষে MozJPEG।

নীচের চার্টটি (উচ্চতর ভাল) ব্যাখ্যা করে যে কীভাবে AVIF এনকোডিং গতি অন্যান্য চিত্র বিন্যাসের সাথে তুলনা করে। পূর্ববর্তী প্রজন্মের কোডেক যেমন WebP কম জটিল (কিন্তু কম দক্ষ) কম্প্রেশন অ্যালগরিদম থেকে উপকৃত হয়। একটি মাল্টি-থ্রেডেড এনকোডিং স্কিম সহ, AVIF উল্লেখযোগ্য কম্প্রেশন লাভ ডেলিভার করার সময় সাধারণ ব্যবহারের ক্ষেত্রে অনুরূপ কর্মক্ষমতা অর্জন করে।

ইমেজ কোডেক এনকোডিং গতির তুলনা। তুলনামূলক এনকোডারগুলি হল গড় AVIF, গড় JPEG XL, গড় WebP (এক থ্রেড), এবং গড় MozJPEG (এক থ্রেড)। সর্বোত্তম মানের এবং ডিফল্ট প্রচেষ্টার পরিপ্রেক্ষিতে AVIF সাধারণত দ্রুততম চিত্র এনকোডারগুলির মধ্যে একটি, তবে অন-দ্য-ফ্লাই পারফরম্যান্সের জন্য সমস্ত এনকোডারগুলির মধ্যে এটি সবচেয়ে ধীর।

আরও বিশদ এনকোডিং গতি এবং ভিজ্যুয়াল মানের তুলনা করতে আগ্রহী বিকাশকারীদের জন্য, চিত্র কোডিং তুলনা সাইটটিতে পুনরুত্পাদনযোগ্য বেঞ্চমার্ক ফলাফল রয়েছে।

যদিও AVIF এবং WebP-এর মতো আধুনিক ইমেজ কোডেকগুলির জন্য সফ্টওয়্যার বাস্তবায়ন x86 এবং ARM প্রসেসরের আর্কিটেকচারের জন্য অপ্টিমাইজ করা হয়েছে, স্কেলে বিশাল পরিমাণ ছবি সংকুচিত করা গণনাগতভাবে ব্যয়বহুল হতে পারে। কম্প্রেশন খরচ কমানোর একটি বিকল্প হল হার্ডওয়্যার ত্বরণ অন্বেষণ করা। ব্লুডট একটি হার্ডওয়্যার ত্বরান্বিত পালসার-এভিআইএফ এনকোডার তৈরি করেছে যা প্রোগ্রামেবল এফপিজিএ, যেমন AMD-এর Alveo U250-তে চলছে। সফ্টওয়্যার ভিত্তিক avifenc-এর তুলনায়, Pulsar-AVIF অনুরূপ কম্প্রেশন দক্ষতার সাথে 7 থেকে 23 গুণ গতির উন্নতি প্রদান করে৷

এনকোডার এনকোড সময় (মি.সে.) প্রতি সেকেন্ডে ফ্রেম CPU ব্যবহার হার্ডওয়্যার স্পেসিফিকেশন
পালসার-এভিআইএফ
(FPGA)
60 409.85 305% AMD Alveo U250 1ea + Intel(R) Xeon(R)
2.6GHz, 10 কোরে প্লাটিনাম 8171 CPU
avifenc
(লিবাওম)
405 59.26 3200% Intel(R) Xeon(R) Platinum 8370C CPU এ
2.8GHz, 32 কোর
avifenc
(SVT-AV1)
1325 18.11 3200% Intel(R) Xeon(R) Platinum 8370C CPU এ
2.8GHz, 32 কোর
AVIF এনকোড গতির তুলনা
  • টেস্ট সেট: কোডাক (768x512 এর 24 ছবি)
  • একই সাথে 24টি ছবি এনকোডিং (24 প্রক্রিয়া)
  • প্রতিটি সফ্টওয়্যার এনকোডিং প্রক্রিয়া 4টি থ্রেড দিয়ে সম্পাদিত হয়। (-জ 4)


বিকাশকারীরা ক্লাউড ভার্চুয়াল মেশিনের সাথে পালসার-এভিআইএফ এনকোডার স্থাপন করতে পারে, যেমন Azure NP-Series

প্রতিক্রিয়াশীল ওয়েব পৃষ্ঠাগুলির জন্য AVIF বৈশিষ্ট্য

AVIF এর কয়েকটি আকর্ষণীয় বৈশিষ্ট্য রয়েছে যা আরও প্রতিক্রিয়াশীল ওয়েব পৃষ্ঠাগুলি সরবরাহ করতে সহায়তা করবে। এইবার আমরা অ্যানিমেটেড AVIF-এ কিছুটা ডুব দেব, যা ওয়েবে দুর্দান্ত অ্যানিমেশন সরবরাহ করার সবচেয়ে কার্যকর উপায়।

অ্যানিমেটেড AVIF

35 বছর বয়সী হওয়া সত্ত্বেও অ্যানিমেটেড GIF এখনও অ্যানিমেটেড চিত্রগুলির জন্য একটি জনপ্রিয় বিন্যাস । অ্যানিমেটেড জিআইএফ-এর সবচেয়ে বড় অসুবিধা হল শুধুমাত্র 256টি রঙের জন্য সমর্থন এবং দুর্বল কম্প্রেশন যা খুব বড় ফাইলের আকারের দিকে নিয়ে যায় এবং ব্যবহারিক ব্যবহারের ক্ষেত্রে রেজোলিউশন বা ফ্রেম রেট সীমিত করে। বিপরীতে, অ্যানিমেটেড AVIF কোডিং আসলে AV1 ভিডিও কোডিং স্কিমের মতোই যা অ্যানিমেটেড GIF-এর তুলনায় উল্লেখযোগ্য ফাইল আকার সঞ্চয় প্রদান করে।

আমরা একটি সাধারণ বেঞ্চমার্ক চালিয়েছি যেখানে আমরা AVIF এবং JPEG XL উভয়ের জন্য অ্যানিমেটেড GIF-এর একটি সেট এনকোড করেছি। পরীক্ষার সেটে, মূল জিআইএফ ফাইলের তুলনায় মাঝারি ফাইলের আকার সঞ্চয় শতাংশ ছিল প্রায় 86% এবং অ্যানিমেটেড JPEG XL ফাইলের তুলনায় প্রায় 73%*।

অ্যানিমেটেড ইমেজ কোডেক কর্মক্ষমতা একটি তুলনা. AVIF গড় এবং মাঝারি ফাইল আকার উভয় ক্ষেত্রেই GIF এবং JPEG XL কে ছাড়িয়ে যায়।
* libavif এবং libjxl সংস্করণ: libavif সংস্করণ 4cff6a3 (libaom সংস্করণ v3.5.0), libjxl সংস্করণ 176b1c03। টেস্ট সেট: উইকিপিডিয়া থেকে 15টি নমুনা জিআইএফ।

ক্রোম, ফায়ারফক্স এবং সাফারি সমস্ত অ্যানিমেটেড AVIF প্লেব্যাক সমর্থন করে।

FFmpeg হল অ্যানিমেটেড AVIF ফাইল তৈরির জন্য ব্যবহার করার জন্য একটি টুল, এখানে FFmpeg ব্যবহার করে একটি GIF-এ AVIF রূপান্তর করার একটি মৌলিক উদাহরণ রয়েছে:

ffmpeg -i "$INPUT_GIF" -crf $CRF -b:v 0 "$OUTPUT.avif"

$CRF হল 0 থেকে 63 স্কেলে কাঙ্খিত আউটপুট গুণমান। নিম্ন মান মানে ভালো মানের এবং বড় ফাইলের আকার। 0 ক্ষতিহীন কম্প্রেশন ব্যবহার করে। ছোট অ্যানিমেটেড AVIF ফাইলগুলির জন্য 23 এর মান দিয়ে শুরু করুন।

FFmpeg AVIF ছবি এনকোড করার জন্য ডিফল্টরূপে libaom ব্যবহার করে, তবে এটি rav1e বা SVT-AV1 ব্যবহার করতে পারে যখন উপলব্ধ থাকে। এনকোডার পছন্দ সম্পর্কে আরও তথ্য, গতি/গুণমানের ট্রেড-অফের জন্য এনকোডিং পরামিতি টিউন করা FFmpeg-এর AV1 এনকোডিং গাইডে পাওয়া যাবে।

আরেকটি ব্যবহারের ক্ষেত্রে মূল ফাইলটি পুনরায় এনকোডিং না করেই একটি AV1 ভিডিওকে AVIF-এ পুনরায় প্যাকেজ করা। এটি মূল AV1 ফাইলের ডিকোডিং/এনকোডিংয়ের তুলনায় উল্লেখযোগ্যভাবে সস্তা এবং AV1 ভিডিওটিকে <img> উপাদানের সাথে ব্যবহারের জন্য উপলব্ধ করে। FFmpeg-এ -c:v copy পাস করা এটি করতে পারে।

ffmpeg -i "$INPUT_AV1_VIDEO" -c:v copy -an "$OUTPUT.avif"

উপসংহার

লঞ্চের পর থেকে ওয়েবে AVIF ব্যবহার ক্রমাগত বৃদ্ধি পাচ্ছে এবং ব্রাউজার, ইমেজ CDN, ওয়ার্ডপ্রেস প্লাগইন এবং এনকোডিং টুল দ্বারা ব্যাপকভাবে সমর্থিত। সব মিলিয়ে, AVIF ওয়েবে ছবি পরিবেশনের জন্য একটি দুর্দান্ত পছন্দ; AVIF দ্রুত এনকোড এবং ডিকোড করার জন্য সেরা মানের বা ছোট ফাইলের আকার প্রদান করে, যেটি আপনি আপনার ওয়েবসাইটের জন্য পছন্দ করেন৷ AVIF হল ওয়েবে অ্যানিমেশন সরবরাহ করার সবচেয়ে কার্যকর উপায়। আপনার যদি প্রশ্ন, মন্তব্য বা বৈশিষ্ট্যের অনুরোধ থাকে, অনুগ্রহ করে av1-আলোচনা মেইলিং তালিকা , AOM Github সম্প্রদায় এবং AVIF উইকিতে যোগাযোগ করুন।

আনস্প্ল্যাশ থেকে হিরো ইমেজ, অমল এস দ্বারা।