WooCommerce verkkokauppa nopeammaksi: 3 vinkkiä

Verkkokaupan nopea toimivuus vaikuttaa suuresti kaupan konversioon ja asiakaskokemukseen. Mikään ei ole rasittavampaa, kuin klikkauksen jälkeen odotella montaa sekuntia, kun tutustut tuotteisiin tai vertailet niitä. On tutkittu, että sivun latausnopeudella on suora vaikutus poistumisprosenttiin.

Hidas verkkokauppa voi joskus johtua huonosta webhotellista, eli mikäli sivusto sijaitsee fyysisesti palvelimella toisella puolella maapalloa, on matkalla monia muitakin nopeuteen vaikuttavia tekijöitä. Sen takia helpoin keino lisätä nopeutta, on viedä verkkokauppa maantieteellisesti lähemmäksi asiakasta.

Parhaassakin webhotellissa WooCommerce-kauppa ei aina pakasta vedettynä toimi täysin optimaalisesti ilman muutamaa kikka kolmosta. Tässä kirjoituksessa tutustumme muutamaan näistä kikoista, joiden avulla vähennät sivujen latausaikoja verkkokaupassasi helposti. Nopeuttamalla verkkokauppasi toimivuutta, parannat konversiota ja lisäät myyntiäsi.

WC Speed Drain Repair -lisäosa

WooCommerce-verkkokaupan yhteyteen rakennettu blogi voi kärsiä WooCommercen tavasta käsitellä tietoja. Mikäli verkkokauppasi alasivulla tai blogikirjoituksessa ei ole tuotteita esillä, käsittelee WooCommerce joka tapauksessa tuotteisiin ja verkkokaupan toimintaan liittyvää tietoa taustalla jokaisen sivulatauksen yhteydessä. Tämä hidastaa merkittävästi verkkokaupan toimintaa ja sivujen latausnopeudet ovat korkeita.

Ratkaisu: WC Speed Drain Repair on maksuton lisäosa, joka on helppo ottaa käyttöön. Lisäosa poistaa turhat WooCommerce-pyynnöt sivuilta, joissa niitä ei tarvita. Lisäosa ei vaikuta verkkokauppasi muuhun toimintaan eikä vaadi asetuksia, eli lisäosan käyttöönotto on kivuton. Ota kuitenkin varmuuden vuoksi aina varmuuskopiot ennen kuin ryhdyt kokeilemaan uutta lisäosaa, jotta voit välttyä mahdollisilta ristiriidoilta toisen lisäosan kanssa.

Testasimme lisäosaa kevyessä ja tuoreessa WooCommerce-kaupassa, jossa on alle 10 tuotetta. Latausnopeudet Pingdom-testerillä tippuivat jopa puoleen. Pingdomin raporteista käy ilmi, että http-palvelupyyntöjen määrä tippui 53 -> 46. Mittaaminen suoritettiin alasivulla, jonka sisältö ei sisältänyt verkkokaupan tuotteita vaan normaaleja elementtejä kuten tekstiä ja kuvia. Ilman lisäosaa verkkokauppa tekee täysin turhaa työtä monella alasivulla kuten blogin puolella taustalla. Ajallisesti tämä tarkoitti nopeutusta testituloksissa 3-4 sekunnin latausnopeudesta jopa alle 2 sekuntiin. Testituloksia ajettiin useampi kerta tulosten varmistamiseksi.

PHP-version vaikutus nopeuteen ja lisäasetukset

PHP:n versiolla ja asetuksilla on vaikutusta WooCommerce-verkkokaupan nopeuteen. Mikäli webhotellisi PHP-asetuksiin on unohtunut PHP 5.6 (oletus) päälle, kokeile joulukuussa 2017 kaikkiin XetNET webhotelleihin tarjolle tullutta 7.2 versiota ja kytke päälle asetuksista ”OpCache”-asetus. Testeissä on havaittu, että PHP 5.6 ilman OpCachea voi olla jopa kolme kertaa hitaampi, kuin PHP 7.2 OpCache päällä.

Voit vaihtaa PHP-version cPanel-hallintatyökalustasi ”PHP Selector” -työkalulla. Otathan huomioon, että kaikki lisäosat WordPressissä eivät ole automaattisesti yhteensopivia uusien PHP-versioiden kanssa, vaikka WordPress.org on ilmaissut virallisen yhteensopivuuden PHP 7.2 versiolle.

Lisäosat joita ei ole päivitetty pitkään aikaan, saattavat aiheuttaa yhteensopivuusongelmia tai toimimattomuuksia. Tämä johtuu siitä, että PHP 7.2 on poistanut tuen joiltakin käskyiltä, joita vanhat lisäosat saattavat käyttää. Varmistathan verkkosivustosi/-kauppasi toimivuuden kun kokeilet eri PHP-versioita.

Kuvien liian suuri koko

Tyypillisesti suurimmat tiedostot verkkokaupoissa ovat kuvatiedostot. Lisätessä kuvia tuotekuvastoon, WordPress ei automaattisesti ota kantaa lisätyn kuvan kokoon. Tällöin ammattivalokuvaajalta saadut JPG-kuvat suurella resoluutiolla saattavat olla useamman megatavun kokoisia. Kukaan hitaalla 3G-yhteydellä ei jaksa odottaa monen megatavun kuvan latautumista. Ellet omista taitoja, ohjelmia tai aikaa kuvien pienentämiseen, on olemassa lukuisia lisäosia jotka osaavat pienentää kuvia ja pakata niitä parantaen sivuston nopeutta ja käyttäjäystävällisyyttä.

Yksi näistä lisäosista on Imsanity. Se pienentää kaikki uudet kuvat lähetyksen jälkeen haluttuun maksimikokoon, esimerkiksi vakioasetuksiltaan 2048x2048px kokoon. Tämä on usein riittävä koko esimerkiksi Retina- tai muiden suurtarkkuuden omaaville laitteille kuten tablet-tietokoneille. Alla näet eron kuvatiedostojen koossa ennen ja jälkeen Imsanityn asentamisen.

Vasemmassa kuva on lähetetty suoraan älypuhelimesta täydellä tarkkuudella WooCommerceen. Oikealla on ennen lähetystä aktivoitu käyttöön Imsanity, jonka asetuksissa maksimitarkkuudeksi on määritelty 2048×2048 ja JPG-pakkauksen laaduksi 82. Kuva latautuu lähes neljä kertaa nopeammin, sillä se vie reilut 0,5 megatavua kun toinen kuva on taas 2 megatavun tiedosto.

Lisäosa antaa mielenrauhan myös silloin, kun verkkokauppaa operoi useampi henkilö. Tällöin voit olla huoleti, ettei kukaan vahingossakaan lisää 5-8 megatavun kuvia tuotekuvastoihin ja hidasta tuotekuvastoa katselevan asiakkaan käyttökokemusta.

Mitkä muut asiat vaikuttavat nopeuteen?

WooCommerce-verkkokaupan nopeuteen vaikuttaa yllä olevien lisäksi moni muukin seikka. Yksi merkittävä vaikutus on ulkoasulla eli teemalla, sen keveys/raskaus, css- ja js-tiedostojen määrän vähentäminen (minification) sekä yleinen koodin siistiminen. Gzip-pakkauksen käyttöönotto on helppo keino vähentää isoiksi paisuneiden html- ja css-tiedostojen siirtoaikaa. Lisäosien määrä vaikuttaa sivukohtaisesti: sosiaalisen median upotukset hakevat tietoja usein tietyin väliajoin ja lataavat ne välimuistiinsa ja huonosti koodatut lisäosat saattavat odottaa käyttäjää useamman sekunnin.

Suosittuja lisäkeinoja lisänopeutta hakeville ovat välimuistia/staattisia sivuja hyödyntävät lisäosat eli ns. cache-pluginit. Niiden avulla halutuista alasivuista luodaan staattiset sivut, jolloin palvelimen työtaakka vähenee, kun hakuja tietokannasta ei tarvitse tehdä jokaisella kerralla.

Verkkokaupoissa tosin staattisia sivuja ei usein ole montaa, sillä lisättäessä tuote ostoskoriin, sivun sisältö muuttuu ja tällainen sivu ei toimisi staattisena sivuna. Lisäksi huonosti konfiguroituna tällainen lisäosa voisi olla jopa tietosuojaongelma, mikäli arkaluonteista asiakastietoa tallennetaan ja näytetään muille, väärille käyttäjille.

WooCommerce-alustaan on saatavilla maksullinen WP Rocket -lisäosa, joka kehuu olevansa täysin yhteensopiva WooCommercen kanssa ilman asetusten kanssa säätöjä. Näin ollen lisäosa jättää muuntamatta sellaiset sivut staattisiksi, joilla on verkkokaupan elementtejä, jolloin asiakastietojen tietosuojahaasteiden kanssa painiminen helpottuu. Näiden kanssa kannattaa kuitenkin edetä suurella varovaisuudella ja mieluusti testata lisäosia kehitysympäristössä tuotantoympäristön sijaan.

emjr on Emailemjr on Facebookemjr on Linkedinemjr on Twitter
emjr
Toimitusjohtaja at XetNET / Xetpoint Oy
Xetpoint Oy:n perustaja ja yrittäjä. Bisneshenkinen nörtti henkeen ja vereen joka rentoutuu(?) keskeneräisen taloprojektin kanssa.