WordPress 5.3 přinesl mnoho vylepšení v oblasti blokového editoru Gutenberg a funkcí pro vývojáře. V následujícím příspěvku se však zaměřím pouze na práci s obrázky.
Obrázky, které uživatelé nahrávají na web mohou být předem optimalizovány v nějaké aplikaci pro práci s grafikou. V době uvedení první verze WordPressu by asi nikoho nenapadlo nahrávat obrázky na web o velikosti větší než 200 kb. Dnes postačí, když obrázek bude alespoň menší než 2560×2560 px. WordPress následně zpracovává několik definovaných náhledů, které používá šablona vašeho webu.
Co se stane, když nahrajete obrázky ve vysokých rozměrech a velikosti, např. přímo z fotoaparátu? Takové snímky obvykle mnohem větší, než je třeba, a nejsou optimalizovány pro použití na webu. Fotografie pořízená průměrným moderním chytrým telefonem má velikost souboru snadno přes 5 MB. Fotografie pořízené kvalitním fotoaparátem mohou být mnohem větší.
Na webovém serveru Norbou WordPress jsem úspěšně otestoval zpracování obrázku o velikosti 18 800 × 10 200 px, ale je třeba si uvědomit, že smyslem webového serveru je především vyřizovat požadavky návštěvníků vašich webových stránek a ne plnit roli grafického editoru. Pokud nepoužíváte dodatečná pravidla pro omezení maximální velikosti obrázků, např. pomocí zásuvných modulů, pak bude pro váš web platit následující.
WordPress 5.3 zavádí nový způsob správy těchto obrázků tím, že detekuje velké obrázky a generuje jejich "maximální velikost optimalizovanou pro web".
Jak to funguje?
Při nahrávání nového obrázku WordPress zjistí, zda se jedná o "velký" obrázek, a to tak, že zkontroluje, zda jeho výška nebo šířka přesahuje prahovou hodnotu. Výchozí prahová hodnota je 2560×2560 px.
Pokud je výška nebo šířka obrázku nad touto prahovou hodnotou, bude zmenšen a pojmenován s příponou názvu -scaled a bude použit jako největší dostupná velikost. Pro zmenšení WordPress používá 100% kvalitu komprimace formátu jpeg, proto mohou být tyto verze někdy i datově větší než původní obrázek.
V tomto případě zůstává původní soubor obrázku uložen v adresáři uploads a jeho název je uložen v dalším klíči pole v poli image meta: original_image. Aby bylo možné vždy získat cestu k původně nahranému obrázku, byla zavedena nová funkce wp_get_original_image_path().
Pro generování náhledových velikostí, které používá šablona vašeho webu je využíván původní nahraný nezmenšený originál, takže zpracování není nijak méně náročné na prostředky serveru.
Tato vylepšení však umožnila automaticky otáčet nahrané fotografie podle údajů EXIF z fotoaparáru. Také byly přidány další dvě výchozí velikosti obrázků pro lepší podporu displejů s vysokou hustotou, 2048 px a 1536 px.
Jak je z popisu zřejmé, výsledkem nové funkce určitě nebude úspora místa na serveru, ba právě naopak.
Takto vypadá jeden vzorový nadměrný obrázek po nahraní do knihovny médií:
image.jpg @ 1,94 M
image-scaled.jpg @ 1,33 M*
image-2048x996.jpg @ 886,04 k*
image-1920x933.jpg @ 781,54 k
image-1800x875.jpg @ 691,42 k
image-1536x747.jpg @ 513,63 k*
image-1500x630.jpg @ 428,96 k
image-1500x430.jpg @ 299,56 k
image-845x684.jpg @ 284,28 k
image-1210x423.jpg @ 253,97 k
image-885x430.jpg @ 209,87 k
image-845x321.jpg @ 162,09 k
image-700x340.jpg @ 153,49 k
image-495x400.jpg @ 131,73 k
image-400x194.jpg @ 83,92 k
image-260x185.jpg @ 69,17 k
image-287x140.jpg @ 65,60 k
image-350x100.jpg @ 61,22 k
image-180x88.jpg @ 52,32 k
image-80x39.jpg @ 43,83 k
image-36x36.jpg @ 42,56 k
Jeden obrázek o původní velikosti 1,94 MB po zpracování zabírá na webovém serveru zabírá na webu se šablonou Enfold 8,3 MB.
Autor komentoval záměr tak, že funkce sice zvýší využití úložného prostoru, ale sníží využití šířky pásma na front-endu, což povede k poměrně výrazným úsporám (času i peněz) pro uživatele, hostingové společnosti i návštěvníky stránek. Šířka pásma je "dražší" než úložiště v podstatě ve všech případech.
Kompatibilita
WordPress 5.3 byl vydán 12. listopadu 2019. Ujistěte se, že pluginy pro práci s obrázky, např. přegenerování náhledů jsou s novou funkcionalitou WordPressu kompatibilní.
Externí služby pro optimalizaci a globální distribuci obrázků mohou mít nastaveny své vlastní limity pro zpracování obrázků.
Vypnutí škálování
Měřítko pro škálování je řízeno filtrem big_image_size_threshold. Vrácení hodnoty false z volání zpětného filtru jej zakáže.
add_filter( 'big_image_size_threshold', '__return_false' );
Závěr
Ačkoli jsem dospěl ke stejnému závěru, že pro většinu webů je optimální maximální rozměr obrázků uchovávaných na web serveru 2560×2560 px, preferuji novou vestavěnou funkci vypnout a používat jiné metody zpracování nadměrných obrázků, které nadměrný obrázek bezztrátově zmenší na nastavený rozměr a přepíší oroginální soubor, aby se neplýtvalo místem a nebyly problémy s kompatibilitou. Pokud jste jej měli aktivní už před aktualizací na WordPress 5.3, pravděpodobně zpracování obrázků nadále probíhá podle jeho pravidel i bez vypnutí vestavěného škálování.