Measuring User Experience

864 views

Published on

Published in: Self Improvement, Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
864
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
13
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • http://www.istockphoto.com/stock-photo-4781558-listen-to-me-dad.php?st=a570ca1
  • Measuring User Experience

    1. 1. Measuring User ExperienceAlois Reitbauer
    2. 2. Disclaimer
    3. 3. We used tomeasure here
    4. 4. We miss about 80%Your visibility ends here
    5. 5. … let‟s look at an example
    6. 6. Web Application Delivery Chain Content Internet ServerBrowser Processing 3rd Party
    7. 7. Robots forMonitoring
    8. 8. Monitor fromEverywhere
    9. 9. Robots are not humans(even if they come close)
    10. 10. Challenges TodayLack of standardsIn Browser Measurement ComplexMost tools for development/troubleshooting
    11. 11. We need this …
    12. 12. Request Start Time Business Event Time Time-to-First-ByteOnLoad Time DNS/Network Time Bandwidth Rendering TimeLatency (Geo)Location JS Execution Time Browser Info Resource Download TimeRendering Time
    13. 13. … we want to get all thisinformation non intrusively (aka hacking)
    14. 14. OnLoad Time Measurement<html> <head> <script type="text/javascript"> var start = new Date().getTime(); function onLoad() { var now = new Date().getTime(); var latency = now - start; alert("page loading time: " + latency); } </script> </head> <body onload="onLoad()"> ……
    15. 15. Resource Time Measurement……<script type="text/javascript"> downloadStart(“myimg”);</script><img src=“./myimg.jpg” onload=“downloadEnd(„myimg‟)” />…..
    16. 16. … browsers have all thisinformation, so why not expose it
    17. 17. W3CPerformanceWorkingGroup
    18. 18. Web Performance SpecsNavigation Timing Basic page navigation informationResource Timing Information about page resources (own & third party)User Timing Custom actions and high-res timerTimeline Unified Access to Performance Data
    19. 19. Understand Page Loading
    20. 20. Navigation Timingwindow.performance.timing.
    21. 21. Navigation Timing in Chrome
    22. 22. Navigation Timing on Windows Mobile
    23. 23. Let‟s try this ourselves ...
    24. 24. The page is not enough
    25. 25. Resource Timingwindow.performance.getEntriesByType(window.performance.PERF_RESOURCE)[].
    26. 26. Custom TimeMeasurements
    27. 27. Marksmark (markName) add a new mark with the current timestampgetMarks (markName) Retrieve all marks with the specified name. If none is specified all marks will be returned Result Structure: { <markName> : [<val1>, <val2>, …] ….. }
    28. 28. Measuresmeasure () fetchStart -> nowmeasure (startTime) startTime -> nowmeasure(startTime, endTime) startTime -> endTime
    29. 29. Performance Timeline
    30. 30. Real world exampleswhat‟s possible today
    31. 31. BrowserSupport
    32. 32. Open IssuesHow to send the data back to the serverRendering and JS ExecutionImplementing the backend servicesFull browser supportMore efficient bandwidth measurement
    33. 33. LegacyBrowsers
    34. 34. Alois Reitbaueralois.reitbauer@dynaTrace.com @AloisReitbauer http://blog.dynatrace.com

    ×