Nyhedsblog: WordPress & Joomla-udvidelser

Sådan grupperes og minificeres ressourcer i WordPress

fil-gruppe-og-Minify

Har den bedre ydeevne muligvis er drømmen for alle, der administrerer et websted, gruppe og minificere ressourcer på WordPress, er en af ​​de bedste ting, vi kan gøre for det, men det kunne være virkelig hårdt. Gruppér alle dine ressourcer (css- og js-filer hovedsageligt) kan udsætte dit websted, hvis du ikke er en udvikler, fordi det kan generere konflikt.

WP Speed of Light er den bedste løsning til at udføre dit WordPress-websted, fordi det har mange muligheder for at få dit websted til at indlæse hurtigt med et rigtig venligt instrumentbræt, og ja, en af ​​disse muligheder er at gruppere og minimere ressourcer. Inkludering / udelukkelse af enkeltfil fra gruppen og minificeringsprocessen er en nøgle til en tilpasset optimering uden konflikter.

Vi vil bruge et eksempel wordpress-site til dette blogindlæg, og vi lærer, hvordan vi gør dette, så processen til at konfigurere alt bliver lettere.

 

Sådan gør du en WordPress JS- og CSS-minifikation

Lad os lære at udføre en wordpress js og CSS-minifikation, men først skal vi vide, hvad betyder minificeringen “Minification refererer til processen med at fjerne unødvendige eller overflødige data uden at påvirke, hvordan ressourcen behandles af browseren - f.eks. Kodekommentarer og formatering, fjernelse af ubrugt kode, brug af kortere variabel- og funktionsnavne og så videre ”.

Hvad vi nu skal gøre er en hastighedstest til vores side for at se ændringerne, for dette eksempel bruger vi et websted med woocommerce og nogle produkter, så første gang det indlæses lidt langsomt.

 

før-test

 

Ja, 2,79 sekunder for at indlæse siden, ikke dårligt, men det kunne være bedre, lad os minimere js og CSS og se forskellen, gå til WP Speed of light > SpeedUp> Group & Minify , du vil være i stand til for at se menuen med alle muligheder for at minificere. Den gratis plugin-version inkluderer gruppen og minify-indstillingen, men den visuelle filekskludering er kun tilgængelig i PRO Addon-versionen.

 

gruppe-og-Minify-instrumentbræt

 

PRO -tilføjelsesmuligheder er: Ekskluder inline script (Ekskluder inline script fra minificering), flyt scripts til sidefod (det giver dig mulighed for at fremskynde dit websted ved at flytte alle minimerede scripts til sidefod), Group font og Google Fonts (Group local fonts and Google fonts) i en enkelt fil, der skal vises hurtigere) og Avanceret filekskludering.
 
Du har mulighed for at formindske, som du kan se, JS, CSS og også HTML nu bare aktiver disse valgmuligheder, klik på gem, og alle dine ressourcer vil blive minimeret med det samme, det kan have problemer, da det er en avanceret konfiguration, men alt kan rettes med udelukkelse af nogle kode og filer (med pro addon).

 

minify-ressourcer

 

 

Nu er alt udviklerjobbet, der kan tage timer, gjort på kun nogle få sekunder.

 

Næste trin, WordPress optimerer CSS og JS

Med dette plugin vil vi lade det wordpress optimere CSS og js bare ved at aktivere gruppemulighederne på instrumentbrættet, gå til WP Speed of Light > SpeedUp> Group & Minify , du vil kunne se et dashboard med mulighederne for at gruppere CSS og js.

Disse muligheder giver dig mulighed for at:

  • Gruppe JS: Gruppering af flere Javascript-filer i en enkelt fil minimerer HTTP-anmodningens nummer
  • Gruppere CSS: Gruppering af flere CSS-filer i en enkelt fil minimerer HTTP-anmodningens nummer.

HTTP-anmodninger: dette er anmodninger, der sendes til serveren, hver gang vi vælger noget eller går til en anden side på det samme sted, så hvis vi kan reducere disse anmodninger, vil belastningstiden reduceres.

For at kontrollere, hvor mange filer, scripts du kan gruppere på dit websted, skal du bare åbne din browserkonsol (højreklik> Inspicer eller F12) og åbne netværkspanelet .

 

liste-script-krom

Du kan derefter liste alle filer, der er indlæst efter type, her i dette eksempel har jeg kun klikket på JS-fillisten.

Nu hvor vi har brug for disse indstillinger, skal du bare aktivere gruppemulighederne (Group CSS og Group JS) og klikke på Gem, husk at disse indstillinger skal bruges med forsigtighed, og du bliver nødt til at teste din side, fordi det kan forårsage konflikter .

 

Lad os blive seriøse og optimere fontvægten

Hvad? Anden optimering? Ja! du vil være i stand til at optimere fontvægten, og det vil være så let som at aktivere indstillingen på indstillingerne, skal du bare gå til WP Speed of Light > SpeedUp> Group & Minify> Group fonts and Google Fonts option.
Gruppeskrifttyper og indstillinger for Google-skrifttyper giver dig mulighed for at gruppere dem i en enkelt fil, der skal serveres hurtigere, dette er ret praktisk, da de fleste af WordPress-temaerne og layoutene kommer med 2 eller skrifttyper som standard med alle deklinier (almindelig, fed, kursiv ...)

Bare aktiver denne mulighed, klik på Gem og alle skrifttyper grupperes.

 

gruppe-font

 


Nu, hvor vi har aktiveret alle mulighederne for at mindske og gruppere ressourcerne, skal vi se en forskel i belastningstiden på vores websted. Lad os tjekke hastigheden.

 

test-efter

 

Hvilken forskel, fra 2,8 til 0,56 sekunder! Som vi fortalte dig i begyndelsen af ​​dette indlæg, kan vi forbedre indlæsningstiden;)

 

Sådan bruges ekskludering af filminificering

Minificeringen kan forårsage problemer på dit websted, det sker hovedsageligt når du grupperer bestemte filer, der indeholder fejl i syntaksfejl eller lignende variabel, klassenavn. Det er derfor med indstillingen "filminifikationsekskludering", du vil være i stand til at ekskludere filer fra minificerings- og gruppeprocessen, gå til WP Speed of Light > SpeedUp> Group & Minify , du vil kunne se indstillingen Avanceret filekskludering .

For at bruge den avancerede filekskludering, skal du køre en scanning først aktivere indstillingen og klikke på Kør scanning.

 

gruppe-ressource-konflikt-alarm


 For at kunne liste det script, der er indlæst på dit websted, skal WP Speed of Light scanne din mappe for at liste dem. De er normalt alle indeholdt i din / wp-indholdsmappe, der grupperer alle dine plugins og tema. Vælg den mappe (i det mindste) og klik på "Scan nu"

 

select-mapper-til-scanning

 

Det kører en scanning, til sidst skal du klikke på visningsresultaterne, når scanningen er afsluttet.

 

scannet

 

En liste over filer klassificeret efter type (All, JS, CSS, Font) skal vises nedenfor. Hvis du har identificeret en fil, der forårsager problemer, når du aktiverer filgruppen og minificering, kan du udelukke den herfra ved hjælp af en simpel ON / OFF switcher .

 

udelukke-filer

 

Dette vil hjælpe dig med at ekskludere filer og på denne måde let løse ethvert problem, der måtte opstå, når der formindskes ressourcer ... Gruppér og formindsk processen kræver stadig noget arbejde, især i test, men det er bestemt besværet værd.
 
Prøv WP Speed of Light : https://www.joomunited.com/wordpress-products/wp-speed-of-light

5
Øjeblikkelig Google Drev Filsynkronisering med Dro ...
Knytter WordPress til skyen ved hjælp af WP Media Fo ...
 

Kommentarer

Der er endnu ingen kommentarer. Vær den første til at indsende en kommentar
Allerede registreret? Log ind her
Gæst
Søndag den 26. september 2021

Captcha-billede