Speed is feature #1
•
0 likes•1,107 views
Speed of interactive UI is a critical aspect of web experience, especially now when mobile consumption and responsive design became an integral part of web strategy. Sergey Chernyshev talks about the most important feature of every web site and application and describes why you need to care about speed, what are the common performance issues and how to establish a process for web performance optimization in your team.
Report
Share
Speed is feature #1
- 1. Speed is Feature #1 Sergey Chernyshev ! NY Web Performance & CSS/UX Meetup January 15, 2015
- 4. Sloooowly
- 5. Even Slower
- 6. Slowness Damages Business 100ms delay -> -1% of sales. (Amazon, 2006) 400ms delay -> -5 - 9% full-page traffic. (Yahoo autos, 2008) 500ms delay -> -25% searches. (Google, 2007)
- 7. Long-term Brand Effects Slowness damages the brand. (Google, Microsoft, 2009) Google uses speed in search result ranking (SEO) and quality score (AdWords)
- 8. Speed Means Business +3% ad revenue, +17% page views per session. (Edmunds, 2010)! +7-12% conversions! 50% reduction in operation costs (Shopzilla, 2009)! +15% (+60M) downloads, each 1sec increased 2.7% downloads (Firefox, 2010)
- 9. Fred Wilson Managing Partner, Union Square Ventures @ NYC http://www.aVC.com/ “1. Speed is the most important feature.” 10 Golden Principles of Successful Web Apps http://vimeo.com/10510576
- 11. Anti-Ads
- 12. Fast Ads Get rid of document.write! Load ads later, when ready
- 13. Anti-Content CMSs like WordPress, Drupal, Magento, etc. Search result, auto- complete, etc.
- 14. Fast Content Static content Caches (APC, memcache, Varnish, CDN, browser) Flush HTTP stream early / multiple times http://calendar.perfplanet.com/2014/async-fragments-rediscovering-progressive-html- rendering-with-marko/ Optimize
- 15. Anti-Progress
- 16. Fast Progress Mobile Design Details: Avoid The Spinner: http://www.lukew.com/ff/entry.asp?1797
- 17. Fast Progress Mobile Design Details: Avoid The Spinner: http://www.lukew.com/ff/entry.asp?1797
- 18. Anti-Carousel
- 22. Load just enough code Use modern tech where aplicable Don’t copy desktop features 1-to-1 Fast and Responsive Tim Kadlec
- 23. Anti-Images
- 24. Responsive Images 0.000 1.000 2.000 3.000 4.000 Small Medium Large Source 3.818 1.454 1.233 0.407 http://responsiveimages.org/