Optimizing Web Performance - A personal experience
0 likes56 views
The document discusses various strategies and tools for optimizing web performance, drawing from personal experiences at Facebook and other companies. It highlights the importance of specialized infrastructure, caching resources, and the use of performance testing and profiling techniques. Key technologies mentioned include React, Tracking.js, and Metal.js, with a focus on efficient algorithms and server-side rendering.
Optimizing Web Performance - A personal experience
- 1. Optimizing Web Performance A P E R S O N A L E X P E R I E N C E M A Í R A B E L L O
- 2. Facebook
- 3. Facebook • They care A LOT about performance • They are big
- 4. F A C E B O O K S U M M E R I N T E R N S - 2 0 1 0
- 5. Facebook • They care A LOT about performance • They are big • Specialized infrastructure team (built React) • Many tools (ex.: image spriting)
- 6. tracking.js L I F E R AY
- 8. tracking.js • Hard core performance • Fast algorithms • Optimizing constants • Arithmetic operations • Storing images in multi dimensional arrays • Typed arrays (ex.: Int32Array) • Js Perf 24 frames per second 41 ms per frame
- 9. Metal.js L I F E R AY
- 10. Metal.js • Open source components library • Support for hybrid rendering without running Node.js
- 11. Metal.js • Open source components library • Support for hybrid rendering without running Node.js • Performance tests • Studied about browser rendering (courses from Google) • Chrome Profiling • Refactors and architecture changes
- 12. E-commerce V T E X
- 13. VTEX • Production build • Uglify/gzip • Caching resources • Automatic code splitting • Server side rendering (with cache) • GraphQL (with cache)
- 14. Engage
- 17. In Loco • Caching! • Page Speed
- 19. In Loco • Caching! • Page Speed • Raygun
- 20. M A I R A . B E L L O @ I N L O C O M E D I A .C O M