Web performance
Download as PPTX, PDF0 likes46 views
The document outlines strategies for improving web performance, emphasizing response times and rendering goals such as keeping idle load under 100ms and first paint under 50ms. Key performance advice includes prioritizing HTML over CSS and JS, avoiding JavaScript animations in favor of CSS, and leveraging techniques like code splitting and service workers. Additional recommendations involve using preloading, H2 server push, and optimizing image formats.
Web performance
- 1. Web Performance By Lusan Das
- 2. RAIL Performance Model Response Animation Idle Load < 100ms paint < 1000ms first paint< 50ms chunks< 16ms frame
- 4. DOM & CSSOM
- 5. Optimising CRP 1. Use media type and queries for css 2. avoid inline(exec pauses until CSSOM ready) for js 3. Use async with scripts
- 6. Measuring CRP 1. domLoading 2. domInteractive 3. domContentLoaded 4. domComplete 5. loadEvent measureCRP
- 7. Performance Advice 1. HTML first, then CSS and then JS 2. Avoid js animations, use CSS! 3. Hardware accelerated CSS 4. Use preload 5. H2 server push 6. Service workers 7. Code splitting (lazy module loading) 8. Vector or svg images, load on media and many more
- 8. Thank you Follow me on twitter @daslusan to get more updates!