google i/o 2012 - protecting your user experience while integrating 3rd party code
DESCRIPTION
The amount of 3rd-party content included on websites is exploding (social sharing buttons, user tracking, advertising, code libraries, etc). Learn tips and techniques for how best to integrate them into your sites without risking a slower user experience or even your sites becoming unavailable. Video is available here: http://www.youtube.com/watch?v=JB4ulhFFdH4&feature=plcpTRANSCRIPT
- 1.Protecting your User Experience WhileIntegrating 3rd-party CodePatrick MeenanSoftware Engineer
2. A simple content page 3. Feels Like http://youtu.be/HSbHNIvhOFU 4. The Social Widget 5. When the widget is Unavailablehttp://youtu.be/3-zaos02CxI 6. Because ofThis:HTMLInstead of:HTML http://www.stevesouders.com/blog/2009/12/01/google-analytics-goes-async/ 7. Loaded Asynchronouslyhttp://youtu.be/krin-F65Fd8 8. Loaded Asynchronouslyhttp://youtu.be/krin-F65Fd8 9. And Monitoring Says Server Monitoring Base page responded in 0.160 seconds Full-Browser Monitoring Page loaded in 25 seconds Analytics Page Views Loaded and executed asynchronously Real User Monitoring Performance Reporting No data if user bailed before onLoad 10. Theres More!On that one page, all before the main content: HTML10 11. HTTP Archive http://httparchive.org/trends.php 12. But Id Notice. Globally? Social sites tend to be targets for blocking platform.twitter.com connect.facebook.net apis.google.com HTTPS as well In an Enterprise? Corporate policies 13. Back-end vs Front-end Base Page (Back-end)Front-endFirst Paint 14. High Availability Server ArchitecturesDNS Read-Only DatabaseLoad Balancers App ServersSite 1Database MasterSite 2 15. All for Base Page (Back-end) 16. To the Front End! 17. Async SnippetGood for code with no dependencies (widgets) HTML17 18. Put Scripts at the Bottom Easy to implement and describe Delays script loading and execution later than Async at the topHTML