Squoosh: képtömörítés a böngészőben

A Squoosh a böngészőben tömöríti és méretezi át a képet, a feltöltés előtt, és közben a kép nem hagyja el a gépedet.

This content is not available in your language yet.

A Squoosh a Google Chrome Labs képtömörítő webalkalmazása. A squoosh.app oldalon a böngészőben csökkented a kép fájlméretét, különböző formátumok közül választva. WordPress-fejlesztésben arra jó, hogy a médiatárba kerülő képet előtte a kellő méretre és formátumra hozd, vagy hogy egy-egy kép különböző beállításait kipróbáld.

A projekt README-je szerint: „Squoosh does not send your image to a server. All image compression processes locally.” Az oldal is ezt írja: a képek nem hagyják el az eszközödet, mert a Squoosh a munkát helyben végzi. Ügyfél képét tehát nem töltöd fel idegen szerverre.

Kép betöltése

Nyisd meg a squoosh.app oldalt.
Húzd a képet az ablakra (Drop), vagy illeszd be vágólapról (Paste).
Kipróbálhatod egy mintaképpel is, ezek az Or try one of these: felirat alatt vannak.

Összehasonlítás és beállítás

A betöltés után a Squoosh az eredeti és a tömörített képet is mutatja, így a változást szemmel ellenőrizheted. A beállításokat a kép két oldalán külön állíthatod, így két különböző beállítást is összevethetsz.

Mindig nézd meg a képet nagyítva is, nemcsak a fájlméretet. Az alacsony minőség foltosodást okoz, főleg sima felületeken és arcokon.

Formátum

A forráskód szerint a Squoosh ezeket a kimeneti formátumokat kínálja:

Felületfelirat	Fájlkiterjesztés
MozJPEG	`.jpg`
WebP	`.webp`
AVIF	`.avif`
OxiPNG	`.png`
JPEG XL (beta)	`.jxl`
WebP v2 (unstable)	`.wp2`

A böngésző saját JPEG, PNG és GIF kódolója is elérhető. A béta és instabil jelölésű formátumokat ne használd éles oldalon, a böngészők nem támogatják őket.

Minőség

A Quality csúszka 0 és 100 között állítható. Alacsonyabb érték kisebb fájlt ad, de romlik a kép. Fotónál a WebP vagy a MozJPEG a jó kiindulópont, logónál és ábránál az OxiPNG vagy a WebP a Lossless kapcsolóval.

A WebP beállításai közt van az Effort (0 és 6 között): minél magasabb, annál tovább tart a tömörítés. A Lossless bejelölésével veszteségmentes módba váltasz. Az Advanced settings alatt további finomhangolás van, a Preserve transparent data az átlátszó részek adatát őrzi meg.

Átméretezés (Resize)

A Resize kapcsolóval méretezheted át a képet.

Width és Height: a méret pixelben. A Maintain aspect ratio bejelölve az arány megmarad.
Preset: százalékos előbeállítás (például 50%) vagy Custom.
Method: az átméretezés módja, például Lanczos3, Mitchell vagy Triangle (bilinear). Fotónál az alapértelmezés jó.
Fit method (ha az arányt nem tartod meg): Stretch vagy Contain.

Letöltés

A tömörített képet a felületen lévő letöltési lehetőséggel mentheted el, mindig a megfelelő oldalét. Töltsd fel a fájlt a WordPress médiatárába, és ellenőrizd az oldalon.

WordPress-specifikus tudnivalók

Mekkora képet tölts fel?

A WordPress a feltöltött képből kisebb méreteket is generál. A big_image_size_threshold szűrő a WordPress hivatalos referenciája szerint alapértelmezetten 2560 pixel: ha a kép szélessége vagy magassága ennél nagyobb, a WordPress lekicsinyíti, és a kicsinyített változat lesz a legnagyobb elérhető méret. A szűrő a WordPress 5.3.0 óta van meg.

Ebből a gyakorlatban ez következik:

Nincs értelme 2560 pixelnél nagyobb képet feltölteni, a WordPress úgyis lekicsinyíti.
Ha tudod, hogy a képet legfeljebb mekkora helyen jeleníti meg a téma, méretezd át előre arra (a Resize résznél), és csak utána töltsd fel.
Az átméretezett, tömörített kép gyorsítja az oldalt, ezt a GTmetrix mérésén is látni fogod, például az LCP értéknél.

A küszöböt szükség esetén kikapcsolhatod, ha a szűrő false értéket ad vissza:

add_filter( 'big_image_size_threshold', '__return_false' );

A WordPress referenciájának egy hozzászólása szerint egyes esetekben későbbi prioritás kell hozzá, például 100.

WebP a WordPressben

A WordPress 5.8 óta a WebP képet feltöltheted és használhatod úgy, mint a JPEG-et vagy a PNG-t. Ehhez a szerver képkönyvtárának támogatnia kell a WebP-t: Imagick vagy LibGD WebP-támogatással. Ha ez nincs meg, a feltöltés hibát ad. A WordPress bejelentése szerint az animált és az átlátszó (alfa) WebP-nek az átméretezett változata nem támogatott, ilyenkor veszteséges változat készül.

Az AVIF-ről az 5.8-as bejelentés csak jövőbeli lehetőségként ír. A mai AVIF-támogatást a WordPress saját dokumentációjában ellenőrizd, mielőtt AVIF-et töltesz fel.

Ha sok kép van

A Squoosh egy kép egy lépésben dolgozik, kézi munkára való. Ha a médiatár képeit tömegesen kell optimalizálni, ahhoz a HelloIMG való: a feltöltött képeket WebP-re (vagy AVIF-re) konvertálja a WordPress-oldalon.

Mire figyelj

Az eredetit tartsd meg, a tömörített képet másik néven mentsd. A veszteséges tömörítést nem lehet visszacsinálni.
A Squoosh a README szerint Google Analyticset használ: gyűjti a látogatói alapadatokat, a kép mérete előtte és utána, a PWA-nál pedig a telepítés típusát és idejét. A kép tartalmát nem küldi el.
Böngészőben fut, ezért nagyon nagy képnél lassú lehet.

Hasznos linkek

Published: 31 October 2026