Le 7 migliori scene di film sulle web performance

Come adottare un approccio all’ottimizzazione delle performance web in azienda in 7 passi, cercando di portarsi a casa il premio più ambito: la statuetta oro delle web performance.

Transcript

1. Le 7 migliori scene di film sulle web performance o come adottare un approccio all’ottimizzazione delle performance web in azienda
3. Sponsor
4. Marchio, https://it.wikipedia.org/w/index.php?curid=305794
5. Le 7 migliori scene di film sulle web performance o come adottare un approccio all’ottimizzazione delle performance web in azienda All images sourced from Google Images, copyright of respective holders, used under non commercial fair use general copyright terms
6. Selfie introduttivo
7. Matteo Fogli @pecus
8. Modo @madebymodo
9. What’s american boy
10. 1 Best Opening
11. Informare
12. https://wpostats.com/
14. Scenari di mercato
16. Whitepapers
20. Darsi obiettivi raggiungibili
21. 2015 Tammy Everts / Soasta
22. ridurre il peso delle immagini
23. ridurre il totale delle risorse
24. ottimizzare il caching delle risorse
25. And the winner is…
26. https://www.youtube.com/watch?v=ymiZFPauvlQ
27. Start Slow, don’t stop And the winner is…
28. 2 Best Repeated Scene
29. this sequence was edited for speed
30. Misurare tutto
31. Google Page Speed Insight
35. WebPageTest
39. SpeedCurve
41. Pingdom
43. Soasta, New Relic, Calibre
44. Oppure… il vostro Browser
46. Misurare subito
47. Confrontarsi con la concorrenza
48. Raccontare i successi
49. Anche quelli piccoli
50. Senza aspettare di aver raggiunto la perfezione
53. And the winner is…
54. https://www.youtube.com/watch?v=CUWhN6j7OS4
55. Measure, Repeat And the winner is…
56. 3 Best Actors
57. Gli Attori
58. Business
60. IT
62. Operations
64. In pratica…
66. Fare squadra
74. Coinvolgere tutti
75. Separare le responsabilità
76. Premiare i risultati
77. And the winner is…
78. https://www.youtube.com/watch?v=aY4YOsjCI-Q
79. No finger pointing, no excuses And the winner is…
80. 4 Best Coreography
81. Grande === Complesso
82. Pianificazione
83. Vincoli strutturali
84. Testing
85. Controllo Regressioni
87. Gestione Ambienti multipli (collaudo / produzione)
88. Replica sull’infrastruttura
89. Impatto dello strato di caching
90. Impatto sui sistemi editoriali
91. Impatto su terze parti
92. Allineamento dei team
93. And the winner is…
94. https://youtu.be/kr_z37TgQO4?t=27
95. It takes time And the winner is…
96. 5 Best SFX
97. Ottimizzazione immagini (un esempio)
98. Scelta formati
99. Workflow
100. Imagemagick
101. mozJpeg
102. Guetzli
103. PNGcrush
104. WebP
105. Alternative on-demand
110. Markup e CSS
111. Client Hints
112. Lazy loading e LQIP
113. DSSIM
114. Ricette vs. cucina
115. And the winner is…
116. https://www.youtube.com/watch?v=5oZi-wYarDs
117. Choose your weapon And the winner is…
118. 6 Fastest Speed
119. “Più veloce”
120. StyleGuides
121. Toolchain
122. Mentoring
123. Performance Budget
124. And the winner is…
125. https://youtu.be/mk7VWcuVOf0?t=22
126. Speed is everything (because performance is speed) And the winner is…
127. 7 Best trailer
128. Tecnologia e Tecniche sono in continua evoluzione
129. § H2 + HPACK § Brotli/Zopfli § JS modules (webpack) / Tree shaking/Code splitting § Critical CSS § Skeleton + PWA
130. And the winner is…
131. https://www.youtube.com/watch?v=3r3Va6LxFS0
132. You and your users And the winner is…
133. Grazie https://modo.md @madebymodo matteo@modo.md @pecus