f12 tools in edge
TRANSCRIPT
Kris van der Mast
www.krisvandermast.com
@KvdM
Since 2007
TESTING WEB APPS WITH REMOTE IE AND F12 DEVELOPER TOOLS
Agenda• Remote IE• IEdge• Demos• Questions
Remote IE• http://dev.modern.ie/tools/vms/• https://remote.modern.ie/subscribe
IE
Spartan
Edge
Fantasy vs reality We’re all awesomedevelopers…But even then wecan use a helping hand…
Browser Tools – A lot in common
DOM InspectionStyle TracingComputed PropertiesLayout ViewColor PickerDebuggerBreakpointsWatchesConsoleConsole API
CPU profilingStyle profilingNetwork tracingHeap snapshotsSnapshot diffingAuto completionInspect elementPretty printing
So, so many tools in the box*Not to scale or remotely mathematically sound!
The 80%Case
Browser Tools – A little unique
TracePointsStatement level JSJust my codeFind references
Set next statementTrack changesTypeScript coloring
3D viewWeb audio editorAnimationShader editor
Reflow event loggingResponsive design modeLots of extensions
Network throttlingDevice emulationPseudo elementsEdit and continue
Paint correlationCSS animationAnimation scrubbing
More…
More…
More…
The Road Ahead
Tools for IE11 on Win10+ are frozen
Full steam ahead for Microsoft Edge
Demos
New async operation “onreadystatechange” Global Codefetch_onClick
New async operation “addEventListner” for DOMContentLoadedGlobal Codeinit
New async operation “addEventListener” for clickGlobal CodeonDOMContentLoaded
Finally we break in the debugger…
Agenda• Remote IE• IEdge• Demos• Questions
• uservoice.modern.ie• connect.microsoft.com• github.com/microsoft• @MSEdgeDevTools• Send a smile
Give feedback to Microsoft!
Questions?
Your feedback is important!Scan the QR Code and let us know via the TechDays App.
Laat ons weten wat u van de sessie vindt via de TechDays App!Scan de QR Code.
Bent u al lid van de Microsoft Virtual Academy?! Op MVA kunt u altijd iets nieuws leren over de laatste technologie van Microsoft. Meld u vandaag aan op de MVA Stand. MVA biedt 7/24 gratis online training on-demand voor IT-Professionals en Ontwikkelaars.