1 / 11

Sofia Event Center 14-15 May 2014

Sofia Event Center 14-15 May 2014. Debugging, Profiling and Optimizing Web Apps with IE11 – F12 Developer Tools. Angel Todorov Principal Architect, Infragistics Inc. Contents. Using the DOM Explorer Using the Console Debugger Analyzing network activity Profiling – time & memory

wyome
Download Presentation

Sofia Event Center 14-15 May 2014

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. Sofia Event Center 14-15 May 2014 Debugging, Profiling and Optimizing Web Apps with IE11 – F12 Developer Tools Angel Todorov Principal Architect, Infragistics Inc.

  2. Contents • Using the DOM Explorer • Using the Console • Debugger • Analyzing network activity • Profiling – time & memory • Using the UI Responsiveness Tool • Emulating geolocation / doc modes / orientations, etc. • Resources

  3. Using the DOM Explorer • Intellisense & auto-completion • Drag & drop DOM nodes • The “Changes” & “Events” tabs • Pseudo-class toggle (Windows 8.1) – Hover & Visited

  4. Using the Console • Execution targets (iframes) • Console Debugging API • Intellisenseautocompletion • Recording messages

  5. Debugger • Just my Code • No refresh debugging • Pretty print • Source Maps (Windows 8.1) • Tracepoints • Breakpoints changes • Tabbed scripts

  6. Analyzing Network Activity • Request timing • Network toolbar • Request/response details

  7. Profiling – time & memory • Profiler overview • Precision profiling • Inclusive & Exclusive times • Memory tool (brand new) – overview • User marks • Taking and comparing heap snapshots • Detecting memory leaks

  8. Using the UI Responsiveness Tool • Performance dashboard • The timeline view • Interpreting events (timeline details)

  9. Emulation • Document Modes • Enterprise Mode (Windows 8.1) • Display Emulation • Geolocation emulation

  10. Resources • What’s new in F12 Developer Tools: • http://msdn.microsoft.com/en-us/library/ie/bg182632(v=vs.85).aspx • Using the F12 Developer Tools: • http://msdn.microsoft.com/en-us/library/ie/bg182326(v=vs.85).aspx • MS BUILD 2014 - Internet Explorer 11’s Developer Tools, F12, Just Got Nicer (Again) • http://channel9.msdn.com/Events/Build/2014/3-580

  11. Questions??? Share your feedback for this particular session and for the overall conference experience at http://aka.ms/intouch for a chance to win our prizes!

More Related