Ce este un JPEG progresiv?

JPEG progresiv este o metodă de codificare a imaginilor JPEG în care datele sunt stocate astfel încât imaginea să fie afișată progresiv în timpul încărcării. Mai întâi se încarcă o versiune cu rezoluție scăzută sau mai puțin detaliată, apoi, pe măsură ce se primesc noi date, detaliile se îmbunătățesc.

Diferențe față de JPEG-ul de bază (Baseline):

JPEG progresiv	JPEG de bază
Imaginea este afișată progresiv, îmbunătățindu-se.	Imaginea se încarcă de sus în jos, pe blocuri.
Potrivit pentru conexiuni lente.	Potrivit pentru conexiuni rapide.
Fișierul este puțin mai mare.	Fișierul este puțin mai mic.
Necesită mai mult timp de procesare pentru decodare.	Necesită mai puțin timp de procesare pentru decodare.

Aplicare în Frontend:

• Îmbunătățirea experienței utilizatorului pe internet lent.
• Percepție vizuală a unei încărcări mai rapide a conținutului.
• Poate fi combinat cu lazy loading pentru optimizare.

Din punct de vedere tehnic, JPEG progresiv împarte coeficienții de frecvență ai imaginii în mai multe scanări. Mai întâi se transmit coeficienții de frecvență joasă (structura generală), apoi cei de frecvență înaltă (detalii).

Exemplu de conversie a JPEG-ului de bază în progresiv folosind ImageMagick:

# base.jpg - fișierul original
# progresiv.jpg - fișierul rezultat
convert base.jpg -interlace Plane progresiv.jpg

Utilizarea în CSS sau HTML nu diferă de JPEG-ul obișnuit, deoarece acesta este un format de codare intern:

<img src="progresiv.jpg" alt="Imagine progresivă">

.background {
  background-image: url('progresiv.jpg');
}