Your SlideShare is downloading. ×
Dyna trace
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Dyna trace

2,595
views

Published on

Presentation that explains the main concepts used with dynaTrace. …

Presentation that explains the main concepts used with dynaTrace.
dynaTrace is a tool to perform browser performance analysis (for JS, images, CSS, network, caching, ..etc)

Published in: Technology

0 Comments
5 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,595
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
0
Likes
5
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. dynaTraceBrowser Performace AnalysisByYasmine M. Gaber13-06-2013
  • 2. AgendaWhat is dynaTrace ?Why should you use dynaTrace ?dynaTrace CapabilitiesKey Performance Indicators (KPI’s)Instant TestdynaTrace AJAX EditionBest Practices to improve performance
  • 3. What is dynaTrace ?Offers the most advanced deep-dive webperformance diagnostics into JavaScript execution,DOM access, rendering activities and network trafficfor analyzing and troubleshooting web applications.Quickly trace and profile web apps to understandperformance characteristics.Identify hotspots and isolate performance problems.Works with browsers: Internet Explorer (6 – 10) andFirefox (3.6 – 20) on Windows (XP, 7 , 8).
  • 4. Why should you use dynaTrace ?Find Whats Causing WebPerformance IssuesInvestigate Potential WebPerformance ImprovementsBuild More Interactive Web Apps FasterUnderstand Exactly What Is Happening in theBrowser
  • 5. dynaTrace CapabilitiesCross-Browser DiagnosticsCode-Level Visibility Into FrameworksSpeed Up Page Load TimesOptimize Page RenderingCompare Website To PeersDeep Javascript And Dom TracingShare Data With Your Peers
  • 6. Key Performance Indicators (KPI’s)Tell you how fast or slow your web site is tothe end user.Driven by efforts from web performancespecialists such as Steve Souders andcompanies like Google and Yahoo!Divided into:a) KPI’s on Load Timeb) KPI’s on Resourcesc) KPI’s on Network Connections
  • 7. KPI’s on Load TimeTime to First ImpressionTime to onLoad EventTime to Fully Loaded
  • 8. KPI’s on Load Time
  • 9. KPI’s on ResourcesTotal Number of RequestsTotal Number of HTTP 300s/400s/500sTotal Size of Web SiteTotal Size of Images/CSS/JSTotal Number of XHR Requests
  • 10. KPI’s on Resources
  • 11. KPI’s on Network ConnectionsDNS TimeConnect TimeServer TimeTransfer TimeWait TimeNumber of Domains / Single ResourceDomains
  • 12. KPI’s on Network Connections
  • 13. Rank CalculationsTime to First Impression: great if < 1s, acceptable if< 2.5s, slow if > 2.5sTime to onLoad: great if < 2s, acceptable if < 4s,slow if > 4sTime to Fully Loaded: great if < 2s, acceptable if <5s, slow if > 5sNumber of total HTTP Requests: great sites if < 40requests, acceptable sites if < 100 requests, bad sitesif > 100 requestsBrowser Caching, Network Resources,JavaScript/AJAX and Server-Side Activities.
  • 14. Instant Testhttp://www.gomez.com/website-performance-test
  • 15. Instant Testhttp://www.gomez.com/website-performance-test
  • 16. Instant Testhttp://www.gomez.com/website-performance-test
  • 17. Instant Testhttp://www.gomez.com/website-performance-test
  • 18. dynaTrace AJAX Edition
  • 19. Best Practices to improveperformanceBest Practices on Browser CachingBest Practices on Network Requests andRound-tripsBest Practices on JavaScript and AJAXPerformanceBest Practices on Server-Side PerformanceOptimization
  • 20. Best Practices on Browser CachingHTTP Caching Headers− Expires Headers− Cache-Control using max-age setting in secondsRank Calculations− Page scores a 100 if there are fewer than 5resources with missing cache settings or a setting inthe past.− Calculate the ratio of cached and short-cachedresources to the overall number of resources on thatpage− Penalize objects with NO cache settings or an expiresdate in the past by multiplying the ratio with 1.5
  • 21. Best Practices on NetworkRequests and Round-tripsAvoid Redirects, HTTP 400s and HTTP 500sOptimize:− Images (CSS Sprites and Compacting)− Style Sheets (Merge CSS Files)− JavaScript (Merge and Minimize JavaScript Files)Rank Calculations− Page scores a 100 if there are no redirects, 400s or 500sand no images, css and js files that could be merged.− Allows up to 1 css, 6 images and 2 js file from the samedomain− Penalize rank by 1 for each extra file
  • 22. Best Practices on JavaScript andAJAX PerformanceBlocking and long running script tags− Delay Loading JavaScript Files− Optimizing JavaScript ExecutionSlow CSS Selectors with jQuery/Prototype− Use Unique ID when possible (95% faster than usingclass name)− Specify a Tag name if you have to use the ClassName− Specify a parent context− Cache Lookup Results− Reduce the DOM Size
  • 23. Best Practices on JavaScript andAJAX PerformanceOptimize XHR calls when applicableManipulating the DOMRank Calculations− Allow 2 JavaScript files. Penalize the Rank forevery additional file− Sum the overall execution time of blocks thatexecute longer than 20ms. Every 50ms reducesthe Page Rank by 1 point− Penalize the page for more than 5 XHR calls
  • 24. Best Practices on Server-SidePerformance OptimizationServer requests:− First request on the page− Requests that return HTML− Requests that send GET or POST parameters− All XHR/AJAX RequestsRank Calculations− Allow up to 6 Server-Side requests. Every additionalrequest is penalized by 1 rank− For each request, penalize rank by1 if server time from 200ms to 400ms2 if server time between 400ms and 1000s4 if server time longer than 1s.
  • 25. Questions ?
  • 26. Resourceshttp://www.compuware.com/en_us/application-performance-management/products/user-experience-management/real-user-monitoring-web-and-mobile/capabilities.htmlhttps://apmcommunity.compuware.com/community/display/AJAX/dynaTrace+AJAX+Edition+Community+Home
  • 27. Thank You !Twitter: @yasmine_mohamedEmail: yasmine.gaber@gmail.com