Cum să minimizezi informațiile CSS / JavaScript în WordPress (3 strategii)

Doriți să minimizați documentele de pe pagina dvs. web WordPress?

Minimizarea informațiilor dvs. CSS și JavaScript din WordPress le poate face să se încarce mai rapid și să accelereze site-ul dvs. WordPress.

În acest manual, vă vom arăta cum să reduceți pur și simplu fișierele CSS/JavaScript în WordPress pentru a îmbunătăți performanța și viteza.

Ce este minificarea și când veți avea nevoie de ea?

Expresia „minimificare” este utilizată pentru a descrie un sistem care reduce dimensiunile fișierelor site-ului dvs. de internet. Face acest lucru eliminând spațiile albe, liniile și persoanele nedorite din codul de resurse.

Iată o instanță a codului CSS standard:

human body 
margin:20px
padding:20px
colour:#333333
history:#f7f7f7

h1 
font-dimension:32px
coloration#222222
margin-base:10px

După minimizarea codului, va părea așa:

entire bodymargin:20pxpadding:20pxcolor:#333history:#f7f7f7
h1font-dimension:32pxmargin-base:10px

În general, se sugerează să minimizeze doar documentele care sunt expediate către browserele utilizatorului. Acesta include fișiere HTML, CSS și JavaScript.

De asemenea, puteți reduce documentele PHP, dar reducerea acestora nu va crește ritmul de încărcare a paginii pentru clienții dvs. Deoarece PHP este un limbaj de programare pe partea de server, asta înseamnă că funcționează pe servere înainte ca ceva să fie trimis în browserul de internet al vizitatorului.

Câștigul minimizării fișierelor de date este îmbunătățirea ritmului WordPress și a performanței generale, având în vedere că informațiile compacte sunt mai rapid de încărcat.

Cu toate acestea, unii guru cred că avansarea funcționalității este destul de mică pentru majoritatea site-urilor web și nu merită această dificultate. Minificarea scapă doar de câțiva kiloocteți de date de pe majoritatea site-urilor web WordPress. Puteți minimiza mult mai mult timpul de încărcare a site-ului optimizând imaginile pentru rețeaua mondială.

Dacă încercați să obțineți o evaluare de 100/100 pe software-ul Google Pagespeed sau GTMetrix, atunci reducerea CSS și JavaScript vă va crește considerabil scorul.

Menționând asta, să aruncăm o privire asupra modului de a reduce fără efort CSS/JavaScript pe pagina dvs. web WordPress.

Vom alege peste 3 variante distinctive pentru care puteți opta dintre:

Tot gata? Să începem cu cel mai bun proces propus.

Procesul 1. Minimizează CSS/JavaScript în WordPress folosind WP Rocket

Această tehnică este mai ușoară și este propusă tuturor consumatorilor. Funcționează indiferent de găzduirea WordPress pe care o utilizați.

Inițial, trebuie să instalați și să activați pluginul WP Rocket. Pentru detalii suplimentare, consultați ghidul nostru pas cu mutare despre cum să configurați un plugin WordPress.

WP Rocket este cel mai bun plugin de cache WordPress de pe piață. Vă permite să introduceți foarte ușor cache în WordPress și să creșteți substanțial viteza site-ului web și momentele de încărcare a site-ului web.

Pentru mai multe informații, consultați tutorialul nostru despre cum să instalați și să stabiliți WP Rocket în WordPress.

După activare, doriți să verificați pagina web Setări » WP Rocket și să comutați la fila „Optimizare fișiere”.

De aici, va trebui să vă uitați la soluția Minify CSS documente.

WP Rocket vă va afișa apoi un avertisment că acest lucru ar putea împărți puncte pe site-ul dvs. web. Continuați și faceți clic pur și simplu pe butonul „Activați Minimizarea CSS”. Puteți dezactiva constant această selecție dacă declanșează probleme cu site-ul dvs. de internet.

Ulterior, trebuie să derulați în jos la secțiunea Documente JavaScript de mai jos.

Chiar aici, pur și simplu testați caseta de după posibilitatea „Minificați fișierele JavaScript”.

Din nou, veți vedea un avertisment că acest lucru ar putea sparge lucruri pe site-ul dvs. web. Continuați și faceți clic pur și simplu pe butonul „Activați Minimizarea JavaScript”.

Imediat după aceea, nu ignorați niciodată să faceți clic pe butonul Păstrați ajustări pentru a vă păstra configurațiile.

WP Rocket va începe acum să minimizeze informațiile dvs. CSS și JavaScript. Vă puteți șterge foarte mult memoria cache din setările pluginului pentru a vă asigura că începe să folosească CSS și JavaScript redus pentru viitorul vizitator al paginii web.

Tehnica 2. Minimizează CSS/JavaScript în WordPress folosind SiteGround

Dacă aplicați SiteGround ca furnizor de servicii de găzduire web WordPress, atunci puteți reduce fișierele CSS care lucrează cu SiteGround Optimizer.

SiteGround Optimizer este un plugin general de optimizare a performanței care funcționează pe sistemul lor. Funcționează bine cu PHP-ul lor ultrarapid pentru a consolida perioadele de încărcare ale site-ului dvs.

Pur și simplu configurați și activați pluginul SiteGround Optimizer pe site-ul dvs. de internet WordPress. Pentru detalii suplimentare, consultați ghidul nostru pas cu pas despre cum să introduceți un plugin WordPress.

După aceea, trebuie să faceți clic pe meniul SG Optimizer din bara laterală de administrare WordPress.

Acest lucru vă va duce doar la setările SG Optimizer.

Din acest articol, trebuie să faceți clic pe butonul „Mergeți la front-end” mai puțin decât pe „Alte optimizări”.

Pe următorul monitor, trebuie să comutați comutatorul care urmează la soluția „Minify CSS files”.

În viitor, va trebui să comutați la fila JavaScript și să comutați comutatorul care urmează la selecția „Minify JavaScript Files”.

Asta e tot! Acum puteți să vă goliți memoria cache WordPress și să aruncați o privire pe site-ul dvs. pentru a încărca versiuni reduse ale documentelor CSS și JS.

Abordarea 3. Minimizează CSS/JavaScript utilizând Autoptimize

Această metodă este propusă pentru consumatorii care nu sunt pe SiteGround și nu lucrează cu WP Rocket.

Inițial, trebuie să configurați și să activați pluginul Autoptimize. Pentru detalii suplimentare, consultați ghidul nostru pas cu acțiune despre cum să instalați un plugin WordPress.

La activare, trebuie să aruncați o privire la pagina web Opțiuni » Optimizare automată pentru a configura opțiunile pluginului.

Din acest articol, inițial, trebuie să verificați opțiunea „Optimizare cod JavaScript” din Opțiuni JavaScript.

După aceea, trebuie să derulați în jos la Opțiuni CSS și să examinați caseta de lângă opțiunea „Optimizare cod CSS”.

Nu neglijați niciodată să faceți clic pe butonul Conservare ajustări pentru a vă stoca configurațiile.

Apoi puteți pur și simplu să faceți clic pe butonul Cache vacant pentru a începe să lucrați cu fișierele dvs. de date minimizate. Pluginul poate fi utilizat și pentru a face față blocării redării JavaScript și CSS în WordPress.

Sperăm că această postare v-a ajutat să reduceți CSS și JavaScript pe pagina dvs. web WordPress. De asemenea, s-ar putea să doriți să vedeți tutorialul nostru despre optimizarea elementelor vitale de bază ale rețelei în WordPress și să respectați cel mai bun tutorial de performanță generală WordPress.

Dacă ți-a plăcut această postare, atunci asigură-te că te abonezi la canalul nostru YouTube pentru tutoriale de filme WordPress. Ne puteți întâlni și pe Twitter și Facebook.