Wide Magazine on elämäntapalehti, joka esittelee hienoja kokemuksia Bukarestin keskustasta.
Vaikka lehteä isännöi VPS, nopeus oli hidasta. Hallitun VPS:n hinta vaikutti kohtuuttoman korkealta.
Sivuston latausnopeus oli 6,99 sekuntia, sivukomponentit yhteensä 2,5 MB ja 113 pyyntöä palvelimelle.
Kotisivu latautui:
- 30 JS-tiedostoa – 883,2 K
- 11 CSS-tiedostoa – 138,3 K
- 22 CSS-kuvaa – 255,2 K
- 13 kuvaa – 1320,7 K
- 1 favicon – 16,9 K
Google PageSpeed Insights -pisteet olivat 57/100, suositukset olivat:
- ota pakkaus käyttöön
- hyödyntää selaimen välimuistia
- optimoi kuvat
- lyhentää palvelimen vasteaikaa
Optimointiraportti
Jopa faviconissa on liikaa KB. Teimme testin, latasimme sen ja toimme favicon.cc:hen, jossa loimme uuden. Saimme 1,6 K:n tiedoston (tosin heikomman laadun).
Kuvat
Kuvia ei ole optimoitu, ja ne voidaan myös näyttää asteittain vierailijoiden vieriessä nopeuttaakseen sivun yläosan sisällön latautumista (laiska lataus).
Toinen ongelma kuvien näyttämisessä on, että ne ladataan alkuperäisessä koossa (1024*682px) ja selain muuttaa niiden koon 676*450px.
Suosittelemme, että kuvat ladataan suoraan 676*450px-resoluutiolla tai asettamalla pikkukuva kyseiseen kokoon.
Näin selain toimii vähemmän kuvien kokoa muuttaen + sivun koko (KB) pienenee. Nämä kaksi tekijää parantavat lastausnopeutta.
Otimme esimerkiksi satunnaisen kuvan, jossa oli 163 kt, muutimme koon 676*450px ja sen jälkeen
Jopa jätettynä 1024*682px:iin ja vain optimoimalla se JPEGMinillä, saimme 90,3 kt:n tiedoston, mikä on huomattava parannus alkuperäiseen 163 kt:iin.
JS tiedostot
Seuraava asia, jota etsimme, on JS-tiedostojen lukumäärä ja kokonaiskoko – 30 tiedostoa yhteensä 883,2 kt.
Ja täältä löytyi myös ongelmia.
JQuery ladattiin kahdesti – 1.9.1-versio (92.6K) osoitteesta code.jquery.com ja 1.8.3-versio (93.6K) ladattiin paikallisesta WordPress-kansiosta.
Sama ongelma Google Analytics -koodin kanssa – kerran vanha versio, ga.js (39,8K) ja kerran uusi versio, analytics.js (20,3K).
Se on 133,4K ylimääräinen.
2 laajennusta lataa useita JS-tiedostoja, jotka käytännössä tekevät saman asian näyttäen kuvagalleriat: NextGen Gallery ja PrettyPhoto Media.
PrettyPhoto Media ei näytä olevan käytössä, joten se voidaan poistaa säästääksesi noin 50 000 ja 2 pyyntöä.
Plugins
Kaksi lisälaajennusta, jQuery Mega Menu ja Useful Banner Manager, voidaan poistaa. jQuery Mega Menua ei näytä olevan käytössä missään. Hyödyllistä Banner Manageria käytetään yhdelle bannerille, joka voidaan näyttää yksinkertaisella html-koodilla, joka on lisätty tekstiwidgetiin.
ShareThis-laajennus, joka lisää jakopainikkeita viesteihin, käyttää 125,1 kt:n JS:ää. Se voidaan korvata Jetpackilla, joka käyttää vain 38,5K:n JS:ää.
Facebook Like Box ei ole toteutettu tehokkaimmalla tavalla 171,9K:n JS:n avulla.
Yksinkertaisin ja tehokkain tapa on kopioida iframe-koodi Facebook Developers Like Box -sivulta ja liittää se tekstiwidgetiin, jolloin JS:ää ei tarvita.
Google Maps -laajennus käyttää neljää JS-tiedostoa yhteensä 60,7 kt.
Kuten Like Boxin kanssa, myös Google Maps voidaan integroida iframe-kehykseen.
Tarkistin viimeiset 10 viestiä, eikä yhteenkään ole integroitu karttaa, joten jos se ei ole vakiotoiminto ja sitä käytetään vain harvoin, on tehokkaampaa syöttää kartat manuaalisesti iframe-kehyksillä viesteihin.
Mitä teimme
- optimoimme kuvat
- asetamme asteittaisen kuvien lataamisen sivustolle
- otimme käyttöön sivun välimuistin + tietokantavälimuistin
- ratkaisimme monistetun jQueryn
- ratkaisimme päällekkäisen Google Analytics JS:n
- ratkaisimme Facebook-tykkäyslaatikon.
Tulos
Kotisivulla on nyt 62 komponenttia yhteensä 672,6 kt – verrattuna 113 kohteeseen, yhteensä 2,5 Mt = parannus 73 % .
Keskimääräinen latausnopeus on nyt 1,5 sekuntia verrattuna 6,99 sekuntiin = parannus 78 % .
Jos tarvitset nopeamman WordPress-sivuston, älä epäröi ottaa meihin yhteyttä ja katsoa mitä voimme tehdä auttaaksemme.
Jätä vastaus