Minificare Concatenare și Compresie GZIP
Obținerea celei mai bune viteze de încărcare pentru pagină nu este întotdeauna doar despre caching. Un sistem de cache nu este suficient pentru a reduce timpul de încărcare pentru paginile dvs. și pentru a le optimiza. Trebuie să ai grijă de imaginile tale și de codul tău.
Există mai multe tehnici pentru a face codul WordPress mai rapid de încărcat, mai slab și mai agil.
În acest articol, vom explica la ce ne referim când vorbim despre optimizarea codului WordPress – fișiere HTML, CSS și JavaScript. De asemenea, veți cunoaște cele mai populare tehnici de optimizare: minificare concatenare și compresie GZIP.
Ce Înseamnă Optimizarea Codului în WordPress?
Unul dintre marile avantaje ale rulării unui site WordPress este posibilitatea de a instala teme și plugin-uri de înaltă calitate pentru a personaliza conținutul site-ului dvs.
Cu toate acestea, ar trebui să fiți atenți la calitatea produselor pe care le instalați pe site-ul dvs. web. Nu numai că ar trebui să provină din surse de încredere, dar ar trebui să respecte și regulile WordPress.
Instalarea de noi pluginuri sau teme pe site-ul dvs. este o sarcină pe care nu ar trebui să o luați cu ușurință, deoarece codul lor poate afecta grav performanța site-ului dvs.
O temă WordPress ușoară se va încărca de obicei mai repede și va fi mai prietenoasă cu performanța decât o temă încărcată cu grafică, widget-uri și efecte speciale.
În aceeași notă, păstrarea numai a pluginurilor de care aveți cu adevărat nevoie pentru a rula site-ul dvs. este cheia pentru menținerea performanței excelente.
Eliminați și ștergeți toate pluginurile pe care nu le găsiți eficiente sau de care nu mai aveți nevoie.
După ce ați analizat cu atenție de câte pluginuri aveți nevoie pe site-ul dvs., puteți continua la pasul următor: asigurându-vă că codul de la baza site-ului dvs. WordPress este optimizat.
Obiectivul dvs. ar trebui să fie eliminarea descărcărilor inutile de resurse, reducerea la minimum a dimensiunilor descărcărilor și optimizarea și comprimarea fișierelor de bază (HTML, CSS și JavaScript pentru a începe). Este o modalitate bună de a vă optimiza performanța Core Web Vitals – în special, veți da un impuls Largest Contentful Paint.
Puteți face acest lucru prin:
- Comprimarea fișierelor, ceea ce înseamnă codificarea informațiilor folosind mai puțini biți
- Eliminarea datelor inutile
Acest lucru se poate realiza prin adoptarea a trei tehnici:
- Minificare
- Concatenare
- Compresie GZIP.
Ce este Minificarea?
Minificarea este tehnica de optimizare care reduce dimensiunea fișierelor dvs. Poate fi aplicat pe fișiere JavaScript, CSS și HTML.
Reducerea dimensiunii este posibilă deoarece, atunci când fișierele sunt reduse, toate spațiile, comentariile, întreruperile de rând sau caracterele suplimentare inutile sunt eliminate din codul sursă.
Dacă vă gândiți bine, spațiile albe și comentariile sunt facilități pentru dezvoltatori, dar nu sunt cruciale pentru utilizatorul final. Scăparea de ele face fișierul mai dificil de citit, dar mult mai ușor.
Deoarece fișierele minimizate sunt mai compacte, browserele le pot furniza utilizatorului final mai rapid.
În plus, odată ce conținutul minimizat este generat, acesta poate fi folosit pentru un număr infinit de solicitări.
Pentru majoritatea site-urilor WordPress, minificarea nu este soluția definitivă pentru un site mai rapid, deoarece reducerea dimensiunii implică de obicei câțiva kilo-octeți pe site. Totuși, acest lucru depinde de tema și de pluginurile pe care le utilizați. Dacă codul lor abundă în fișiere JavaScript și CSS, nu există nicio îndoială că veți observa o îmbunătățire după minificare.
Minificare JavaScript
Minificarea JavaScript elimină comentariile JavaScript (// …) și toate spațiile suplimentare din codul sursă.
De obicei, codul sursă al unui fișier Javascript poate arăta ca exemplul de mai jos.
Dar, atunci când îi aplicați minimizarea, rezultatul va arăta ca codul de mai jos.
Minificare CSS
Minimizarea CSS elimină spațiile și comentariile suplimentare din fișierele CSS (/* … */).
Iată cum poate arăta un fișier CSS obișnuit:
Iată rezultatul minimizării CSS:
Minificare HTML
Fișierele HTML pot fi și ele minimizate. Minimizarea elimină comentariile (<!– … –>), spațiile suplimentare, întreruperile de rând și conținutul similar.
Când reduceți acest fișier, iată un exemplu despre cum arată:
Este posibil să fie mai puțin lizibil, dar cu siguranță mai ușor.
Puteți găsi mai multe detalii în articolul nostru: Ce este Minificarea și ce Înseamnă – Explicat pe Înțelesul Tuturor.
De ce este Minimizarea Bună Pentru Performanța Site-ului dvs.?
Conform unor teste Google, minimizarea vă poate reduce dimensiunea paginii cu economii de compresie de până la 63%.
Există mai multe avantaje în furnizarea de conținut redus către utilizatorii finali.
Iată cele mai importante:
- Timp de încărcare mai rapid – Utilizatorii tăi vor primi același serviciu de pe site-ul tău, dar mai rapid. Acest lucru este posibil datorită cantității reduse de date procesate pentru fiecare solicitare.
- Economisirea utilizării lățimii de bandă – Rețelele pot transmite mai puține date.
- Utilizare mai mică a resurselor – Acest lucru se întâmplă deoarece fiecare solicitare va procesa o cantitate redusă de date.
Ce este Concatenarea Fișierelor?
Împreună cu minimizarea fișierelor, puteți concatena fișiere CSS sau JavaScript într-unul singur.
Pentru a spune simplu, această tehnică copiază tot textul din fișierele CSS (sau JavaScript), apoi îl lipește din nou pentru a compune un singur fișier mare, unic.
Scopul este să aveți un singur fișier de, (CSS sau JavaScript), dar din motive de compatibilitate, uneori poate fi mai bine să creați câteva fișiere mari, în loc de unul unic.
Concatenarea este Încă Benefică Pentru Site-ul dvs.?
Înainte de apariția protocolului HTTP/2, concatenarea era considerată o bună practică și utilă pentru a reduce numărul de solicitări de fișiere.
Conform experienței celor de la WP Rocket, concatenarea nu va aduce beneficii pe HTTP/2.
Când utilizați WP Rocket de exemplu, veți observa memento-ul care recomandă să nu activați concatenarea fișierelor dacă site-ul dvs. rulează pe HTTP/2, ca în imaginea de mai jos.
HTTP/2 este protocolul care modifică modul în care datele sunt formatate și transferate între client și server. Se bazează pe un strat încadrat binar.
Aceasta înseamnă că mesajele HTTP vor fi împărțite în cadre independente, intercalate și apoi reasamblate la celălalt capăt. Acest lucru permite clientului să ruleze mai multe fluxuri de date în cadrul aceleiași cereri.
În acest context, concatenarea fișierelor devine învechită.
Comprimarea Fișierelor dvs. cu Compresia GZIP
În zilele noastre, browserele moderne pot citi fișiere HTML, CSS și JavaScript comprimate. Pentru a le comprima, compresia GZIP este cea mai bună soluție.
Cu compresia GZIP, fișierele dvs. sunt „comprimate” și trimise pe internet în pachete mult mai mici. Acest lucru reduce automat timpul necesar pentru încărcarea acelor active pentru utilizatorul final.
Citiți articolul nostru detaliat pentru a înțelege ce este compresia GZIP pentru WordPress și cum funcționează.
Cum Vă Poate Ajuta WP Rocket să Vă Optimizați Codul
Există mai multe instrumente care vă pot reduce și comprima fișierele. Pentru o revizuire completă a instrumentelor de minimizare, puteți consulta articolul nostru despre cele mai bune instrumente gratuite de minimizare CSS și JavaScript.
Dacă doriți să optați pentru o soluție completă all-in-one, WP Rocket este cel mai simplu mod de a vă optimiza codul în câteva clicuri.
Pluginul de cache și optimizare aplică automat compresia GZIP și include mai multe funcții pentru a reduce, combina și optimiza CSS și JavaScript.
Acestea sunt prezentate pe scurt mai jos.
Compresie GZIP cu WP Rocket
Aplicarea compresiei GZIP în fișierele dvs. cu WP Rocket este un proces automat care se întâmplă din momentul activării pluginului.
Comprimarea GZIP poate funcționa numai dacă este activată la nivel de server. Regulile de compresie necesare ar trebui să fie plasate în fișierul dvs. .htaccess, care se află în directorul rădăcină al site-ului dvs.
La activarea sa, WP Rocket va aplica regulile de compresie GZIP în fișierul .htaccess folosind modulul mod_deflate. Acest proces este automat pe serverele Apache, așa că dacă utilizați unul, nu trebuie să faceți nimic. WP Rocket se ocupă automat de tot.
Pe de altă parte, dacă site-ul dvs. rulează pe un server NGINX, acesta nu va avea un fișier .htaccess, iar WP Rocket nu va putea aplica regulile de compresie GZIP în mod automat.
Dacă acesta este cazul, puteți utiliza această configurație alternativă pentru NGINX oferită de unul dintre clienții lor.
Pentru mai multe detalii despre compresia GZIP și WP Rocket, consultați documentația lor.
Activarea Minimizării și a Concatenării Fișierelor cu WP Rocket
Opțiunile de minimizare și concatenare sunt incluse în fila Optimizare fișier de pe tabloul de bord WP Rocket.
Veți găsi o secțiune dedicată minificării și concatenării pentru fișierele CSS și alta pentru fișierele JavaScript.
Dacă activați minimizarea CSS, minimizarea JavaScript sau ambele, puteți exclude anumite URL-uri de fișier din procesul de reducere prin copierea și inserarea lor în câmpurile de excludere ale acestora din setări.
În general, minimizarea și concatenarea nu ar trebui să creeze probleme pe site-ul dvs. Dacă o face, este de obicei pentru că temele sau pluginurile pe care le utilizați nu au definit dependențe corecte pentru scripturile sau foile de stil.
Depanarea problemelor de minimizare poate fi dificilă atunci când aveți multe fișiere de verificat. De aceea, vă oferim acest ghid de depanare.
Concluzie
Optimizarea codului WordPress nu trebuie să vă dea bătăi de cap. Dacă utilizați instrumentul potrivit, optimizarea codului poate fi parțial automatizată. WP Rocket se va ocupa automat de compresia fișierului GZIP și va adăuga regula necesară fișierului dvs. .htaccess dacă site-ul dvs. rulează pe Apache.
De asemenea, minimizarea și concatenarea vă pot face fișierele mai rapide și mai ușoare prin eliminarea elementelor inutile. Cu WP Rocket, puteți obține cu ușurință rezultate excelente în câteva clicuri.
Economisiți timp și lăsați-l pe WP Rocket să facă treaba pentru dvs.!
Tutorialele, documentația și echipa lor de asistență vă stau la dispoziție dacă aveți probleme sau dacă aveți întrebări despre aceste caracteristici.
