• Save
Dyna trace
Upcoming SlideShare
Loading in...5

Dyna trace



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)



Total Views
Views on SlideShare
Embed Views



0 Embeds 0

No embeds



Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
Post Comment
Edit your comment

Dyna trace Dyna trace Presentation Transcript

  • dynaTraceBrowser Performace AnalysisByYasmine M. Gaber13-06-2013
  • 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
  • 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).
  • 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
  • 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
  • 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
  • KPI’s on Load TimeTime to First ImpressionTime to onLoad EventTime to Fully Loaded
  • KPI’s on Load Time
  • 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
  • KPI’s on Resources
  • KPI’s on Network ConnectionsDNS TimeConnect TimeServer TimeTransfer TimeWait TimeNumber of Domains / Single ResourceDomains
  • KPI’s on Network Connections
  • 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.
  • Instant Testhttp://www.gomez.com/website-performance-test
  • Instant Testhttp://www.gomez.com/website-performance-test
  • Instant Testhttp://www.gomez.com/website-performance-test
  • Instant Testhttp://www.gomez.com/website-performance-test
  • dynaTrace AJAX Edition
  • 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
  • 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
  • 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
  • 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
  • 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
  • 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.
  • Questions ?
  • 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
  • Thank You !Twitter: @yasmine_mohamedEmail: yasmine.gaber@gmail.com