a look at the performance of sap's modern uis

Download A Look at the Performance of SAP's Modern UIs

Post on 18-Nov-2014

529 views

Category:

Technology

2 download

Embed Size (px)

DESCRIPTION

Making the case for the consideration of network topologies on the performance of UI technologies, and presenting some sample measurements across traditional SAP GUI, WebDynpro for ABAP, and the UI5-based Fiori apps.

TRANSCRIPT

  • 1. Sascha Wenninger A Look at the Performance of SAPs Modern UI Technologies
  • 2. programming.oreilly.com/2009/07/velocity-making-your-site-fast.html
  • 3. programming.oreilly.com/2009/07/velocity-making-your-site-
  • 4. h
  • 5. h
  • 6. What Now? Understand your Environment Assess your Technologies
  • 7. Your Environment Who? Where? How many? How criRcal is performance?
  • 8. MMG
  • 9. Client Time Network Time Server Time Perceived Response Time
  • 10. Client Time Network Time Server Time Perceived Response Time
  • 11. www.submarinecablemap.com
  • 12. www.telegeography.com
  • 13. www.telegeography.com
  • 14. To USA www.telegeography.com
  • 15. Bandwidth !== Latency More bandwidth is easy. Speeding up light is not. 1ms 100km* in fibre *Round-Trip distance
  • 16. h
  • 17. www.wondernetwork.com/pings
  • 18. wheresiYast.com
  • 19. Performance CriIcality Arguable but Non-core ma
  • 20. Measure Early, Measure OLen (and not just the server!)
  • 21. FREE! FREE! FREE! FREE! FREE! $50 FREE!
  • 22. h
  • 23. O-The Shelf Helps to set expectaRons Eyes wide open Buy Rme congure WAN accelerators properly deploy caching proxies in remote locaRons consider internet access strategies
  • 24. Custom Development Conscious decisions and trade-os Iterate and improve Rough & ready, informal is ne As long as you start early And improve as you go
  • 25. Rule 1 - Make Fewer HTTP Requests Rule 2 - Use a Content Delivery Network Rule 3 - Add an Expires Header Rule 4 - Gzip Components Rule 5 - Put Stylesheets at the Top Rule 6 - Put Scripts at the Bo
  • 26. Rule 1 - Make Fewer HTTP Requests Rule 2 - Use a Content Delivery Network Rule 3 - Add an Expires Header Rule 4 - Gzip Components Rule 5 - Put Stylesheets at the Top Rule 6 - Put Scripts at the Bo
  • 27. Rule 1 - Make Fewer HTTP Requests Rule 2 - Use a Content Delivery Network Rule 3 - Add an Expires Header Rule 4 - Gzip Components Rule 5 - Put Stylesheets at the Top Rule 6 - Put Scripts at the Bo
  • 28. Rule 1 - Make Fewer HTTP Requests Rule 2 - Use a Content Delivery Network Rule 3 - Add an Expires Header Rule 4 - Gzip Components Rule 5 - Put Stylesheets at the Top Rule 6 - Put Scripts at the Bo
  • 29. Rule 1 - Make Fewer HTTP Requests Rule 2 - Use a Content Delivery Network Rule 3 - Add an Expires Header Rule 4 - Gzip Components Rule 5 - Put Stylesheets at the Top Rule 6 - Put Scripts at the Bo
  • 30. Make Fewer Requests Speed up Round-Trips Reduce Payloads Browser Eciencies
  • 31. 0% Cacheable 3 Round Trips Download: 15 kB Opening PA20
  • 32. + Few round-trips + Small payloads + Efficient - Single threaded Not good for latency - Proprietary no caching - Uncool
  • 33. Web Dynpro ABAP
  • 34. 95% Cacheable 74 Round Trips Download: 1,300 kB Web Dynpro Leave Request
  • 35. h
  • 36. Download: 2,770 kB Fiori Leave Request 56 Round Trips 84% Cacheable
  • 37. Payload (kB) 0 500 1000 1500 2000 2500 3000 Fiori Web Dynpro 0 10 20 30 40 50 60 70 80 Fiori Web Dynpro Chaoness IniRal Cached
  • 38. Googles mod_pagespeed Automagic server-side web page opRmisaRon Recompresses images Combines CSS & JavaScript les Applies minicaRon etc. etc.
  • 39. 37% Fewer Requests Google PageSpeed Score: 88 ! 98 YSlow Score: 83 ! 93 It works:
  • 40. Fiori is JavaScript-driven: Very minimal HTML JS loads more JS, other resources to build page PageSpeed can only opRmise HTML & references