সচরাচর জিজ্ঞাস্য

WebP কি? কেন আমি এটা ব্যবহার করা উচিত?

WebP হল ক্ষতিকর এবং ক্ষতিহীন কম্প্রেশনের একটি পদ্ধতি যা ওয়েবে পাওয়া বিভিন্ন ফটোগ্রাফিক, ট্রান্সলুসেন্ট এবং গ্রাফিকাল ইমেজগুলিতে ব্যবহার করা যেতে পারে। ক্ষতিকর কম্প্রেশনের ডিগ্রী সামঞ্জস্যযোগ্য যাতে একজন ব্যবহারকারী ফাইলের আকার এবং ছবির গুণমানের মধ্যে ট্রেড-অফ বেছে নিতে পারেন। WebP সাধারণত JPEG এবং JPEG 2000 এর তুলনায় 30% বেশি কম্প্রেশন অর্জন করে, ছবির গুণমান নষ্ট না করে ( তুলনামূলক অধ্যয়ন দেখুন)।

WebP ফর্ম্যাটটি মূলত ছোট, আরও ভালো দেখতে ছবি তৈরি করার লক্ষ্য রাখে যা ওয়েবকে দ্রুততর করতে সাহায্য করতে পারে।

কোন ওয়েব ব্রাউজার নেটিভভাবে WebP সমর্থন করে?

সাইটের পারফরম্যান্সের উন্নতিতে আগ্রহী ওয়েবমাস্টাররা সহজেই তাদের বর্তমান চিত্রগুলির জন্য অপ্টিমাইজ করা WebP বিকল্পগুলি তৈরি করতে পারে এবং WebP সমর্থন করে এমন ব্রাউজারগুলিতে লক্ষ্য ভিত্তিতে সেগুলি পরিবেশন করতে পারে।

  • WebP ক্ষতিকর সমর্থন
    • Google Chrome (ডেস্কটপ) 17+
    • Android সংস্করণ 25+ এর জন্য Google Chrome
    • Microsoft Edge 18+
    • ফায়ারফক্স 65+
    • অপেরা 11.10+
    • নেটিভ ওয়েব ব্রাউজার, Android 4.0+ (ICS)
    • Safari 14+ (iOS 14+, macOS Big Sur+)
  • WebP ক্ষতিকর, ক্ষতিহীন এবং আলফা সমর্থন
    • Google Chrome (ডেস্কটপ) 23+
    • Android সংস্করণ 25+ এর জন্য Google Chrome
    • Microsoft Edge 18+
    • ফায়ারফক্স 65+
    • অপেরা 12.10+
    • নেটিভ ওয়েব ব্রাউজার, Android 4.2+ (JB-MR1)
    • ফ্যাকাশে চাঁদ 26+
    • Safari 14+ (iOS 14+, macOS Big Sur+)
  • ওয়েবপি অ্যানিমেশন সমর্থন
    • Google Chrome (ডেস্কটপ এবং Android) 32+
    • Microsoft Edge 18+
    • ফায়ারফক্স 65+
    • অপেরা 19+
    • Safari 14+ (iOS 14+, macOS Big Sur+)

আরো দেখুন:

আমি কিভাবে WebP এর জন্য ব্রাউজার সমর্থন সনাক্ত করতে পারি?

আপনি WebP চিত্রগুলি শুধুমাত্র সেই ক্লায়েন্টদের কাছে পরিবেশন করতে চাইবেন যারা সেগুলিকে সঠিকভাবে প্রদর্শন করতে পারে এবং যে ক্লায়েন্টগুলি করতে পারে না তাদের জন্য লিগ্যাসি ফরম্যাটে ফিরে আসে৷ সৌভাগ্যবশত ক্লায়েন্ট-সাইড এবং সার্ভার-সাইড উভয় ক্ষেত্রেই WebP সমর্থন সনাক্ত করার জন্য বেশ কয়েকটি কৌশল রয়েছে। কিছু CDN প্রদানকারী তাদের পরিষেবার অংশ হিসাবে WebP সমর্থন সনাক্তকরণ অফার করে।

একসেপ্ট হেডারের মাধ্যমে সার্ভার-সাইড কন্টেন্ট আলোচনা

ওয়েব ক্লায়েন্টদের জন্য একটি "স্বীকার করুন" অনুরোধ শিরোনাম পাঠানো সাধারণ, যা নির্দেশ করে যে তারা প্রতিক্রিয়া হিসাবে কোন বিষয়বস্তু বিন্যাস গ্রহণ করতে ইচ্ছুক। যদি একটি ব্রাউজার আগে থেকে ইঙ্গিত দেয় যে এটি ইমেজ/ওয়েবপি ফরম্যাটটিকে "স্বীকার করবে", ওয়েব সার্ভার জানে যে এটি নিরাপদে ওয়েবপি ছবি পাঠাতে পারে, যা বিষয়বস্তু আলোচনাকে ব্যাপকভাবে সহজ করে। আরো তথ্যের জন্য নিম্নলিখিত লিঙ্ক দেখুন.

মডার্নাইজার

Modernizr হল একটি জাভাস্ক্রিপ্ট লাইব্রেরি যা ওয়েব ব্রাউজারে সহজে HTML5 এবং CSS3 বৈশিষ্ট্য সমর্থন সনাক্ত করার জন্য। Modernizr.webp , Modernizr.webp.lossless , Modernizr.webp.alpha এবং Modernizr.webp.animation বৈশিষ্ট্যগুলি সন্ধান করুন।

HTML5 <picture> উপাদান

HTML5 একটি <picture> উপাদান সমর্থন করে, যা আপনাকে অগ্রাধিকার ক্রমে একাধিক, বিকল্প ইমেজ টার্গেট তালিকাভুক্ত করতে দেয়, যেমন একজন ক্লায়েন্ট প্রথম প্রার্থীর ইমেজটির জন্য অনুরোধ করবে যা এটি সঠিকভাবে প্রদর্শন করতে পারে। HTML5 Rocks-এ এই আলোচনাটি দেখুন। <picture> উপাদানটি সব সময় আরও ব্রাউজার দ্বারা সমর্থিত

আপনার নিজের জাভাস্ক্রিপ্টে

আরেকটি সনাক্তকরণ পদ্ধতি হল একটি খুব ছোট WebP চিত্রকে ডিকোড করার চেষ্টা করা যা একটি নির্দিষ্ট বৈশিষ্ট্য ব্যবহার করে এবং সফলতার জন্য পরীক্ষা করা। উদাহরণ:

// check_webp_feature:
//   'feature' can be one of 'lossy', 'lossless', 'alpha' or 'animation'.
//   'callback(feature, result)' will be passed back the detection result (in an asynchronous way!)
function check_webp_feature(feature, callback) {
    var kTestImages = {
        lossy: "UklGRiIAAABXRUJQVlA4IBYAAAAwAQCdASoBAAEADsD+JaQAA3AAAAAA",
        lossless: "UklGRhoAAABXRUJQVlA4TA0AAAAvAAAAEAcQERGIiP4HAA==",
        alpha: "UklGRkoAAABXRUJQVlA4WAoAAAAQAAAAAAAAAAAAQUxQSAwAAAARBxAR/Q9ERP8DAABWUDggGAAAABQBAJ0BKgEAAQAAAP4AAA3AAP7mtQAAAA==",
        animation: "UklGRlIAAABXRUJQVlA4WAoAAAASAAAAAAAAAAAAQU5JTQYAAAD/////AABBTk1GJgAAAAAAAAAAAAAAAAAAAGQAAABWUDhMDQAAAC8AAAAQBxAREYiI/gcA"
    };
    var img = new Image();
    img.onload = function () {
        var result = (img.width > 0) && (img.height > 0);
        callback(feature, result);
    };
    img.onerror = function () {
        callback(feature, false);
    };
    img.src = "data:image/webp;base64," + kTestImages[feature];
}

মনে রাখবেন যে ইমেজ-লোডিং নন-ব্লকিং এবং অ্যাসিঙ্ক্রোনাস। এর মানে হল যে কোন কোড যা WebP সমর্থনের উপর নির্ভর করে তা কলব্যাক ফাংশনে রাখা উচিত।

কেন Google ওপেন সোর্স হিসাবে WebP প্রকাশ করেছে?

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

আমি কিভাবে আমার ব্যক্তিগত ছবি ফাইলগুলিকে WebP-এ রূপান্তর করতে পারি?

আপনার ব্যক্তিগত ইমেজ ফাইলগুলিকে WebP ফরম্যাটে রূপান্তর করতে আপনি WebP কমান্ড লাইন ইউটিলিটি ব্যবহার করতে পারেন। আরও বিস্তারিত জানার জন্য WebP ব্যবহার করা দেখুন।

আপনার যদি রূপান্তর করার জন্য অনেকগুলি ছবি থাকে তবে আপনি অপারেশনটি সহজ করতে আপনার প্ল্যাটফর্মের শেল ব্যবহার করতে পারেন। উদাহরণস্বরূপ, একটি ফোল্ডারে সমস্ত jpeg ফাইল রূপান্তর করতে নিম্নলিখিত চেষ্টা করুন:

উইন্ডোজ:

> for /R . %I in (*.jpg) do ( cwebp.exe %I -o %~fnI.webp )

লিনাক্স / ম্যাকোস:

$ for F in *.jpg; do cwebp $F -o `basename ${F%.jpg}`.webp; done

কিভাবে আমি নিজের জন্য WebP ছবির গুণমান বিচার করতে পারি?

বর্তমানে, আপনি ওয়েবপি ফাইলগুলিকে একটি সাধারণ বিন্যাসে রূপান্তর করে দেখতে পারেন যা ক্ষতিহীন কম্প্রেশন ব্যবহার করে, যেমন PNG, এবং তারপরে যেকোন ব্রাউজার বা ইমেজ ভিউয়ারে PNG ফাইলগুলি দেখতে পারেন৷ WebP মানের একটি দ্রুত ধারণা পেতে, পাশের ছবির তুলনার জন্য এই সাইটে গ্যালারি দেখুন।

আমি কিভাবে সোর্স কোড পেতে পারি?

রূপান্তরকারী কোডটি WebP ওপেন-সোর্স প্রকল্প পৃষ্ঠার ডাউনলোড বিভাগে উপলব্ধ। লাইটওয়েট ডিকোডারের কোড এবং VP8 স্পেসিফিকেশন WebM সাইটে রয়েছে। কন্টেইনার স্পেসিফিকেশনের জন্য RIFF কন্টেইনার পৃষ্ঠা দেখুন।

একটি WebP চিত্রের সর্বোচ্চ আকার কত হতে পারে?

WebP VP8 এর সাথে বিটস্ট্রিম-সামঞ্জস্যপূর্ণ এবং প্রস্থ এবং উচ্চতার জন্য 14 বিট ব্যবহার করে। একটি WebP ছবির সর্বোচ্চ পিক্সেল মাত্রা হল 16383 x 16383।

WebP ফরম্যাট কোন রঙের স্থান সমর্থন করে?

VP8 বিটস্ট্রিমের সাথে সামঞ্জস্যপূর্ণ, ক্ষতিকর WebP একটি 8-বিট Y'CbCr 4:2:0 (প্রায়শই YUV420 বলা হয়) চিত্র বিন্যাসের সাথে একচেটিয়াভাবে কাজ করে। আরও বিস্তারিত জানার জন্য অনুগ্রহ করে বিভাগ 2, RFC 6386 এর " ফর্ম্যাট ওভারভিউ ", VP8 ডেটা ফরম্যাট এবং ডিকোডিং গাইড দেখুন।

লসলেস WebP শুধুমাত্র RGBA ফর্ম্যাটের সাথে কাজ করে। ওয়েবপি লসলেস বিটস্ট্রিম স্পেসিফিকেশন দেখুন।

একটি WebP চিত্র কি তার উৎস চিত্রের চেয়ে বড় হতে পারে?

হ্যাঁ, সাধারণত ক্ষতিকর ফর্ম্যাট থেকে WebP লসলেস বা এর বিপরীতে রূপান্তর করার সময়। এটি মূলত রঙের স্থান পার্থক্য (YUV420 বনাম ARGB) এবং এর মধ্যে রূপান্তরের কারণে।

তিনটি সাধারণ পরিস্থিতি রয়েছে:

  1. সোর্স ইমেজ যদি লসলেস ARGB ফরম্যাটে হয়, তাহলে YUV420-তে স্থানিক ডাউনস্যাম্পলিং নতুন রঙের সাথে পরিচয় করিয়ে দেবে যেগুলো মূল রঙের তুলনায় কমপ্রেস করা কঠিন। এই পরিস্থিতি সাধারণত ঘটতে পারে যখন উত্সটি কয়েকটি রঙের সাথে PNG ফর্ম্যাটে থাকে: ক্ষতিকারক WebP (অথবা একইভাবে ক্ষতিকারক JPEG-তে) রূপান্তর করার ফলে সম্ভবত একটি বড় ফাইলের আকার হবে৷
  2. উৎসটি ক্ষতিকর বিন্যাসে থাকলে, উৎসের ক্ষতিকারক প্রকৃতি ক্যাপচার করার জন্য লসলেস WebP কম্প্রেশন ব্যবহার করলে সাধারণত একটি বড় ফাইল তৈরি হয়। এটি WebP-এর জন্য বিশেষ নয়, এবং উদাহরণস্বরূপ, একটি JPEG উৎসকে লসলেস WebP বা PNG ফর্ম্যাটে রূপান্তর করার সময় ঘটতে পারে।
  3. যদি উত্সটি ক্ষতিকারক ফর্ম্যাটে থাকে এবং আপনি উচ্চ মানের সেটিং সহ একটি ক্ষতিকারক WebP হিসাবে এটিকে সংকুচিত করার চেষ্টা করছেন৷ উদাহরণস্বরূপ, গুণমান 80-এ সংরক্ষিত একটি JPEG ফাইলকে 95 গুণমান সহ একটি WebP ফাইলে রূপান্তর করার চেষ্টা করলে সাধারণত একটি বড় ফাইল হবে, এমনকি উভয় বিন্যাস ক্ষতিকারক হলেও। উৎসের গুণমান মূল্যায়ন করা প্রায়শই অসম্ভব, তাই ফাইলের আকার ধারাবাহিকভাবে বড় হলে লক্ষ্য WebP গুণমান কম করার পরামর্শ দেওয়া হয়। আরেকটি সম্ভাবনা হল কোয়ালিটি সেটিং ব্যবহার করা এড়ানো, এবং পরিবর্তে cwebp টুলে -size বিকল্পটি বা সমতুল্য API ব্যবহার করে একটি প্রদত্ত ফাইলের আকার লক্ষ্য করা। উদাহরণস্বরূপ, মূল ফাইলের আকারের 80% টার্গেট করা আরও শক্তিশালী প্রমাণিত হতে পারে।

মনে রাখবেন যে একটি JPEG উৎসকে ক্ষতিকারক WebP তে রূপান্তর করা, অথবা একটি PNG উৎসকে লসলেস WebP-এ রূপান্তর করা এই ধরনের ফাইলের আকারের আশ্চর্যের ঝুঁকিপূর্ণ নয়।

WebP কি প্রগতিশীল বা ইন্টারলেসড ডিসপ্লে সমর্থন করে?

WebP JPEG বা PNG অর্থে প্রগতিশীল বা ইন্টারলেসড ডিকোডিং রিফ্রেশ অফার করে না। এটি ডিকোডিং ক্লায়েন্টের সিপিইউ এবং মেমরির উপর অত্যধিক চাপ সৃষ্টি করতে পারে কারণ প্রতিটি রিফ্রেশ ইভেন্ট ডিকম্প্রেশন সিস্টেমের মাধ্যমে একটি সম্পূর্ণ পাস জড়িত।

গড়ে, একটি প্রগতিশীল JPEG ইমেজ ডিকোড করা বেসলাইনটি 3 বার ডিকোড করার সমতুল্য।

বিকল্পভাবে, WebP ক্রমবর্ধমান ডিকোডিং অফার করে, যেখানে বিটস্ট্রিমের সমস্ত উপলব্ধ ইনকামিং বাইট যত তাড়াতাড়ি সম্ভব একটি প্রদর্শনযোগ্য নমুনা সারি তৈরি করার জন্য ব্যবহার করা হয়। এটি উভয়ই মেমরি, সিপিইউ এবং ক্লায়েন্টের পুনরায় পেইন্ট প্রচেষ্টা সংরক্ষণ করে যখন ডাউনলোডের অবস্থা সম্পর্কে চাক্ষুষ সংকেত দেয়। ক্রমবর্ধমান ডিকোডিং বৈশিষ্ট্যটি উন্নত ডিকোডিং API-এর মাধ্যমে উপলব্ধ।

আমি কিভাবে আমার অ্যান্ড্রয়েড প্রকল্পে libwebp জাভা বাইন্ডিং ব্যবহার করব?

WebP swig/ ডিরেক্টরিতে সাধারণ এনকোডার এবং ডিকোডার ইন্টারফেসে JNI বাইন্ডিংয়ের জন্য সমর্থন অন্তর্ভুক্ত করে।

Eclipse এ লাইব্রেরি তৈরি করা:

  1. নিশ্চিত করুন যে আপনি NDK টুলগুলির সাথে ADT প্লাগইন ইনস্টল করেছেন এবং আপনার NDK পাথ সঠিকভাবে সেট করা আছে ( পছন্দগুলি > Android > NDK )।
  2. একটি নতুন প্রকল্প তৈরি করুন: ফাইল > নতুন > প্রকল্প > অ্যান্ড্রয়েড অ্যাপ্লিকেশন প্রকল্প
  3. নতুন প্রকল্পে jni নামে একটি ফোল্ডারে libwebp ক্লোন করুন বা আনপ্যাক করুন।
  4. LOCAL_SRC_FILES তালিকায় swig/libwebp_java_wrap.c যোগ করুন।
  5. আপনার বিল্ডে লাইব্রেরি অন্তর্ভুক্ত করতে নতুন প্রোজেক্টে রাইট-ক্লিক করুন এবং Android Tools > নেটিভ সাপোর্ট যোগ করুন... নির্বাচন করুন।
  6. প্রকল্পের বৈশিষ্ট্যগুলি খুলুন এবং C/C++ বিল্ড > আচরণে যান। শেয়ার্ড লাইব্রেরি হিসেবে libwebp তৈরি করতে Build (Incremental build) বিভাগে ENABLE_SHARED=1 যোগ করুন।

    নোট NDK_TOOLCHAIN_VERSION=4.8 সেটিং সাধারণভাবে 32-বিট বিল্ড কর্মক্ষমতা উন্নত করবে।

  7. libs/ প্রকল্প ফোল্ডারে swig/libwebp.jar যোগ করুন।

  8. আপনার প্রকল্প তৈরি করুন. এটি libs/<target-arch>/libwebp.so তৈরি করবে।

  9. রানটাইমে লাইব্রেরি লোড করতে System.loadLibrary("webp") ব্যবহার করুন।

মনে রাখবেন যে লাইব্রেরিটি ndk-build এবং অন্তর্ভুক্ত Android.mk দিয়ে ম্যানুয়ালি তৈরি করা যেতে পারে। সেক্ষেত্রে উপরে বর্ণিত কয়েকটি ধাপ পুনরায় ব্যবহার করা যেতে পারে।

আমি কিভাবে C# এর সাথে libwebp ব্যবহার করব?

WebP একটি DLL হিসাবে তৈরি করা যেতে পারে যা libwebp API রপ্তানি করে। এই ফাংশনগুলি তারপর C# এ আমদানি করা যেতে পারে।

  1. libwebp.dll তৈরি করুন। এটি API ফাংশন রপ্তানি করতে সঠিকভাবে WEBP_EXTERN সেট করবে।

    libwebp> nmake /f Makefile.vc CFG=release-dynamic
    
  2. আপনার প্রকল্পে libwebp.dll যোগ করুন এবং পছন্দসই ফাংশন আমদানি করুন। নোট করুন আপনি যদি সাধারণ API ব্যবহার করেন তবে আপনাকে যে কোনো বাফার ফেরত মুক্ত করতে WebPFree() কল করতে হবে।

    [DllImport("libwebp.dll", CallingConvention = CallingConvention.Cdecl)]
    static extern int WebPEncodeBGRA(IntPtr rgba, int width, int height, int stride,
                                     float quality_factor, out IntPtr output);
    [DllImport("libwebp.dll", CallingConvention = CallingConvention.Cdecl)]
    static extern int WebPFree(IntPtr p);
    
    void Encode() {
      Bitmap source = new Bitmap("input.png");
      BitmapData data = source.LockBits(
          new Rectangle(0, 0, source.Width, source.Height),
          ImageLockMode.ReadOnly,
          PixelFormat.Format32bppArgb);
      IntPtr webp_data;
      const int size = WebPEncodeBGRA(data.Scan0,
                                      source.Width, source.Height, data.Stride,
                                      80, out webp_data);
      // ...
      WebPFree(webp_data);
    }
    

আমি কেন অ্যানিমেটেড ওয়েবপি ব্যবহার করব?

অ্যানিমেটেড GIF এর তুলনায় অ্যানিমেটেড WebP-এর সুবিধা

  1. GIF-এর 8-বিট রঙ এবং 1-বিট আলফার তুলনায় WebP একটি 8-বিট আলফা চ্যানেল সহ 24-বিট RGB রঙ সমর্থন করে।

  2. WebP উভয় ক্ষতিকর এবং ক্ষতিহীন কম্প্রেশন সমর্থন করে; আসলে, একটি একক অ্যানিমেশন ক্ষতিকারক এবং ক্ষতিহীন ফ্রেমগুলিকে একত্রিত করতে পারে। GIF শুধুমাত্র ক্ষতিহীন কম্প্রেশন সমর্থন করে। WebP-এর ক্ষতিকর কম্প্রেশন কৌশলগুলি বাস্তব-বিশ্বের ভিডিওগুলি থেকে তৈরি অ্যানিমেটেড চিত্রগুলির জন্য উপযুক্ত, অ্যানিমেটেড চিত্রগুলির একটি ক্রমবর্ধমান জনপ্রিয় উত্স৷

  3. WebP-এর GIF 1 থেকে কম বাইটের প্রয়োজন। অ্যানিমেটেড GIFগুলি ক্ষতিগ্রস্থ WebP-এ রূপান্তরিত 64% ছোট, যখন ক্ষতিহীন WebPগুলি 19% ছোট৷ এটি মোবাইল নেটওয়ার্কগুলিতে বিশেষভাবে গুরুত্বপূর্ণ৷

  4. ওয়েবপি চাওয়ার উপস্থিতিতে ডিকোড করতে কম সময় নেয়। ব্লিঙ্কে , স্ক্রোল করা বা পরিবর্তন করা ট্যাবগুলি চিত্রগুলিকে লুকিয়ে রাখতে এবং দেখাতে পারে, যার ফলে অ্যানিমেশনগুলিকে বিরতি দেওয়া হয় এবং তারপরে একটি ভিন্ন বিন্দুতে এগিয়ে যাওয়া যায়৷ অত্যধিক সিপিইউ ব্যবহার যার ফলে অ্যানিমেশনগুলি ফ্রেম ড্রপ করে, এছাড়াও ডিকোডারকে অ্যানিমেশনে এগিয়ে যাওয়ার প্রয়োজন হতে পারে। এই পরিস্থিতিতে, অ্যানিমেটেড WebP GIF-এর তুলনায় 0.57x মোট ডিকোড টাইম 2 নেয়, যার ফলে স্ক্রল করার সময় কম জ্যাঙ্ক হয় এবং CPU ইউটিলাইজেশন স্পাইক থেকে দ্রুত পুনরুদ্ধার হয়। এটি GIF এর উপর WebP এর দুটি সুবিধার কারণে:

    • WebP চিত্রগুলি প্রতিটি ফ্রেমে আলফা রয়েছে কিনা সে সম্পর্কে মেটাডেটা সঞ্চয় করে, এই নির্ধারণ করতে ফ্রেমটিকে ডিকোড করার প্রয়োজনীয়তা দূর করে৷ এটি একটি প্রদত্ত ফ্রেমের উপর নির্ভর করে কোন পূর্ববর্তী ফ্রেমের উপর নির্ভর করে তা আরও সঠিক অনুমানের দিকে নিয়ে যায়, যার ফলে পূর্ববর্তী ফ্রেমের অপ্রয়োজনীয় ডিকোডিং হ্রাস পায়।

    • অনেকটা আধুনিক ভিডিও এনকোডারের মতো, WebP এনকোডার হিউরিস্টিকভাবে নিয়মিত বিরতিতে কী-ফ্রেম যোগ করে (যা বেশিরভাগ GIF এনকোডার করে না)। এটি নাটকীয়ভাবে দীর্ঘ অ্যানিমেশনে চাওয়াকে উন্নত করে। ছবির আকার উল্লেখযোগ্যভাবে বৃদ্ধি না করে এই ধরনের ফ্রেম সন্নিবেশ করার সুবিধার্থে, WebP প্রতিটি ফ্রেমের জন্য একটি 'ব্লেন্ডিং মেথড' ফ্ল্যাগ যোগ করে এবং GIF ব্যবহার করে ফ্রেম নিষ্পত্তি পদ্ধতির সাথে। এটি একটি কীফ্রেমকে এমনভাবে আঁকতে দেয় যেন পূর্ববর্তী ফ্রেমটিকে পূর্ণ আকারের হতে বাধ্য না করে পুরো চিত্রটি পটভূমির রঙে পরিষ্কার করা হয়েছে।

অ্যানিমেটেড GIF এর তুলনায় অ্যানিমেটেড WebP-এর অসুবিধা

  1. অনুসন্ধানের অনুপস্থিতিতে, WebP-এর সরল-রেখার ডিকোডিং GIF-এর চেয়ে বেশি CPU-নিবিড়। ক্ষতিগ্রস্থ WebP GIF এর চেয়ে 2.2x বেশি ডিকোড সময় নেয়, যেখানে ক্ষতিহীন WebP 1.5x বেশি সময় নেয়।

  2. WebP সমর্থন জিআইএফ সমর্থনের মতো প্রায় বিস্তৃত নয়, যা কার্যকরভাবে সর্বজনীন।

  3. ব্রাউজারগুলিতে WebP সমর্থন যোগ করা কোডের পদচিহ্ন এবং আক্রমণের পৃষ্ঠকে বাড়ায়। ব্লিঙ্কে এটি প্রায় 1500টি অতিরিক্ত লাইন কোড (ওয়েবপি ডেমক্স লাইব্রেরি এবং ব্লিঙ্ক-সাইড ওয়েবপি ইমেজ ডিকোডার সহ)। মনে রাখবেন যে WebP এবং WebM যদি আরও সাধারণ ডিকোডিং কোড শেয়ার করে, অথবা WebM-এর মধ্যে WebP-এর ক্ষমতাগুলি সাবমিট করা হয় তাহলে ভবিষ্যতে এই সমস্যাটি হ্রাস পেতে পারে।

কেন কেবল <img> এ WebM সমর্থন করবেন না?

<img> ট্যাগের ভিতরে ভিডিও ফর্ম্যাটগুলিকে সমর্থন করা দীর্ঘমেয়াদী অর্থপূর্ণ হতে পারে। যাইহোক, এখন তা করা, এই উদ্দেশ্য নিয়ে যে <img> এ WebM অ্যানিমেটেড WebP-এর প্রস্তাবিত ভূমিকা পূরণ করতে পারে, সমস্যাযুক্ত:

  1. পূর্ববর্তী ফ্রেমের উপর নির্ভর করে এমন একটি ফ্রেম ডিকোড করার সময়, পূর্ববর্তী ফ্রেমের ন্যূনতম সংখ্যা 3 ধরে রাখতে অ্যানিমেটেড WebP-এর তুলনায় WebM-এর 50% বেশি মেমরির প্রয়োজন হয়।

  2. ভিডিও কোডেক এবং কন্টেইনার সমর্থন ব্রাউজার এবং ডিভাইস জুড়ে ব্যাপকভাবে পরিবর্তিত হয়। স্বয়ংক্রিয় বিষয়বস্তু ট্রান্সকোডিংয়ের সুবিধার জন্য (যেমন ব্যান্ডউইথ-সেভিং প্রক্সিগুলির জন্য), ব্রাউজারগুলিকে তাদের ইমেজ ট্যাগগুলি কী ফর্ম্যাটগুলিকে সমর্থন করে তা নির্দেশ করে স্বীকার শিরোনাম যুক্ত করতে হবে৷ এমনকি এটি অপর্যাপ্তও হতে পারে, কারণ MIME প্রকারগুলি যেমন "video/webm" বা "video/mpeg" এখনও কোডেক সমর্থন নির্দেশ করে না (যেমন VP8 বনাম VP9)। অন্যদিকে, WebP ফরম্যাটটি কার্যকরভাবে হিমায়িত করা হয়েছে, এবং যে সকল বিক্রেতারা এটি পাঠিয়েছেন তারা যদি অ্যানিমেটেড WebP পাঠাতে সম্মত হন, তাহলে সমস্ত UA জুড়ে WebP-এর আচরণ সামঞ্জস্যপূর্ণ হওয়া উচিত; এবং যেহেতু "image/webp" স্বীকার শিরোনামটি ইতিমধ্যেই WebP সমর্থন নির্দেশ করার জন্য ব্যবহার করা হয়েছে, তাই কোনো নতুন স্বীকার শিরোনাম পরিবর্তনের প্রয়োজন নেই।

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

  4. WebM বর্তমানে WebP থেকে সমস্ত কম্প্রেশন কৌশল অন্তর্ভুক্ত করে না। ফলস্বরূপ, এই চিত্রটি বিকল্পগুলির তুলনায় WebP এর সাথে উল্লেখযোগ্যভাবে ভালভাবে সংকুচিত করে:


1 অ্যানিমেটেড GIF এবং অ্যানিমেটেড WebP-এর মধ্যে সমস্ত তুলনার জন্য, আমরা ওয়েব থেকে এলোমেলোভাবে নেওয়া প্রায় 7000 অ্যানিমেটেড GIF চিত্রগুলির একটি সংগ্রহ ব্যবহার করেছি৷ এই ছবিগুলিকে ডিফল্ট সেটিংস ব্যবহার করে 'gif2webp' টুল ব্যবহার করে অ্যানিমেটেড WebP-এ রূপান্তরিত করা হয়েছে (10/08/2013 তারিখে সর্বশেষ libwebp উৎস ট্রি থেকে নির্মিত)। তুলনামূলক সংখ্যা হল এই ছবিগুলির গড় মান।

2 একটি বেঞ্চমার্ক টুল ব্যবহার করে 10/08/2013 তারিখে সর্বশেষ libwebp + ToT Blink ব্যবহার করে ডিকোড সময় গণনা করা হয়েছিল। "ডিকোড টাইম উইথ সিকিং" হিসাবে গণনা করা হয় "প্রথম পাঁচটি ফ্রেম ডিকোড করুন, ফ্রেম বাফার ক্যাশে পরিষ্কার করুন, পরবর্তী পাঁচটি ফ্রেমকে ডিকোড করুন এবং আরও অনেক কিছু"।

3 WebM 4টি YUV রেফারেন্স ফ্রেম মেমরিতে রাখে, প্রতিটি ফ্রেমে (প্রস্থ+96)*(উচ্চতা+96) পিক্সেল সংরক্ষণ করে। YUV 4:2:0 এর জন্য, আমাদের প্রয়োজন 4 বাইট প্রতি 6 পিক্সেল (বা 3/2 বাইট প্রতি পিক্সেল)। সুতরাং, এই রেফারেন্স ফ্রেমগুলি মেমরির 4*3/2*(width+96)*(height+96) বাইট ব্যবহার করে। অন্যদিকে WebP-এর জন্য শুধুমাত্র পূর্ববর্তী ফ্রেম (RGBA-এ) উপলব্ধ হতে হবে, যা মেমরির 4*width*height বাইট।

4 অ্যানিমেটেড ওয়েবপি রেন্ডারিংয়ের জন্য Google Chrome সংস্করণ 32+ প্রয়োজন৷