Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
W.P.O.
WORDPRESS PERFORMANCE
OPTIMIZATION
...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
DI COSA PARLERO’
• Perché è importante ave...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
#PERFMATTERS
3
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
UTENTI SEMPRE PIÚ MOBILE
• Utente in movim...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 5
IN ITALIA LA VELOCITÀ DI CONNESSIONE
MED...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 6
UNA PAGINA PESA IN
MEDIA 1.9 MB
Fonte: w...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
#PERFISMONEY
7
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
IL TEMPO È DENARO
8
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
#PERFISSEO
9
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
SEO – VELOCITÁ FATTORE DI RANKING
• Il tem...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
SEO - CRAWL BUDGET
• Lo spider dedica ad o...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
#PERFISUX
12
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
UN RITARDO DI 500ms NEL CARICAMENTO
DELLA ...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
L’80% DEGLI UTENTI È DISPOSTO AD
ASPETTARE...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
IL 33% DEGLI UTENTI INSODDISFATTI
RACCONTE...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
IL 60% DEGLI UTENTI MOBILE SI
ASPETTA LA S...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
UTENTI ED ESPERIENZA DI NAVIGAZIONE
• Il s...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
COSA SIGNIFICA VELOCE ?
18
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
LA RISPOSTA E’ NELLA PSICOLOGIA UMANA
3 LI...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
SITO VELOCE = 1 SECONDO
20
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
É TUTTA COLPA DEL BACKEND ?
21
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
>80% DEL TEMPO DIPENDE DAL
FRONTEND
22
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
>80% DEL TEMPO DIPENDE DAL
FRONTEND
23
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
AUMENTARE LA VELOCITA’
24
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
CIÒ CHE NON È MISURABILE NON È
MIGLIORABIL...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
TOOLS PER MISURARE LA VELOCITÁ
• GT METRIX...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
VELOCITÁ SECONDO IL W3C
27
T.T.I. TIME TO ...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
DIMINUIRE IL PESO DELLA PAGINA
28
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
DIMINUIRE IL PESO DELLA PAGINA
• Ridurre c...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
INCLUSIONE CONDIZIONALE CSS/JS
30
add_acti...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
RIDURRE RICHIESTE HTTP
31
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
ESEMPIO DI RICHIESTE HTTP
32
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
RIDURRE RICHIESTE HTTP
• Abilitare Keep-Al...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
ABILITARE CACHING
34
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
ABILITARE CACHING
• Il caching permette al...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
AUMENTARE LA VELOCITA
PERCEPITA
36
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
PRIORITÀ AI CONTENUTI VISIBILI
37
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
AUMENTARE LA VELOCITÁ PERCEPITA
38
• Dare ...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
ORDINE DI CARICAMENTO CSS/JS
39
CSS IN CIM...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
JS DEFER / JS ASINCRONI
40
function add_as...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
LAZY LOAD IMMAGINI
<img src=‘placeholder.p...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
CRITICAL RENDER PATH
42
Il CRITICAL RENDER...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
CRITICAL RENDER PATH
43
• diminuire il Tim...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
JPEG PROGRESSIVE
44
Immagine sfocataImmagi...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
PRECARICAMENTO RISORSE
45
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
PRE-* PARTY
46
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
PREFETCHING
47
Il browser scarica la risor...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
PRERENDER
48
Il browser carica la pagina i...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
REL=‘SUBRESOURCE’
49
• Il browser scarica ...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
IMPLEMENTAZIONE PRE-*
50
add_action(‘wp_he...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
IDENTIFICATE I PERCORSI DI
NAVIGAZIONE ABI...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
COME IMPLEMENTARE (QUASI) TUTTO?
52
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
W3 TOTAL CACHE
53
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
• Minify + combine
• Inclusione condiziona...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 55
‘
“THE FASTEST BYTE IS A BYTE NOT SENT
...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
DOMANDE?
56
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
GRAZIE
E-mail:andrea@tcinformatica.net
Twi...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
E IL BACKEND?
58
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
PERFORMANCE TUNING
59
• Migliorare utilizz...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
PERFORMANCE TUNING
60
• Utilizzare php 5.6...
WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560
GRAZIE
E-mail:andrea@tcinformatica.net
Twi...
Upcoming SlideShare
Loading in …5
×

WPDay 2015 - WordPress Performance Optimization - Pordenone - 13 Novembre 2015

1,010 views

Published on

Se pensi che il tempo di caricamento della pagina non sia importante o di non poter migliorare la velocità del tuo sito perché è il server ad essere lento, ti stai sbagliando :) In questo talk parlerò del perché è importante realizzare siti veloci, delle principali best practices per realizzarli e del come migliorare le perfomances in modo rapido e senza fatica.

Published in: Technology

WPDay 2015 - WordPress Performance Optimization - Pordenone - 13 Novembre 2015

  1. 1. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 W.P.O. WORDPRESS PERFORMANCE OPTIMIZATION 1 Andrea Cardinali – T.C. Informatica
  2. 2. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 DI COSA PARLERO’ • Perché è importante avere un sito veloce • Cosa vuol dire veloce • Da cosa dipende la velocità del sito • Come velocizzare un sito 2
  3. 3. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 #PERFMATTERS 3
  4. 4. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 UTENTI SEMPRE PIÚ MOBILE • Utente in movimento • Utente distratto da quello che accade intorno a lui • Copertura 3G ancora inaffidabile • Piani tariffari a volume 4
  5. 5. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 5 IN ITALIA LA VELOCITÀ DI CONNESSIONE MEDIA È COMPRESA TRA I 4 e i 10 Mbps Fonte: Akamai - State of the Internet Report Q2 - 2015
  6. 6. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 6 UNA PAGINA PESA IN MEDIA 1.9 MB Fonte: web.archive.org Top 1000 sites Nov.15
  7. 7. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 #PERFISMONEY 7
  8. 8. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 IL TEMPO È DENARO 8
  9. 9. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 #PERFISSEO 9
  10. 10. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 SEO – VELOCITÁ FATTORE DI RANKING • Il tempo di caricamento della pagina è un fattore di ranking • Un sito eccessivamente lento avrà un rank peggiore rispetto ad un altro più veloce • Google Adwords (che non c’entra con la SEO) tiene conto della velocità nell’assegnare il QUALITY SCORE • Il successo del mdr dipende dalla qualità dei risultati forniti 10 http://www.lowlevel.it/i-siti-veloci-hanno-ranking-migliori-macche-e-una-bufala/
  11. 11. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 SEO - CRAWL BUDGET • Lo spider dedica ad ogni sito un tempo prefissato per scansionare ed indicizzare le pagine (c.d. crawl budget). • A parità di tempo un sito veloce permette al crawler di scansionare più pagine • Un’indicizzazione frequente e completa incide positivamente sul posizionamento • I vostri clienti sono gli utenti e non i crawlers 11
  12. 12. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 #PERFISUX 12
  13. 13. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 UN RITARDO DI 500ms NEL CARICAMENTO DELLA PAGINA HA COMPORTATO UNA MAGGIOR FRUSTRAZIONE DELL'UTENTE, MINOR COINVOLGIMENTO, IMPATTO EMOZIONALE NEGATIVO SUL BRAND Fonte: Radware – Mobile Web Stress Nov. 2013 13
  14. 14. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 L’80% DEGLI UTENTI È DISPOSTO AD ASPETTARE AL MASSIMO 3 SECONDI PRIMA DI ABBANDONARE IL SITO. Fonte: Radware Fastview 2015 14
  15. 15. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 IL 33% DEGLI UTENTI INSODDISFATTI RACCONTERÀ LA SUA UX NEGATIVA Fonte: Radware Fastview 2015 15
  16. 16. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 IL 60% DEGLI UTENTI MOBILE SI ASPETTA LA STESSA USER EXPERIENCE SU MOBILE E DESKTOP Fonte: Radware Fastview 201511 16
  17. 17. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 UTENTI ED ESPERIENZA DI NAVIGAZIONE • Il successo del sito e del brand dipendono dall’esperienza di navigazione vissuta dall’utente • Le conversioni e il bounce rate sono influenzati significativamente dalla UX • Se la UX è negativa, voi ( o il vostro cliente) state perdendo soldi 17
  18. 18. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 COSA SIGNIFICA VELOCE ? 18
  19. 19. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 LA RISPOSTA E’ NELLA PSICOLOGIA UMANA 3 LIMITI PER I TEMPI DI RISPOSTA: • 0.1 secondi – risposta istantanea • 1 secondo – l’utente percepisce un ritardo e sa che è dovuto al computer che sta elaborando le informazioni e quindi il flusso dei pensieri non viene interrotto. • 10 secondi – Tempo massimo per mantenere l’attenzione dell’utente. L’utente non ha il controllo su quello che sta accadendo e inizia a crescere il senso di frustrazione. Abbandono del sito. Memoria a breve termine limitata: più aspettiamo, più il compito da eseguire risulta difficile. Bisogno di controllo: l’attesa e l’impossibilità di controllare la situazione genera frustrazione e ansia. 19 Fonte: Jackob Nielsen http://www.nngroup.com/articles/website-response-times/1
  20. 20. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 SITO VELOCE = 1 SECONDO 20
  21. 21. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 É TUTTA COLPA DEL BACKEND ? 21
  22. 22. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 >80% DEL TEMPO DIPENDE DAL FRONTEND 22
  23. 23. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 >80% DEL TEMPO DIPENDE DAL FRONTEND 23
  24. 24. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 AUMENTARE LA VELOCITA’ 24
  25. 25. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 CIÒ CHE NON È MISURABILE NON È MIGLIORABILE 25 “ “ Galileo Galilei
  26. 26. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 TOOLS PER MISURARE LA VELOCITÁ • GT METRIX • WEBPAGETEST.ORG • TOOLS.PINGDOM.COM R.U.M. (REAL USER MONITORING) GOOGLE ANALYTICS APP DYNAMICS NEW RELIC 26
  27. 27. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 VELOCITÁ SECONDO IL W3C 27 T.T.I. TIME TO INTERACTIVE DOCUMENT TIP: Digita Performance.timing nella consolle
  28. 28. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 DIMINUIRE IL PESO DELLA PAGINA 28
  29. 29. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 DIMINUIRE IL PESO DELLA PAGINA • Ridurre css inutilizzato (Framework css) • Minify html, css, js • Compressione Gzip per risorse statiche  Con risorse testuali risparmio fino al 70% • Inclusione condizionale dei css/js necessari 29 RISORSE UTILI: http://www.minifycss.com/css-compressor/ http://refresh-sf.com/yui/ (YUI Compressor) http://jscompress.com/ https://github.com/addyosmani/critical (rimuove CSS inutilizzato)
  30. 30. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 INCLUSIONE CONDIZIONALE CSS/JS 30 add_action(‘wp_enqueue_scripts’,’crd_registra_js’); function crd_registra_js() { $path=get_template_directory_uri().'/assets/js/’; wp_register_script(‘myscript’,‘script.min.js’); if(is_page()) { wp_enqueue_script(‘myscript’); } }
  31. 31. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 RIDURRE RICHIESTE HTTP 31
  32. 32. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 ESEMPIO DI RICHIESTE HTTP 32
  33. 33. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 RIDURRE RICHIESTE HTTP • Abilitare Keep-Alive • Combine css, js • Css sprites • Inclusione condizionale js/css • Abilitare Caching 33
  34. 34. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 ABILITARE CACHING 34
  35. 35. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 ABILITARE CACHING • Il caching permette al browser di scaricare solo i files che non ha in cache. • Caricamenti successivi della pagina ( o del sito) molto più veloci • Si risparmia banda 35
  36. 36. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 AUMENTARE LA VELOCITA PERCEPITA 36
  37. 37. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 PRIORITÀ AI CONTENUTI VISIBILI 37
  38. 38. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 AUMENTARE LA VELOCITÁ PERCEPITA 38 • Dare priorità ai contenuti above the fold (visibili):  Ordine di caricamento di css/js  lazy load di immagini e risorse  critical render path • JPEG progressive • Caching + precaricamento  DNS prefetch (preresolve)  Rel=«subresource»  Prefetching delle risorse  Prerendering delle risorse
  39. 39. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 ORDINE DI CARICAMENTO CSS/JS 39 CSS IN CIMA (NELL’HEAD) • vengono scaricati in parallelo • permettono al browser di eseguire più velocemente il rendering della pagina JAVASCRIPT IN FONDO (ideale prima di </body> o comunque dopo i css) • bloccano il rendering della pagina • vengono scaricati in serie ed eseguiti
  40. 40. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 JS DEFER / JS ASINCRONI 40 function add_async_defer_forscript($url) { if (strpos($url, '#asyncload')===false) return str_replace('#asyncload', '', $url)." async=‘async’"; else if (strpos($url, '#deferload')===true) return str_replace('#deferload', '', $url)." defer=‘defer’"; else if (is_admin()) return str_replace(['#asyncload‘,’#deferload’], '', $url); else return $url; } add_filter('clean_url', 'add_async_defer_forscript', 11, 1); http://caniuse.com/#search=defer http://caniuse.com/#search=async
  41. 41. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 LAZY LOAD IMMAGINI <img src=‘placeholder.png’ data-src=‘original.png’ /> 41
  42. 42. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 CRITICAL RENDER PATH 42 Il CRITICAL RENDER PATH è costituito dal codice e dalle risorse necessarie a visualizzare la parte di contenuto visibile (above the fold)
  43. 43. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 CRITICAL RENDER PATH 43 • diminuire il Time To Interactive Document • dare priorità ai contenuti visibili • Il css necessario al rendering della parte «above the fold» viene incluso inline • Anche il js «critico» potrebbe diventare inline https://github.com/addyosmani/critical
  44. 44. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 JPEG PROGRESSIVE 44 Immagine sfocataImmagine «bianca»
  45. 45. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 PRECARICAMENTO RISORSE 45
  46. 46. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 PRE-* PARTY 46
  47. 47. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 PREFETCHING 47 Il browser scarica la risorsa in background DOPO aver scaricato tutto il resto (download differito) PRO • Utile se la risorsa verrà utilizzata nelle pageviews successive ( a patto che la risorsa sia cachabile) CONTRO • Download (potenzialmente) inutile http://caniuse.com/#search=prefetch //… <link rel=‘prefetch’ href=‘risorsa_cachabile.png’> </head>
  48. 48. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 PRERENDER 48 Il browser carica la pagina in un tab nascosto che viene scaricata e renderizzata in background PRO • Caricamento istantaneo (in caso di visita) CONTRO • Potenziale spreco delle risorse hw http://caniuse.com/#search=pre-render //… <link rel=‘prerender’ href=‘/secondapagina/’> </head>
  49. 49. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 REL=‘SUBRESOURCE’ 49 • Il browser scarica la risorsa IMMEDIATAMENTE (download prioritario) • Utile per risorse fondamentali all’interno della pagina PRO • Download immediato (early loading) CONTRO • Supporto solo da parte di Chrome attualmente //… <link rel=‘subresource’ href=‘heroshot.png’> </head>
  50. 50. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 IMPLEMENTAZIONE PRE-* 50 add_action(‘wp_head’,’print_risorse_prefetch’) function print_risorse_prefetch () { echo “<link rel=‘subresource’ href=‘heroshot.png’>”; }
  51. 51. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 IDENTIFICATE I PERCORSI DI NAVIGAZIONE ABITUALI CON GOOGLE ANALYTICS 51
  52. 52. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 COME IMPLEMENTARE (QUASI) TUTTO? 52
  53. 53. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 W3 TOTAL CACHE 53
  54. 54. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 • Minify + combine • Inclusione condizionale js/css • Caching per risorse statiche • Page cache, database cache, object cache • Supporto CDN W3 TOTAL CACHE 54 https://wordpress.org/plugins/w3-total-cache/
  55. 55. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 55 ‘ “THE FASTEST BYTE IS A BYTE NOT SENT Ilya Gregorik Web Performance Engineer @ Google “
  56. 56. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 DOMANDE? 56
  57. 57. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 GRAZIE E-mail:andrea@tcinformatica.net Twitter:@andreacardinali Linkedin: Andrea Cardinali Slideshare: http://www.slideshare.net/andreacardinali LASCIATEMI UN FEEDBACK: https://joind.in/15560 57
  58. 58. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 E IL BACKEND? 58
  59. 59. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 PERFORMANCE TUNING 59 • Migliorare utilizzo delle risorse hardware  Utilizzo di un webserver efficiente • Riduci l’accesso al disco  Caching in memoria  Caching headers  CDN • Evitare l’esecuzione di operazioni cpu intensive  No compressione onfly (meglio gzip static)
  60. 60. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 PERFORMANCE TUNING 60 • Utilizzare php 5.6.15 e OpCache • Utilizzo di stack LEMP invece di LAMP  Nginx può anche essere utilizzato inizialmente come reverse-proxy per le risorse statiche • Utilizzo di Apache 2.4 + mpm_event • Caching in memoria dei dati dell’utente (APCU o MEMCACHED) • Utilizzo protocollo HTTP/2.0  (Apache 2.4.15+ ed Nginx 1.9.5+)  La maggior parte dei browser richiede https
  61. 61. WPDay - 13 Novembre 2015 - Pordenone - @andreacardinali -https://joind.in/15560 GRAZIE E-mail:andrea@tcinformatica.net Twitter:@andreacardinali Linkedin: Andrea Cardinali Slideshare: http://www.slideshare.net/andreacardinali LASCIATEMI UN FEEDBACK: https://joind.in/15560 61

×