Ta strona została przetłumaczona przez Cloud Translation API.

Najczęstsze pytania

Co to jest WebP? Dlaczego warto z niego korzystać?

WebP to metoda stratnej i bezstratnej kompresji, którą można stosować na dużych różnorodnych zdjęć, półprzezroczystych i drastycznych obrazów dostępnych w internecie. Stopień kompresji stratnej można dostosować, wybierając między rozmiarem pliku a jakością obrazu. WebP zazwyczaj zapewnia średnio o 30% większej kompresji niż JPEG i JPEG 2000 bez utraty obrazu jakości (patrz Badanie porównawcze).

Format WebP służy przede wszystkim do tworzenia mniejszych, lepiej dopasowanych obrazów które mogą przyspieszyć działanie sieci.

Które przeglądarki natywnie obsługują WebP?

Webmasterzy, którzy chcą poprawić wydajność witryny, mogą łatwo tworzyć zoptymalizować alternatywne rozwiązania WebP dla bieżących obrazów i wyświetlać je w kierowane na przeglądarki obsługujące WebP.

Obsługa stratnej technologii WebP
- Google Chrome (na komputery) w wersji 17 lub nowszej
- Google Chrome na Androida w wersji 25 lub nowszej
- Microsoft Edge w wersji 18 lub nowszej.
- Firefox w wersji 65 lub nowszej,
- Opera w wersji 11.10 lub nowszej
- Natywna przeglądarka internetowa na urządzeniu z Androidem 4.0 lub nowszym (ICS)
- Safari 14 i nowsze (iOS 14 i nowsze, macOS Big Sur )
stratny, bezstratny protokół WebP obsługa wersji alfa
- Google Chrome (na komputery) w wersji 23 lub nowszej
- Google Chrome na Androida w wersji 25 lub nowszej
- Microsoft Edge w wersji 18 lub nowszej.
- Firefox w wersji 65 lub nowszej,
- Opera w wersji 12.10 lub nowszej
- Natywna przeglądarka internetowa na Androidzie 4.2 lub nowszym (JB-MR1)
- Jasny księżyc 26
- Safari 14 i nowsze (iOS 14 i nowsze, macOS Big Sur )
Obsługa animacji WebP
- Google Chrome (na komputery i urządzenia z Androidem) w wersji 32 lub nowszej
- Microsoft Edge w wersji 18 lub nowszej.
- Firefox w wersji 65 lub nowszej,
- Opera od 19 lat
- Safari 14 i nowsze (iOS 14 i nowsze, macOS Big Sur )

Zobacz także:

Jak mogę wykryć obsługę przeglądarki WebP?

Używaj obrazów WebP tylko tym klientom, którzy mogą je wyświetlać i używać starszych formatów w przypadku klientów, którzy tego nie robią. Na szczęście jest kilka metod wykrywania zgodnych z WebP, po stronie klienta i serwera. Niektórzy dostawcy CDN oferują wykrywanie obsługi WebP w ramach swojej usługi.

Negocjowanie treści po stronie serwera za pomocą nagłówków Accept

Klienty internetowe często wysyłają żądanie „Akceptuję” nagłówek żądania, który wskazuje formaty treści, które są akceptowane w odpowiedzi na żądania reklam. Jeśli przeglądarka informuje z wyprzedzeniem, że „akceptuje” format image/webp, serwer WWW wie, że może bezpiecznie wysyłać obrazy WebP, negocjacjami treści. Więcej informacji znajdziesz pod poniższymi linkami.

Modernizr

Modernizr to biblioteka JavaScriptu do wygodnego wykrywania HTML5 i Obsługa funkcji CSS3 w przeglądarkach. Wyszukaj właściwości. Modernizr.webp, Modernizr.webp.lossless, Modernizr.webp.alpha i Modernizr.webp.animation.

Element HTML5 `<picture>`

HTML5 obsługuje element <picture>, który umożliwia wyświetlenie wielu, alternatywne elementy docelowe grafiki w kolejności uzależnionej od ich priorytetu, tak aby klient zażądał jest to pierwszy kandydujący obraz, który może wyświetlić się poprawnie. Zobacz tej dyskusji na temat HTML5 Rocks. Element <picture> to obsługiwana przez więcej przeglądarek.

W Twoim własnym JavaScripcie

Inną metodą wykrywania jest próba zdekodowania bardzo małego obrazu WebP, który korzysta z konkretnej funkcji i sprawdza skuteczność. Przykład:

// 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];
}

Pamiętaj, że wczytywanie obrazów nie jest blokujące i asynchroniczne. Oznacza to, że każdy który zależy od obsługi WebP, należy umieścić w wywołaniu zwrotnym .

Dlaczego Google udostępnia WebP jako oprogramowanie typu open source?

Głęboko wierzymy w znaczenie modelu open source. Z WebP każdy może pracować z tym formatem i proponować ulepszenia. Na uwagi i sugestie, uważamy, że platforma WebP będzie jeszcze bardziej przydatna jako format graficzny.

Jak przekonwertować prywatne pliki obrazów do formatu WebP?

Osobiste pliki obrazów można przekonwertować za pomocą narzędzia wiersza poleceń WebP na format WebP. Więcej informacji znajdziesz w artykule Korzystanie z WebP.

Jeśli chcesz przekonwertować wiele obrazów, możesz użyć powłoki platformy, aby uprościć cały proces. Na przykład, aby przekonwertować wszystkie pliki JPEG w folderze, spróbuj następujące:

Windows:

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

Linux / macOS:

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

Jak mogę ocenić jakość obrazu WebP?

Obecnie można wyświetlać pliki WebP, konwertując je do wspólnego formatu wykorzystującą kompresję bezstratną, np. PNG, a następnie wyświetlać pliki PNG z dowolnej przeglądarki lub przeglądarki obrazów. Jeśli chcesz szybko sprawdzić jakość WebP, zobacz Galeria w tej witrynie ze zdjęciami obok siebie i porównaniami.

Jak pobrać kod źródłowy?

Kod konwertera jest dostępny na sekcja do pobierania w projekcie open source WebP, stronę. Kod lekkiego dekodera i specyfikacji VP8 są włączone witrynie WebM. Zobacz Strona Kontener RIFF dla kontenera specyfikacji.

Jaki jest maksymalny rozmiar obrazu WebP?

Standard WebP jest zgodny z formatem VP8 i używa 14 bitów do określenia szerokości i wysokości. Maksymalne wymiary obrazu WebP w pikselach to 16383 x 16383.

Jakie przestrzenie kolorów obsługuje format WebP?

Podobnie jak ze strumieniem bitowym VP8, stratny protokół WebP działa wyłącznie z 8-bitowy format obrazu Y'CbCr 4:2:0 (często nazywany YUV420). Zapoznaj się z sekcją 2. „Omówienie formatowania” standardu RFC 6386, Przewodnik po formatach i dekodowaniu danych VP8 .

Tryb bezstratny WebP działa tylko w formacie RGBA. Zobacz Specyfikacja bezstratnego strumienia bitów WebP.

Czy obraz WebP może być większy niż obraz źródłowy?

Tak, zazwyczaj przy konwersji z formatu stratnego na bezstratny WebP lub na odwrót. Wynika to głównie z różnicy w przestrzeni kolorów (YUV420 w porównaniu z ARGB) między tymi elementami.

Istnieją 3 typowe sytuacje:

Jeśli obraz źródłowy jest w bezstratnym formacie ARGB, zmniejszanie próbkowania przestrzennego do YUV420 spowoduje wprowadzenie nowych kolorów, które są trudniejsze do skompresowania niż pierwotnych. Zwykle dzieje się tak, gdy źródło jest w formacie PNG z kilkoma kolorami: do stratnego formatu WebP (lub do stratnego pliku JPEG) może spowodować zwiększenie rozmiaru pliku.
w przypadku formatu stratnego stosowanego w przypadku bezstratnej kompresji WebP; uchwycenie stratnego charakteru źródła powoduje zwykle większy plik. Nie dotyczy to WebP i może wystąpić, gdy konwersji źródła JPEG na przykład na bezstratny format WebP lub PNG.
Jeśli źródło jest w formacie stratnym i próbujesz je skompresować jako stratny protokół WebP o wyższej jakości. Spróbujmy na przykład konwertowanie pliku JPEG zapisanego w jakości 80 na plik WebP o jakości 95 zwykle powoduje utworzenie większego pliku, nawet jeśli w obu formatach są stratne. Ocena jakości źródła jest często niemożliwa, dlatego obniż docelową jakość WebP, jeśli rozmiar pliku jest stale większy. Innym sposobem jest unikanie korzystania z ustawienia jakości i na dany rozmiar pliku za pomocą opcji -size w narzędziu cwebp, lub jego odpowiednika. Na przykład kierowanie na 80% oryginalnego pliku może okazać się bardziej solidna.

Pamiętaj, że konwersja źródła JPEG do stratnego formatu WebP lub źródła PNG na format bezstratny WebP nie reaguje na takie niespodzianki związane z rozmiarem plików.

Czy WebP obsługuje wyświetlacz progresywny lub z przeplotem?

WebP nie umożliwia odświeżania dekodowania progresywnego lub z przeplotem w plikach JPEG ani PNG. Może to wywierać zbyt duży nacisk na procesor i pamięć klienta dekodowania, ponieważ każde zdarzenie odświeżania obejmuje pełną systemu dekompresyjnego.

Średnio dekodowanie progresywnego obrazu JPEG jest równoważne z dekodowaniem odniesienia 3 razy.

WebP oferuje też przyrostowe dekodowanie, w którym wszystkie dostępne bajty strumienia bitowego są wykorzystywane do próby utworzenia wyświetlanego przykładowego wiersza jako jak najszybciej. Pozwala to zaoszczędzić pamięć i procesor oraz zmniejszyć nakład pracy wraz z informacjami wizualnymi dotyczącymi stanu pobierania. Przyrostowy funkcja dekodowania jest dostępna w Advanced Decoding API

Jak używać powiązań libwebp w Javie w projekcie na Androida?

WebP obsługuje powiązania JNI z prostym koderem i dekoderem znajdziesz w katalogu swig/.

Tworzenie biblioteki w Eclipse:

Upewnij się, że masz Wtyczka ADT zainstalowano razem z narzędziami NDK, a ścieżka NDK jest ustawiona prawidłowo (Ustawienia > Android > NDK).
Utwórz nowy projekt: Plik > Nowe > Projekt > Androida Application Project (Projekt aplikacji).
sklonować lub rozpakuj libwebp do folderu o nazwie jni w nowym projekcie.
Dodaj swig/libwebp_java_wrap.c do listy LOCAL_SRC_FILES.
Kliknij nowy projekt prawym przyciskiem myszy i wybierz Narzędzia Androida > Dodaj Native Support ..., aby dodać bibliotekę do kompilacji.
Otwórz właściwości projektu i przejdź do Kompilacji C/C > Zachowanie. Dodaj ENABLE_SHARED=1 do sekcji Build (Incremental build), aby utworzyć libwebp jako biblioteki współdzielonej.

Uwaga: ustawienie NDK_TOOLCHAIN_VERSION=4.8 ogólnie poprawi się 32-bitowa wydajność kompilacji.
Dodaj swig/libwebp.jar do folderu projektu libs/.
Zbuduj projekt. Spowoduje to utworzenie libs/<target-arch>/libwebp.so.
Aby wczytywać bibliotekę w czasie działania, użyj polecenia System.loadLibrary("webp").

Pamiętaj, że bibliotekę można utworzyć ręcznie za pomocą ndk-build i dołączonych Android.mk Niektóre z kroków opisanych powyżej można wykorzystać ponownie.

Jak używać biblioteki libwebp w języku C#?

WebP można utworzyć jako bibliotekę DLL, która eksportuje interfejs libwebp API. Funkcje te mogą a następnie zaimportować w C#.

Utwórz plik libwebp.dll. Spowoduje to prawidłowe ustawienie eksportowania przez WEBP_EXTERN z interfejsu API funkcji.
```
libwebp> nmake /f Makefile.vc CFG=release-dynamic
```

Dodaj do projektu plik libwebp.dll i zaimportuj odpowiednie funkcje. Pamiętaj, że jeśli używasz tagu simple API, należy wywołać WebPFree(), aby zwolnić wszystkie zwrócone bufory.

[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);
}

Dlaczego warto używać animowanego formatu WebP?

Zalety animowanego formatu WebP w porównaniu z animowanymi GIF-ami

WebP obsługuje 24-bitowe kolory RGB z 8-bitowym kanałem alfa. 8-bitowy kolor GIF i 1-bitowy kod alfa.
WebP obsługuje zarówno kompresję stratną, jak i bezstratną. w rzeczywistości jeden może łączyć klatki stratne i bezstratne. Obsługuje tylko GIF-y bezstratną kompresję. Dobrze sprawdzają się techniki kompresji stratnej WebP, po animowane obrazy z prawdziwych filmów, które cieszą się coraz większą jako źródło animowanych obrazów.
WebP wymaga mniejszej liczby bajtów niż GIF¹. Animowane pliki GIF przekonwertowane na stratne formaty WebP są o 64% mniejsze i bezstratne WebP są o 19% mniejsze. Jest to szczególnie ważne w przypadku sieci komórkowych.
Dekodowanie WebP w przypadku przewijania trwa krócej. W Mrugnięcie, przewijanie lub zmienianie kart może ukrywanie i wyświetlanie obrazów, co powoduje wstrzymanie animacji, a następnie przeskoczył do innego punktu. Nadmierne wykorzystanie procesora, które skutkuje animacje upuszczające klatki mogą również wymagać od dekodera przewijania do przodu animację. W takich sytuacjach animowany WebP uzyskuje 0, 57 raza większe czas dekodowania² do formatu GIF, dzięki czemu mniej zacinają się podczas przewijania i przyspieszenia przywracania po nagłym skokach wykorzystania procesora. To jest ze względu na 2 zalety WebP w porównaniu z GIF-ami:
- Obrazy WebP przechowują metadane informujące, czy każda ramka zawiera kod alfa, co eliminuje konieczność dekodowania ramki. Prowadzi to do dokładniejszego wnioskowania, które poprzednie klatki były i ramki, co pozwala ograniczyć niepotrzebne dekodowanie poprzednich ramki.
- Podobnie jak nowoczesny koder wideo, koder WebP automatycznie dodaje funkcję klatek kluczowych w regularnych odstępach czasu (nie robi tego większość koderów GIF-ów). To znacznie poprawia przewijanie w długich animacjach. Ułatwianie wstawienie takich ramek bez znacznego zwiększania rozmiaru obrazu, WebP dodaje „metoda mieszania” flaga dla każdej klatki, a także metody usuwania klatek stosowane w GIF-ie. Umożliwia to rysowanie klatki kluczowej tak, jakby cały obraz został wyczyszczony. zmienić kolor tła bez wymuszania w pełnym rozmiarze.

Wady animowanego formatu WebP w porównaniu z animowanymi GIF-ami

W przypadku braku przewijania proste dekodowanie WebP jest bardziej bardziej obciążają procesor niż GIF. Dekodowanie Lossy WebP trwa 2,2 raza dłużej niż GIF, natomiast bezstratny protokół WebP zajmuje 1,5 raza więcej.
Obsługa WebP nie jest prawie tak powszechna jak obsługa GIF-ów, jest więc uniwersalny.
Dodanie obsługi WebP do przeglądarek zwiększa ilość kodu oraz na powierzchni ataku. W Blink jest to około 1500 dodatkowych wierszy kodu (w tym biblioteki demux WebP i obrazu WebP po stronie Blink-side dekodera). Ten problem może zostać zredukowany w przyszłości, jeśli WebP i WebM mają bardziej wspólny kod dekodowania, a jeśli protokół WebP możliwości są brane pod uwagę w WebM.

Dlaczego nie obsługujemy tylko WebM w <img>?

Obsługa formatów wideo w <img> może być korzystna w perspektywie długoterminowej. . Robię to jednak teraz, ponieważ WebM w języku <img> może wypełnić proponowana rola animowanej technologii WebP jest problematyczna:

Podczas dekodowania ramki, która wymaga wcześniejszych klatek, WebM wymaga: O 50% więcej pamięci niż animowany WebP, by utrzymać minimalną liczbę poprzednie klatki³.
Obsługa kodeka i kontenera wideo znacznie się różni w różnych przeglądarkach urządzenia. Aby ułatwić automatyczne transkodowanie treści (np. serwerów proxy oszczędzających przepustowość sieci), przeglądarki muszą dodać nagłówki akceptujące informujące, jakie formaty obsługują tagi graficzne. Nawet to może być niewystarczające, ponieważ typy MIME, takie jak „video/webm”, lub „video/mpeg” nieruchomy Nie podawaj obsługi kodeka (np. VP8 lub VP9). Z drugiej strony format WebP zostaje wspólnie zamrożony, a dostawcy zgadza się na wysyłanie animowanego WebP, czyli zachowania WebP we wszystkich UA powinny być spójne; a ponieważ atrybut „image/webp” Zaakceptuj nagłówek już użyto do wskazania obsługi WebP, nie ma nowych akceptacji zmian nagłówka które są niezbędne.
Stos wideo Chromium jest zoptymalizowany pod kątem płynnego odtwarzania i zakłada, że w jednym lub dwóch momentach obecnie się znajdujesz. W efekcie implementacja jest agresywna w systemie zasobów (wątków, pamięci itp.), aby zmaksymalizować jakość odtwarzania. Taki nie skaluje się dobrze do wielu filmów jednocześnie, wymagają zmian w celu dostosowania ich do użycia na stronach internetowych z dużą ilością obrazów.
WebM nie uwzględnia obecnie wszystkich technik kompresji od WebP. W rezultacie ten obraz kompresują się znacznie lepiej w przypadku WebP niż inne rozwiązania:

¹ W przypadku wszystkich porównań między animowanymi GIF-ami i animowanymi formatami WebP wykorzystała korpus zawierający około 7000 animowanych obrazów GIF pobranych losowo z internetu. Te obrazy zostały przekonwertowane do formatu WebP za pomocą pliku „gif2webp” za pomocą ustawienia domyślne (utworzone na podstawie najnowszej drzewo źródłowe libwebp na dzień 8.10.2013 r.). Liczby porównawcze to średnie wartości dla tych obrazów.

² Czasy dekodowania obliczono za pomocą najnowszych bibliotek libwebp ToT Blink na dzień 8.10.2013 r. za pomocą narzędzia analizy porównawczej. Czas zdekodowania dzięki przewijaniu”. jest obliczany w ten sposób: „Zdekoduj pięć pierwszych klatek, wyczyść klatkę buforuj pamięć podręczną, zdekoduj pięć kolejnych klatek itd.”.

³ WebM zachowuje 4 ramki referencyjne YUV w pamięci, z każdą ramką zapisywanie (szerokość 96)*(wysokość 96) pikseli. W przypadku YUV 4:2:0 potrzebujemy 4 bajtów na 6 piks. (lub 3/2 bajtów na piksel). Takie ramki referencyjne 4*3/2*(width 96)*(height 96) B pamięci. WebP byłby natomiast potrzebna jest tylko poprzednia klatka (w formacie RGBA), czyli 4*width*height B pamięci.

⁴ Animowane renderowanie WebP wymaga przeglądarki Google Chrome w wersji 32 lub nowszej