1 / 19

Diagnosing performance and memory issues in JavaScript-based Windows Store Apps

This session, led by Program Manager II Andrew Hall, focuses on the critical aspects of optimizing app performance for JavaScript-based Windows Store applications. It covers essential practices for maintaining responsiveness and user engagement while exploring the Visual Studio Profiler, HTML5 Performance Analyzer, and JavaScript Memory Profiler. Attendees will learn to monitor memory usage, manage UI responsiveness, and analyze profiling data to improve app performance effectively. Ensure your app delivers a seamless user experience by mastering these performance strategies.

vinson
Télécharger la présentation

Diagnosing performance and memory issues in JavaScript-based Windows Store Apps

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Diagnosing performance and memory issues in JavaScript-based Windows Store Apps Andrew Hall Program Manager II 3-008

  2. The performance of an app will determine whether customers are willing to continue using your app, so make it great

  3. Agenda • Good Performance Practices • Visual Studio Profiler Basics • HTML5 Performance Analyzer • JavaScript Memory Profiler Basics

  4. Good performance practices • Be responsive, don’t block the UI thread • Users notice delays of more than 100ms • Break up longer operations or use web workers • Monitor your app’s memory use • The smaller your footprint the less likely the OS will terminate your app while suspended • Tune your apps performance regularly

  5. Visual Studio JavaScript profiler • Instrumentation-based profiling • Records how long every method takes to execute • Records exact counts of method calls • Only shows JavaScript execution time • Does not show work done by other systems (e.g., rendering or layout)

  6. Profiler terminology • Inclusive time: The total amount of time from when the function was entered until the function exited • Includes the total time spent in all child functions • Exclusive time: The amount of time spent executing code in just the function body • Does NOT include time spent in child functions

  7. Inclusive and exclusive time • function Alpha() • { • Beta(); • } • function Beta() • { • } 30 ms 80 30 50 50 50 ms

  8. Demo

  9. Performance Analyzer for HTML5 Apps • Walks you through testing your application • Generates a report measuring 13 tenets of performance • Installs with the SDK

  10. Demo

  11. JavaScript Memory Profiler • Identify unintentionally retained memoryand inefficient use of memory • Snapshot-based tool • Shows JavaScript and DOM elements • Size • Counts • Reference graph

  12. Memory terminology • Size: How large the object is in memory • Retained Size: The amount of memory that the object is preventing the garbage collector from reclaiming • Includes the size of the object • Includes the size of all referenced objects (and any objects they reference) that the current object is the only parent of in the memory graph

  13. Size and retained size Object A (100 KB) Object C (50 KB) Object A (100 KB) Object D (100 KB) Object B (500 KB) Object B (500 KB) 600 KB 600 KB 100 KB 500 KB 500 KB 50 KB 50 KB 100 KB 100 KB

  14. Demo

  15. Summary • Install the Visual Studio Quarterly Update #1 • Use the tools you already have to improvethe performance of your app • Visual Studio JavaScript Profiler • Visual Studio JavaScript Memory Profiler • HTML5 Performance Analyzer

  16. Questions?

  17. Related Sessions • [4-000] Building High-Performing JavaScript for Modern Engines • [3-014] Modern JavaScript

  18. Resources • Tools • HTML5 Performance Analyzer: http://msdn.microsoft.com/en-us/library/windows/apps/jj553524.aspx • Visual Studio Profiler: http://msdn.microsoft.com/en-us/windows/apps/hh696637.aspx • JavaScript Memory Analyzer: http://msdn.microsoft.com/en-us/library/windows/apps/jj819177.aspx • Performance Guidance • http://msdn.microsoft.com/en-us/library/windows/apps/jj553524.aspx • http://channel9.msdn.com/Events/Build/BUILD2011/APP-162T Please submit session evals on the Build Windows 8 App or at http://aka.ms/BuildSessions

More Related