32
CloudOpsGuys Your Software | Our Service TM 1 CloudOpsGuys Your Software | Our Service TM WPO – Lessons from the Field

London web performance WPO Lessons from the field June 2013

Embed Size (px)

DESCRIPTION

Web Performance - random lessons learnt from delivering WPO, Load testing and APM consulting in the UK. PLus a bit about WebPageTest Private Instances etc

Citation preview

  • 1. CloudOpsGuys Your Software | Our Service TM1CloudOpsGuysYour Software | Our Service TMWPO Lessons from the Field

2. CloudOpsGuys Your Software | Our Service TM(1) Some quick & dirty ways to do a WPOPoC using automation(2) 5 reasons why having your ownWebPageTest instance rocks!(3) The most common WPO mistakes I see(time and time again)(4) Why I love APM tools and youre nuts ifyou dont use one!Agenda3 3. CloudOpsGuys Your Software | Our Service TMPoC - Do a quick example video There are two easy ways to get a roughbefore/after web optimisation video Using WebPageTest Compare http://www.webpagetest.org/compare Use PageSpeedInsights https://developers.google.com/speed/pagespeed/insights (yes, I know one uses the other!) 4. CloudOpsGuys Your Software | Our Service TMPagespeed Insights 5. CloudOpsGuys Your Software | Our Service TMAnd you can watch a videohttps://developers.google.com/speed/pagespeed/insights#url=http_3A_2F_2Fwww.marksandspencer.com_2FFormal-Shirts-Shirts-Mens_2Fb_2F2559784031_3Fie_3DUTF8_26intid_3Dgnav__men__formal-shirts&mobile=false 6. CloudOpsGuys Your Software | Our Service TMWPT Compare 7. CloudOpsGuys Your Software | Our Service TMPage Speed Service 8. CloudOpsGuys Your Software | Our Service TMBuild your own Ive been building my own PoC tool usingRiverbed Stingray Aptimizer and aiCache.com Cache static and dynamic optimise resources Just use CNAMES and some header re-writing to glue it togetherBrowseraiCacheDynamicStingrayAptimizerOriginServer 9. CloudOpsGuys Your Software | Our Service TMSome gotchas Multiple levels of caching Browser cache aiCache Aptimizer cache (optimized static objects) Making sure that you send the right headers at eachhop Right user-agent Right hostname Right GZIP / Deflate headers FQDN names in source (particularly in top/side nav) FFS whats wrong with a relative /link? 10. CloudOpsGuys Your Software | Our Service TMOther lessons Load time is useless Render start is useless Filmstrip, Video or Visual Progress is KEY More on this later 11. CloudOpsGuys Your Software | Our Service TMVideo example 12. CloudOpsGuys Your Software | Our Service TM5 reasons why WPT Privateinstance rocks!1. NO QUEUE!2. Bulk Testing Mode3. Its private4. Its inside your firewall5. Easier access to history of testing6. You will learn more about features!1. Visual Progress2. Connection View3. Scripting etc etc 13. CloudOpsGuys Your Software | Our Service TMBulk Testing! 14. CloudOpsGuys Your Software | Our Service TMGive it a list of URLs 15. CloudOpsGuys Your Software | Our Service TMVisual Progress KEY! 16. CloudOpsGuys Your Software | Our Service TMConnection viewRelatively good 17. CloudOpsGuys Your Software | Our Service TMConnection viewRelatively bad connection resets after 2 requests 18. CloudOpsGuys Your Software | Our Service TMLESSON LEARNT FROMCONSULTINGWhat I see day in, day out 19. CloudOpsGuys Your Software | Our Service TMLessons learnt from consulting20/06/2013 19Generic DescriptionReduce PageSizeReduce Number ofRequestsImplementGZIPCompressionOptimiseLoading ofexternal filesDeferJavaScriptloadingOptimiseimagesOptimizeHTTP CachingDomainShardingCookie-freeDomainsBack-endperformancetuningRemoveUnnecessaryCSSHigh Street Retailer Yes Yes No No No No Yes No Yes No YesBudget Hotel Chain No Yes No No No Yes Yes Yes Yes Yes NoProfessional Body No Yes Yes Yes Yes Yes Yes Yes No Yes NoHigh Street Retailer No Yes No Yes Yes Yes Yes Yes Yes Yes NoVOD provider No Yes No No Yes Yes Yes Yes Yes Yes YesConsumer Electronics Brand Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes YesFashion Retailer No Yes No No Yes Yes Yes No Yes Yes YesTravel Sector No Yes Yes Yes Yes no Yes Yes Yes Yes NoFashion Retailer Yes Yes Yes Yes Yes No Yes Yes No Yes NoFashion Retailer Yes Yes No No Yes No Yes Yes Yes Yes NoHome Improvement Retail No Yes No No Yes No Yes Yes Yes Yes YesElectrical Retailer Yes Yes no Yes Yes No Yes No Yes Yes NoElectrical Retailer Yes Yes No No Yes Yes Yes Yes No Yes NoOnline Gambling Yes Yes Yes Yes No Yes Yes No Yes Yes YesMobile Phone Retailer Yes Yes No Yes Yes Yes Yes Yes Yes No YesInsurance Provider No Yes No No Yes No Yes Yes No Yes YesEmergency Repair Service No Yes No Yes No Yes Yes Yes No Yes YesMobile Phone Retailer Yes Yes No Yes Yes Yes Yes Yes No Yes YesCar Manufacturer No Yes No No No Yes Yes Yes Yes Yes YesFinancial Services No Yes Yes No Yes No Yes Yes No Yes YesTravel Sector Yes Yes No No Yes No Yes Yes No No NoPublisher No Yes Yes No Yes Yes Yes Yes No No YesPublisher No Yes No No Yes No Yes Yes Yes No YesHigh Street Retailer Yes Yes No Yes Yes Yes Yes Yes No No YesNewspaper Yes Yes No Yes Yes Yes Yes No Yes Yes Yes48% 100% 28% 48% 80% 60% 100% 80% 60% 76% 64% 20. CloudOpsGuys Your Software | Our Service TM20/06/2013 20Performance RuleFrequencyRecommendedReduce Number of Requests 100%Optimize HTTP Caching 100%Defer JavaScript loading 80%Domain Sharding 80%-Back end performance tuning 76%Remove Unnecessary CSS 64%Optimise images 60%-Cookie free Domains 60%Reduce Page Size 48%Optimise Loading of externalfiles48%Implement GZIP Compression 28% 21. CloudOpsGuys Your Software | Our Service TMWhat else? It takes ages for anything to change (hence why I am focussing on automation stuff) Videos are a killer tool Analysis of synthetic monitoring can tell youan lot about back-end performance Use analogies (I wrote a whole whitepaperusing shopping at Tesco as an analogy for webperformance) 22. CloudOpsGuys Your Software | Our Service TMWHY I LOVE APM TOOLSDeeper insights into back-end performance 23. CloudOpsGuys Your Software | Our Service TM4 quick examples Know your dependencies! And dont assume its your code that sucks You can focus on application transactions How many transactions to load a page? And why ORMs can suck And classic Application metrics The heap is doing WHAT? 24. CloudOpsGuys Your Software | Our Service TMKnow your dependencies 25. CloudOpsGuys Your Software | Our Service TMFocus on Application Transactions 26. CloudOpsGuys Your Software | Our Service TMHow many calls?Query Avg. Time (ms) Count Tot.Time(ms)%Timeserver=83.231.201.82;database=e6-goshcc;uid=e6-goshcc;pwd=0.26 1542 408 1.6ESModule_EShop_SelectPrice 6.9 1216 8387 32.8ESModule_EShop_SelectOrderItems 7.43 394 2929 11.5ESCore_Lookup_Countries_Select 9.4 391 3676 14.4ESModule_EShop_SelectAddress 10.15 285 2893 11.3ESCore_Admin_LoadUserDetails 15.62 86 1343 5.3ESModule_EShop_SelectOrderLineExtendedRecord 15.69 65 1020 4ESCore_Data_GetNavigation 27.89 9 251 1ESCore_Data_GetObjectDetails 3.44 9 31 0.1ESCore_Data_IsObjectChildOfObject 0 8 0 0 27. CloudOpsGuys Your Software | Our Service TMI think you have a memory leak 28. CloudOpsGuys Your Software | Our Service TMBonus question! Something unusual? GET /HTTP/1.1 Host: www.cloudopsguys.com Connection: keep-alive Accept:text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8 User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64)AppleWebKit/537.36 (KHTML, like Gecko)Chrome/27.0.1453.110 Safari/537.36 PTST/101 Accept-Encoding: gzip,deflate,sdch Accept-Language: en-GB,en-US;q=0.8,en;q=0.6 29. CloudOpsGuys Your Software | Our Service TMBonus question! Something unusual? GET /HTTP/1.1 Host: www.cloudopsguys.com Connection: keep-alive Accept:text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8 User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64)AppleWebKit/537.36 (KHTML, like Gecko)Chrome/27.0.1453.110 Safari/537.36 PTST/101 Accept-Encoding: gzip,deflate,sdch Accept-Language: en-GB,en-US;q=0.8,en;q=0.6 30. CloudOpsGuys Your Software | Our Service TMShared Dictionary Compressionover HTTP 31. CloudOpsGuys Your Software | Our Service TMTHANKYOUwww.cloudopsguys.comCloudOpsGuysYour Software | Our Service TM20 32. CloudOpsGuys Your Software | Our Service TMGet in Touch www.CloudOpsGuys.com0208 798 [email protected]/cloudopsguysfacebook.com/cloudopsguysskype: cloudopsguysplus.google.com/cloudopsguysSocial Media Social Media