Optimizarea automată a scripturilor și a stilurilor este o sabie cu două tăișuri

Cu siguranță ați auzit într-un colț de internet un guru vorbind despre importanța WPO. Pe lângă verificarea semnificației acestui acronim, poate te-ai gândit că sfatul acelui guru este cheia pentru optimizarea site-ului tău web și, în sfârșit, pentru a-i crește performanța.

Nu voi fi eu cel care o pune la îndoială. WPO este important, dar trebuie de asemenea să fii extrem de atent atunci când pui în practică unii dintre sfaturile experților de acolo, indiferent cât de inteligentă este acea persoană.

În WordPress, este obișnuit să citiți că există o serie de plugin-uri pe care trebuie să le instalați pentru a îmbunătăți performanța site-ului dvs. Un plugin SEO aici, un plugin cache acolo, un plugin de securitate este întotdeauna necesar... Pe scurt, o discuție tipică pentru a-i învăța pe începătorii WordPress care arată ca un joc video Pokemon: trebuie să-i prind pe toate (pluginurile)!

Bunul simț, deși este cel mai puțin comun dintre simțuri, ne spune că în WordPress trebuie să folosim cel mai mic număr posibil de pluginuri pentru a acoperi numărul maxim de funcționalități de care avem nevoie. Nu este necesar să instalați toate pluginurile existente. De fapt, nu este o practică recomandată. Optimizarea site-ului dvs. este mai complexă decât instalarea unui simplu plugin.

Atenție la pluginurile miraculoase din WordPress

Dar continuând cu subiectul anterior al WPO, un tip de plugin foarte popular în WordPress care îmbunătățește viteza site-ului dvs. prin minimizarea și combinarea scripturilor și stilurilor. În cele mai multe cazuri, aceste plugin-uri sunt vândute ca ghinion de argint pentru a atinge 100 la contoarele de performanță a site-ului web. Printre presupusele sale avantaje avem următoarele:

1. Minimizează stilurile CSS și scripturile JavaScript pentru a le reduce dimensiunea, astfel încât să fie nevoie de mai puțin timp pentru a le descărca.
2. Acestea combină toate stilurile CSS și scripturile JavaScript, astfel încât vizitatorii dvs. să încarce doar un singur fișier CSS și un singur script JavaScript, reducând numărul de solicitări pe care trebuie să le facă serverului.
3. Ei pun etichete async și defer , astfel încât web-ul să nu aștepte să se încarce scripturile și execuția să continue.
4. Ele elimină elementele inutile, cum ar fi emoji-urile.
5. Acestea permit aplicarea încărcării leneșe a imaginilor pentru a reduce și mai mult timpul de încărcare a site-ului dvs.

Ok, este perfect. Dar dacă sunteți unul dintre cei care instalează și activează un plugin de auto-optimizare fără a citi literele mici, îmi pare rău să vă spun că șansele ca site-ul dvs. să se rupă sunt foarte mari.

Pluginurile de optimizare automată pot părea un panaceu, dar pot ajunge să transforme site-ul dvs. într-un câmp minat. Și da, nu veți pleca de acolo fără să călcați pe unul și să spargeți o parte a site-ului dvs.

Motivul este ușor de explicat. Este posibil ca pluginurile WordPress care combină și minimizează scripturile JavaScript într-un singur fișier să nu mențină ordinea de execuție a acestor scripturi, ceea ce provoacă multe erori.

Dacă examinăm modul corect de a pune scripturile în coadă în WordPress, trebuie să mergem să vedem definiția funcției wp_enqueue_script() :

 wp_enqueue_script( string $handle, string $src = '', string[] $deps = array(), string|bool|null $ver = false, bool $in_footer = false )

Al treilea parametru al acestei funcții este o listă de dependențe, care nu este altceva decât numele altor scripturi de care scriptul pe care îl punem în coadă are nevoie pentru funcționarea sa corectă. Aceasta înseamnă că, până la rularea unui script, toate dependențele acestuia trebuie să fie deja încărcate în site.

Ordinea în care sunt puse în coadă scripturile este importantă, la fel și dependențele. WordPress are grijă să creeze o ordine corectă dacă folosim funcția wp_enqueue_script , asigurându-ne că scripturile sunt încărcate pe pagină așa cum ar trebui.

Problema este că dacă folosim un plugin care minimizează și combină fișiere JavaScript, fișierul JavaScript rezultat din combinație poate să nu respecte ordinea de execuție și dependențele pe care le-am definit. Și acesta este ceea ce face ca codul JavaScript să nu funcționeze.

Dacă ținem cont că în fiecare zi găsim mai mult JavaScript pe site-urile noastre WordPress pentru a implementa funcționalități, instalarea acestui tip de plugin-uri și activarea lor la nebuni poate fi foarte problematică.

Site-ul meu nu funcționează. Cine este cel de vină?

În calitate de dezvoltatori de pluginuri WordPress, este de datoria noastră să fim atenți și să încercăm să avem un impact minim asupra funcționalității altor plugin-uri. Cu toate acestea, destul de des întâlnim utilizatori ai pluginurilor noastre care se plâng că instalarea unuia dintre pluginurile noastre le distruge site-ul web.

După o investigație amănunțită, de multe ori apare problema deoarece folosesc aceste pluginuri de optimizare care combină scripturi și duc la erori JavaScript atunci când pluginul nostru rulează. De asemenea, rețineți că, deoarece tot JavaScript de pe web este îmbinat într-un singur script, dacă există o eroare care oprește execuția acelui script, nici un alt script nu va funcționa.

Pierderea de timp în schimbul de mesaje până când îl facem pe utilizator să ne dea acces la instalarea lor pentru a vedea în sfârșit că problema este utilizarea unui plugin pentru optimizarea automată este îngrozitoare. De aceea, dacă citiți acest lucru și aveți un site web WordPress, aș dori să știți că pluginurile pentru optimizarea automată a scripturilor și stilurilor sunt o sabie cu două tăișuri dacă nu le configurați corect.

Soluția este să excludeți din procesul de minificare și combinare orice script care nu funcționează cu pluginul de optimizare automată. Ceva ce nu este greu de făcut dacă știi ce scripturi să includă. Dar problema este că utilizatorii acestor plugin-uri cu optimizare automată fac asta rar.

Ca măsură de autoprotecție, dezvoltatorii de plugin-uri trebuie să includă filtre de compatibilitate în codul lor pentru a-și exclude scripturile din combinația implicită și pentru a minimiza aceste alte plugin-uri. Ceva care, pe lângă faptul că ia timp, nu este întotdeauna posibil să se realizeze.

Utilizați pluginuri de optimizare automată cu mare grijă

După acest articol, nu vreau să obțineți credința falsă că urăsc pluginurile cu optimizare automată. Succesul lor este un identificator clar că sunt folositori și că rezolvă o problemă pentru oameni. Chiar și noi am activat pluginul de optimizare automată pe care SiteGround îl oferă pe propriul nostru site web.

Dar rețineți următoarele: dacă folosim aceste tipuri de pluginuri, nu le putem pur și simplu să le activăm. Trebuie să le testăm temeinic pe site-ul nostru pentru a le putea configura corect în funcție de condițiile noastre specifice. De fiecare dată când instalăm un plugin nou, trebuie să verificăm din nou dacă procesul de minificare/combinare funcționează și site-ul este încă responsive.

Fiind puțin responsabil și având grijă, problemele cu care veți întâmpina minimizarea și combinarea scripturilor și stilurilor CSS cu pluginuri de optimizare automată pot fi reduse considerabil.

Imagine prezentată a lui Markus Spiske pe Unsplash.