Blixtsnabb WordPress sida med LiteSpeed Cache

Så får du en blixtsnabb WordPress-sida hos Surftown

Här hos Surftown så är vi extremt glada för våra LiteSpeed-servrar, och det är WordPress också. LiteSpeed är en extremt kraftfull serverprogramvara, optimerad för hastighet, säkerhet och stabilitet. En av de häftigare funktionerna är dess Varnish-liknande cache för PHP-script. När man kör en PHP-fil på servern så sparar LiteSpeed resultatet till nästa gång, vilket resulterar i mycket snabbare svarstider nästa gång någon vill komma åt filen.

WordPress-sidor 90x snabbare med Litespeed

Som många kunder har sett så inkluderar vi ett tillägg vid namn LiteSpeed Cache när man installerar WordPress via vår 1-click toolbox. Det inkluderas eftersom det är ett effektivt caching-tillägg, som inte bara gör sidorna snabbare, utan även reducerar belastningen på våra webbservrar.

De senaste versionerna av LiteSpeeds caching-tillägg har en uppsjö av nya funktioner som inte bara kan användas till caching, utan även för att optimera andra saker med sidan. Kombinerat med Surftowns LiteSpeed-servrar så ger det fantastiska möjligheter för att snabba upp tyngre webbsidor.

Det här blogginlägget går igenom hur man kan finjustera inställningarna i LiteSpeed Cache för att få mer prestanda från sin WordPress-sida.

De säkra LiteSpeed Cache alternativen

Till att börja med så aktiverar vi de mer grundläggande optimeringarna. De borde fungera med de flesta teman och tillägg till WordPress. Börja med att aktivera LiteSpeed Cache om det inte redan är gjort:

Aktivera LiteSpeed Cache i WordPress under tillägg.

Observera att alla webbsidor är unika. Det som fungerar för en sida kanske inte fungerar för andra, och vice versa. Vi avråder kunder från att blint aktivera alla alternativ som finns i LiteSpeed cache, eftersom det troligen inte kommer att vara optimalt.

Nu när vi är klara med varningarna, så går vi in i inställningarna för LiteSpeed Cache:

inställningar i LiteSpeed Cache under Settings

Den viktigaste inställningen ligger under fliken General. Knappen Enable LiteSpeed Cache skall stå på ”Enabled” för att tillägget skall fungera. Värdena under knappen anger hur länge olika delar av sidan skall cachas. Vår erfarenhet är att standardinställningarna fungerar för de flesta webbsidor.

På fliken Cache så är de flesta alternativen aktiverade som standard. Undantaget är Cache Mobile. Om du har ett separat tema just för mobila sidor så skall du aktivera den. Om ditt tema är responsivt, eller om din webbsida inte är mobilanpassad, så bör du lämna den funktionen deaktiverad. Om den inte är aktiverad redan, så bör du aktivera funktionen Browser cache.

På fliken Optimize bör du aktivera funktionerna CSS HTTP/2 Push och JS HTTP/2 Push. Detta medför att servern skickar iväg JavaScript och CSS-filer till besökarnas webbläsare direkt, istället för att man väntar på att webbläsarna skall fråga efter dem själv. Detta kan ge en enorm prestandaökning, beroende på hur sidan är uppbyggd.

Till sist, på fliken Tuning så bör du sätta ”Remove Query Strings” till on.

Klicka på knappen Save changes för att spara ändringarna.

De relativt säkra, men möjligtvis onödiga LiteSpeed Cache alternativen

Nedanstående alternativ fungerar för de flesta webbsifor, men om sidan inte behöver den aktuella optimeringen så kan det rent faktiskt medföra att sidan blir lite långsammare. När du testar de här möjligheterna så bör du aktivera dem en åt gången och sedan ladda om sidan i ett separat fönster innan du fortsätter. Om en specifik funktion inte fungerar för just din sidan, deaktivera den och klicka på knappen LiteSpeed Cache Purge All i menyraden längst upp i WordPress-administrationen.

På fliken Optimize så finns det många olika optimeringar som kan reducera mängden innehåll som skickas. I de flesta fall vill man reducera mängden data som skickas, eftersom det medför att sidorna laddas snabbare. Det finns tre olika minify-funktioner, som kan aktiveras och deaktiveras separat:

  • CSS Minify
  • JS Minify
  • HTML Minify

Minifiering betyder att onödiga delar av sidans källkod tas bort, vilket resulterar i mindre filer. Att använda en algoritm för att avgöra vad som är onödigt och vad som inte är onödigt är emellertid inte en felfri process och du bör därför aktivera och testa de här en åt gången.

Därutöver så finns det även två alternativ för att slå ihop CSS och slå ihop JavaScript:

  • CSS Combine
  • JS Combine

Vi erfar att man kan reducera mängden requests ganska markant med den här optimeringen, men att det ibland ger problem. Precis som med minifiering så bör du testa de här en åt gången och se vad som fungerar bäst med just din webbsida.

Det finns även ett alternativ som heter Load CSS Asynchronously. Det betyder att webbsidan börjar laddas och visas innan CSS är färdigladdad. Detta snabbar upp sidhämntningen rejält i de flesta fall, men det kan i vissa fall se lite konstigt ut när sidan laddas.

På fliken Media så finns det ett alternativ som heter Lazy Load Images. Lazy Loading är en princip som betyder att besökarens webbläsare visar en tom ruta istället för bilder, tills den aktuella bilden rent faktiskt behövs. Det här kan snabba upp laddningstiderna för sidor med många bilder på, men det medför även extra JavaScript, så om du inte har många bilder på sidan så är det oftast inte lönt att aktivera den här funktionen. Det finns även ett alternativ som heter Lazy Load Iframes och som applicerar samma princip på Iframes, som t.ex. inbäddade videoklipp, kartor, kommentarer via Disqus, och så vidare.

Avancerade funktioner

Det finns flera andra funktioner I LiteSpeed Cache och som vi kommer att gå igenom i kommande blogginlägg. Dessa inkluderar t.ex. automatisk bildoptimering.

Skulle du vilja få din webbsida optimerad? Kontakta isåfall oss; vi skulle gärna vilja komplettera med några riktiga exempel på sidor som blivit snabbare. 🙂

 

Surftown älskar LiteSpeed och WordPress