Îndepărtează Bloat Lean It Out

În ultimele două postări din această serie, am discutat despre modul în care am trecut de pe site-urile mici la aplicațiile și site-urile enorme pe care le avem astăzi. Am discutat câteva dintre alegerile pe care le putem face în legătură cu înclinarea site-ului web WordPress, ce să avem grijă și de ce fiecare lucru important. 

În acest post, voi da câteva exemple concrete despre ceea ce vorbesc. Acesta nu va fi un ghid de sus drept, care se va potrivi perfect fiecare caz de utilizare, dar intenția este de a oferi câteva exemple pentru a vă ajuta să începeți cu curățarea și tunderea de biți străini pe blog-ul dvs. pe care nu nevoie.

Înlăturarea fișierelor șablon

Mai jos, am luat o bucată de cod HTML dintr-un proiect recent. Site-ul original conținea o mulțime de lucruri de care nu avea nevoie. De-a lungul timpului, compania a acumulat pluginuri și adăugiri la tema lor și acum se confruntă cu momente grele de încărcare greoaie. 

În acest caz, soluția cea mai directă ar fi să pui un strat de caching în fața lui și să se facă. Dar asta nu rezolvă cu adevărat problema. Unul dintre lucrurile pe care le-am făcut a fost eliminarea a aproximativ 50% din codul HTML în temă, rescrierea acestuia acolo unde este necesar și ajustarea CSS în consecință pentru a menține designul la fel.

Iată o parte din codul HTML care se afla în tema originală. Am rezolvat puțin formatarea.

Titlul postului merge aici

  • Numele categoriei
postat pe 28 februarie 2014 - 14:40 de Bob The Admin
cometariu
Afișați imaginea titlului aici

postați conținut aici

Nu este cel mai rau HTML pe care l-am vazut vreodata si absolut nici una dintre partile care au facut site-ul mult mai lent, dar este perfect pentru ceea ce incerc sa arat aici: Exista o multime de curatare care se poate face. Există o cantitate excesivă de împachetări și curățare div element. 

Dupa o anumita curatare am ajuns cu:

Titlul postului merge aici

  • Numele categoriei
postat pe 28 februarie 2014 - 14:40 de Bob The Admin
cometariu
Afișați imaginea titlului aici

postați conținut aici

Această bucată de cod are cea mai mare parte a ambalajelor sale dezbrăcate. Dacă nu aveți nevoie de ele, nu le adăugați. Folosirea corectă a CSS vă va permite să evitați să utilizați cele mai multe, dacă nu toate, pachete din piesa originală de cod. 

Acest exemplu ar putea părea nesemnificativ, și pe cont propriu, este. Dar faceți acest lucru pretutindeni pentru fiecare șablon din tema dvs. și veți termina cu o producție semnificativ mai mică. 

Atunci când faceți redarea site-ului dvs., browserele vor fi mai fericite pentru acesta, vizitatorii de pe mobil vor aprecia site-ul dvs. să se deschidă mai repede pe telefoane, deoarece mai puține date înseamnă perioade de încărcare mai rapide și veți fi mai fericiți când trebuie să ajustați ceva în cod.

Mai sunt multe de discutat aici, dar această serie nu este menită a fi ghidul definitiv pentru scrierea unui HTML curat. În schimb, scopul este să vă informați cu privire la posibilele îmbunătățiri pe care le puteți aplica site-ului dvs.. 

Rachel McCollin a scris un ghid foarte elaborat și extins pentru a construi o temă pentru WordPress. Detaliile ei de serie, în detalii de excepție cum să construiască o temă și exemplele ei sunt în întregime goale de orice bloat, pot recomanda pe oricine caută unele indicii despre cum să-și sorteze HTML-ul pentru a arunca o privire la seria ei.

Împingerea Plugin-urilor noastre

Acum, că am analizat temele, să vorbim de plugin-uri.

O mare parte din aceleași reguli se aplică aici. Mai curat, plugin-ul este scris, cu atât va fi mai ușor să îl ajustați atunci când trebuie să faceți acest lucru. Amintiți-vă că veți pierde compatibilitatea dacă ajustați un plugin direct, astfel că este în general mai bine să încercați să evitați acest lucru.

Plugin-urile vin în toate dimensiunile. Asta înseamnă că unii fac ceea ce trebuie să facă și nimic mai mult, alții fac ceea ce trebuie să facă și multe alte lucruri. Funcția bloat nu este neobișnuită și ceva cu care doriți cu adevărat să fiți atenți când selectați pluginurile pe care doriți să le utilizați. În unele (dar nu toate) cazuri, cu cât mai multe pluginuri aveți, lucrurile mai lent vor ajunge să fie. 

Desigur, acest lucru depinde în mare măsură de calitatea codului pluginului. Acesta este motivul pentru care este important să vă asigurați că efectuați diligența dvs. atunci când investigați plugin-urile pe care urmează să le instalați. 

În mod individual, este posibil ca fiecare plugin să nu pară să facă prea mult, dar dacă pune împreună un număr mare de pluginuri slab codificate, veți observa o scădere semnificativă a performanței.

Când scriam inițial acest articol, aveam de gând să ating o mulțime de lucruri pentru a ține ochii la selectarea pluginurilor; cu toate acestea, Barıș Ünver a scris un ghid excelent cu privire la ce să caute atunci când aleg un plugin și nu trebuie să repet cuvintele lui aici. 

În schimb, citiți ghidul său dacă căutați sfaturi despre ce plugin să utilizați.

Ce urmeaza?

Mai întâi, să rezumăm: Curățitorul pe care îl scrieți - fie HTML, PHP, JavaScript, C - cu atât mai ușor va fi menținerea și ajustarea ulterioară. Acest post a încercat să vă dea câteva mânere pentru curățarea șabloanelor dvs. și se referă la resurse excelente pentru a începe acest lucru și pentru a găsi pluginuri.

Unii dintre voi ați observat că nu am vorbit despre nimic legat de CSS, JavaScript, minimizarea elementelor și alte forme de optimizare. Asta pentru ca urmatorul post va fi exact despre asta.

Între timp, anunță-mă în comentariile care sunt gândurile tale după ce ai citit!

Cod