1.
Ako na rýchly web
xKatka

2.
47% používateľov
opustí stránku
po 2 sek. načítavania
*podľa Kissmetrics

3.
PageSpeed Insights
GTmetrix.com
Webpagetest.org
Tools.Pingdom.com
Page Load Time / čas
načítania stránky
Total Page Size / celková
veľkosť stránky
Requests / počet požiadaviek
Waterfall

4.
Mizernú rýchlosť webu
nespôsobuje nedostatok...
skôr prebytok
- Karol Vörös: Rýchly WordPress pre návštevníka aj správcu
http://wordpress.tv/2016/05/12/karol-voros-rychly-wordpress-pre-navstevnika-aj-spravcu/

5.
Šablóna: Free VS prémium

6.
Od čoho závisí rýchlosť stránky?
▪ počet pluginov
▪ šablóna
Aká je realita:
▪ obsah
▪ cache
▪ hosting

7.
Ako môže obsah webu obmedziť rýchlosť?
Obrázky
▪ Neoptimalizované obrázky (viac ako
0,5 MB)
▪ Zbytočne veľké obrázky (nad
1500px)
Externé scripty
▪ Google Maps
▪ Youtube/Vimeo/... video
▪ Google Fonts
▪ Facebook like/share/feed box
▪ Twitter feed
▪ AddThis, Hotjar, ...

8.
Obrázky
Tŕň v oku pre mnohé weby

9.
6000x4000px 7,65MB
1200x800px 147kB

10.
Víťaz súťaže Bloger roka 2015 v kat. Móda

11.
Nastavenia - Multimédiá Force Regenerate Thumbnails

12.
Ako optimalizovať obrázky
Automaticky pomocou pluginov
▪ EWWW Image Optimizer
alebo
▪ WP Smush - Image Optimization
Ručne
Zmenšiť veľkosť
▪ aj v trápnom Ms Paint
Optimalizovať:
▪ tinyjpg.com
▪ compressor.io
NIKDY nepoužívať plnú veľkosť

13.
Cache
Uloží vygenerované stránky do medzipamäte odkiaľ ich zobrazuje návštevníkom

14.
Pluginy pre cache
▪ W3 Total Cache
▪ WP Super Cache
▪ WP Fastest Cache
▪ Autoptimize
▪ Gator Cache
▪ Lite Cache ▪ Flexicache
▪ Cachify
▪ Alpha Cache
▪ Hyper Cache
▪ AIO Cache
▪ Next Level Cache
▪ Super Static Cache
▪ Wordfence with Falcon
▪ WP Fast Cache
▪ WP Rocket

15.
WP Super Cache
W3 Total Cache
WP Fastest Cache

16.
NO CACHE
WP Super
Cache
W3 Total
Cache
WP Fastest
Cache
Eshop s prémium šablónou 4.5s / 4.73s 1.9s / 1.27s 2s / 1.29s 1.6s / 1.31s
Blog s free šablónou 2.7s / 1.69s 1.4s / 949ms - 1.6s / 665ms
Firemný web s prémium šablónou 2.3s / 1.95s 1.6s / 828ms 2.1s / 1.22s 1.5s / 961ms
Web s free šablónou a visual
composerom
1.26s / 1.3s 0.87s / 459ms 0.76s / 379ms 0.92s / 426ms
gtmetrix.com / tools.pingdom.com

17.
Hosting
To, kde je vaša stránka uložená.

18.
Hľadáme dobrý hosting
▪ PHP 7
▪ Podpora pre WordPress
▪ Lokalita
▪ Výkon
▪ Support

19.
Súboj hostingov

20.
gtmetrix.com / tools.pingdom.com
Bez Cache
S Cache
Elbia WY pre WP Websupport
Web 3.4s / 2.29s 2.7s / 1.52s 3.2s / 1.64s
Eshop - 1.5s / 1.57s 2.2s / 1.39s
Elbia WY pre WP Websupport
Web 4.9s / 2.95s 2.7s / 1.52s 5.2s / 3.94s
Eshop - 1.5s / 1.57s 4.1s / 3.51s

21.
Elbia hosting
https://gtmetrix.com/reports/www.dognet.sk/hf2FWS2x
WY pre WordPress
https://gtmetrix.com/reports/mojefaktury.top/kMV5sCtV
Websupport
https://gtmetrix.com/reports/www.dognet.4rka.sk/FABkzuhN

22.
Elbia hosting s cache
https://gtmetrix.com/reports/www.dognet.sk/9zUGr861
Websupport s cache
https://gtmetrix.com/reports/www.dognet.4rka.sk/tj8VRyNy

23.
Case study č. 1

24.
Riešenie:
Problémy:
▪ 6 x Youtube video
▪ Google maps na hlavnej stránke
▪ Hotjar
▪ 12 rôznych fontov
▪ Neoptimalizované a zbytočne veľké obrázky
Websupport hosting, MariaDB 5.5
Zrýchlenie webu o
5,037 sek
• 6x screenshot videa s
preklikom namiesto 6x
Youtube iframe
• zníženie počtu fontov
• optimalizácia obrázkov
• Google Maps presunutý na
stránku kontakt
• vypnutie nepoužívaných
pluginov
• prečistenie DB (WP Sweep)
• lepšie cachovanie

25.
Case study č. 2

26.
Predtým
Potom

27.
Riešenie:
Problémy:
▪ Nenastavené cache
▪ Pofidérny hosting
ipartner.sk, MySQL 5.1
Zrýchlenie webu o
1.9 sek
• WP Fastest Cache
• Defer JS

28.
Predtým
Po migrácii na WY hosting pre WordPress (vypnutie cache, zapnutie Autoptimize)

29.
Riešenie:
Problémy:
▪ Pofidérny hosting, na ktorom ani cache nefunguje
ipartner.sk, MySQL 5.1 -> WY pre WP, MariaDB 10.0
Zrýchlenie webu o
2.4 sek
• Migrácia na WY
• Autoptimize

30.
Case study č. 3

31.
Riešenie:
Problémy:
▪ Žiadne :D
▪ PS: na stránke bol aktivovaný aj WooCommerce ;)
WY pre WP hosting, MariaDB 10.0
Zrýchlenie webu o
20%
• Lazy Load
• Autoptimize

32.
Ako teda na rýchly web?

33.
TO DO list:
▪ Vyhoďte iframy
▪ Prejdite na PHP 7
▪ Optimalizujte obrázky
▪ Používajte kvalitný hosting
▪ Zapnite si cache a všetko minifikujte
▪ Nepotrebné pluginy deaktivujte a zmažte
▪ Advance: Lazy Load, Defer/Async JS

34.
Extra
Optimalizácia DB
▪ Znížte počet revízii
define( 'WP_POST_REVISIONS', 3 );
do wp-config.php
▪ Prečistite DB pomocou WP Sweep
Pluginy len tam, kde ich treba
Načítavajte css/js pluginu len na tých
stránkach, kde sa reálne používa
▪ Ručne v kóde
▪ Plugin Organizer

35.
Vďaka ;)
xKatka.sk
ahoj@xkatka.sk
@xKatka