Maximize_Your_Performance_Optimization_Gains.pdf

Transcript

1. Maximize Your Performance Optimization Gains The Data Driven Way
2. How Do You Start Optimizing Your Frontend Performance? Web Performance. YAY! www.tezify.com
3. How Do You Start Optimizing Your Frontend Performance? Bugs logged in past www.tezify.com
4. How Do You Start Optimizing Your Frontend Performance? Past support tickets? www.tezify.com
5. How Do You Start Optimizing Your Frontend Performance? Diagnostic Tools? Lighthouse, WebPageTest, PageSpeed Insights? www.tezify.com
6. How Do You Start Optimizing Your Frontend Performance? A performance issue you are aware of. www.tezify.com
7. How Do You Start Optimizing Your Frontend Performance? • Prioritize performance optimizations that benefits the most users. • Avoid blindness to performance issues that may exist out in the wild. www.tezify.com
8. How Do You Start Optimizing Your Frontend Performance? • Use site tracking data (eg : Google Analytics) to uncover user segments experiencing slowness. • Know what to look for (within site tracking data). • Understand how to use it to make performance optimization decisions. www.tezify.com
9. Most Popular Pages Over-all / Landing Pages • Find slowest of your busiest pages. • Know pages through which visitors enter your site. (most critical for Single Page Apps) • Optimize by reducing page size, number of requests and prioritizing content. www.tezify.com
10. Most Popular Pages Over-all / Landing Pages Google Analytics : Behavior > Site Speed > Page Timings www.tezify.com
11. Most Popular Pages Over-all / Landing Pages Google Analytics : Behavior > Site Speed > Page Timings (Primary Dimension : Landing Pages) www.tezify.com
12. Desktop vs Mobile • Know proportion of mobile vs desktop users and compare their speed. • Avoid blindness to real mobile device experience (esp SPA, JS heavy sites). • Simulate mobile users by accessing site on actual mobile devices. www.tezify.com
13. Desktop vs Mobile Google Analytics : Audience -> Mobile -> Overview www.tezify.com
14. Visitors’ Geography • Ensure your server is closest to your largest Geo segment. • Leverage CDN for performance boost for other geographies. www.tezify.com
15. Visitors’ Geography Google Analytics : Behavior > Site Speed > Page Timings (Primary Dimension : Country) www.tezify.com
16. Browser Usage Statistics • Compare website speed across browsers to uncover browser specific speed issues. • Apply optimizations that affect major browsers your visitors use (ref : caniuse.com). www.tezify.com
17. Browser Usage Statistics Google Analytics : Behavior > Site Speed > Page Timings (Primary Dimension : Browser) www.tezify.com
18. New Vs Returning Users • Know proportion of new vs returning users and compare their speed. • Optimize returning users through Service Worker caching (Progressive Web App), HTTP caching. • Optimize new users by prioritizing content, reducing page size and requests. www.tezify.com
19. New Vs Returning Users Google Analytics : Behavior > Site Speed > Page Timings (Primary Dimension : User Type) www.tezify.com
20. Conclusion • Start your performance optimization exercise with data. • Deliver optimizations that benefit the largest user segments. • Track the actual optimization benefits. www.tezify.com