Tales from 200 Trenches
With over 200 Edge Delivery Services projects completed, Kiran Murugulla, Senior Engineer at ÃÛ¶¹ÊÓƵ, and Varun Mitra, Architect for ÃÛ¶¹ÊÓƵ Experience Manager Cloud, share key lessons learned. Discover the secrets behind delivering fast, high-performing experiences with exceptional Core Web Vitals.
Community Discussion
Continue the conversation in the ÃÛ¶¹ÊÓƵ Developers Live Community .
Key takeaways
-
Performance is Critical Performance, particularly the speed of web pages, is emphasized as a key factor for successful web projects. Ensuring performance scores of 100 is a primary goal.
-
Development Practices
- Use Google PageSpeed Insights for continuous testing during development.
- Start projects with boilerplate code that already scores 100 to maintain high performance.
- Ensure pull requests (PRs) meet performance standards before merging.
-
Key Metrics Focus on optimizing Largest Contentful Paint (LCP) and Total Blocking Time (TBT) as they significantly impact performance scores.
-
Resource Management
- Include necessary resources like fonts and third-party scripts within the project source.
- Use font fallbacks to improve loading times.
- Delay loading non-essential scripts to improve initial load performance.
-
Image Optimization Prioritize loading of above-the-fold images and use high-priority fetch settings for critical images.
-
Case Studies
- CNN.com Optimized query indexes and delayed loading of Google ads to improve performance.
- Herbert Homes Used Intersection Observer API to load data as users scroll, improving performance and user experience.
-
Best Practices
- Start with boilerplate code and use well-structured markup.
- Utilize advanced CSS selectors and minimize JavaScript manipulation.
- Focus on mobile-first development.
- Ensure content structuring is intuitive for authors.
-
Tools Use tools like Google Sheets and DSA for tracking site performance scores over time.