Optimer din hjemmesides hurtighed

hjemmeside

Skrevet af Kristoffer Andreasen den 19. juli 2015

En hjemmeside kan optimeres på rigtig mange parametre. Et parameter, som for tiden opnår øget fokus, er hurtigheden. Folk er blevet vant til hurtige hjemmesider og det nytter derfor ikke noget at have en langsom side. Dette kan få de besøgendes indtryk til at være ringere og dermed indirekte skade sidens omdømme. Der er en lang række tiltag, som man kan tage for at øge hurtigheden på sin hjemmeside. Jeg vil her beskrive nogle helt centrale, som relativt let kan implementeres på din side.

1. GZIP kompression

Kompressionen nedsætter hjemmesidens størrelse og dermed størrelsen på din HTTP anmodning. Generelt kan man opnå helt op til en 70% mindre størrelse på sin side. Rent praktisk kan man sætte dette til i sin .htaccess fil. Ved at tilføje følgende linier kan man opnå GZIP kompression på sin hjemmeside:

# compress text, html, javascript, css, xml:
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
# Or, compress certain file types by extension:
<files *.html>
SetOutputFilter DEFLATE
</files>

Alternativt er det blevet standard i de fleste kontrolpaneler at slå det til uden at åbne .htaccess filen. Led blot efter optimering i kontrolpanelet, hvorefter man blot kan klikke på en knap, som slår kompression til. Dette genererer så automatisk kodestykke i .htaccess filen.

2. Optimer dine billeder

Billeder er ofte en af de tungeste ressourcer på hjemmesider og hver enkelt billede kræver en HTTP anmodning for at loade. Der er flere tilgange til optimering af billedestørrelsen, men en af de mest simple er, at komprimere billederne før de bruges. Et rigtig godt program til dette er JPEGMini, som tillader komprimering af 20 billeder dagligt. Dette sker iøvrigt uden tab af kvalitet.

Et andet simpelt råd er aldrig at bruge billeder, som har større dimensioner end hvad de skal anvendes til. Har du et logo, bør du derfor resize det til den størrelse, som det skal vises i på hjemmesiden. På den måde slipper du for at skulle ændre størrelse ved brug af ekstra kode.

3. Caching

Alle browsere giver mulighed for at gemme data, så du ikke behøver at loade alle billeder næste gang du besøger samme side. For at udnytte dette kan du skrive et lille kodestykke mere i din .htaccess fil. Jeg har medtaget et eksempel på hvordan det kunne se ud:

ExpiresActive On
ExpiresDefault "access plus 1 seconds"
ExpiresByType text/html "access plus 1 seconds"
ExpiresByType image/x-icon "access plus 2592000 seconds"
ExpiresByType image/gif "access plus 2592000 seconds"
ExpiresByType image/jpeg "access plus 2592000 seconds"
ExpiresByType image/png "access plus 2592000 seconds"
ExpiresByType text/css "access plus 604800 seconds"
ExpiresByType text/javascript "access plus 86400 seconds"
ExpiresByType application/x-javascript "access plus 86400 seconds"

4. Minimer din kode

Med hjemmesider arbejdes der som regel altid med to forskellige kodefiler. Den ene findes i normalt format og den anden i en minimeret udgave. Den minimerede udgave skal kun bruges til produktion, da alle unødvendige tegn er fjernet for at gøre filen så lille som muligt. Dette gælder både for CSS og JS filer. En af de mest effektive måder at minimere disse filer er ved hjælp af en task-runner, som automatisk kan producere en filmappe med produktionsfilerne. Der findes flere forskellige af disse og jeg kan varmt anbefale Grunt, som er integreret med meget andet software. Har du ikke mod på at starte med at anvende en task-runner kan du finde flere sider online, hvor du blot kopierer dine kodestykker ind. Herefter vil de så komme ud i en minimeret udgave.

Der er mange andre muligheder for at gøre en side hurtigere, men jeg har blot her nævnt et par stykker. Bruger du WordPress til din hjemmeside kan du ligeledes opnå meget af dette ved hjælp af plugins. Det kan dog ikke anbefales at installere en meget stor mængde af plugins.

En god kilde til at tjekke din hjemmesides hurtighed er hos Google, som har bygget deres egen test:

https://developers.google.com/speed/pagespeed/insights/




Få vores nyheder på mail