Internet Explorer developer tools available in Microsoft Internet Explorer(IE) and Microsoft Edge work like web development tools. These developer tools can help to design and debug a web page. Developers can test a web page, maintain its compatibility and fix errors. IE developer tools are also known as F12 developer tools in Windows 10. The UI(User Interface) and features of Internet Explorer 11 Developer Tools have changed substantially. Earlier versions of IE were not very developer friendly but huge improvement is visible in the new versions. IE developer tools now consist of a lot of features identical to browsers such as Chrome and Firefox along with some unique ones which make developing and debugging an easier task.
The debugger provides full debugging controls over webpages which makes it the most important developer tool in IE. Web components can be selected individually for debugging but no permanent modifications can be done. The Debugger can be opened by pressing Ctrl+3 after pressing F12 or by just clicking on Debugger icon in developer tools. You can browse and search the code from loaded source files and control execution flow as you go through the code. You will be able to manage page storage resources, set breakpoints and live edit the code while it runs. Local variables can be tracked and edited while debugging. A debugging session can be started by initiating a break in code, setting a breakpoint or by setting exception behavior.
This UI Responsiveness tool allows you to measure page performance relative to layout rendering. You can calculate the execution timings of components of your webpage. You will be able to track the location where most of the CPU cycles are being spent to run the webpage and to output the visual effects to users. This tool helps to find bottlenecks associated with timers or heavy DOM elements. You can get a stepwise analysis of the process causing a delay in page execution. In order to use this tool, you need to record a profile for a user scenario which needs analysis. After you stop the profiling, you will see CPU utilization, visual throughput, and timeline details. The CPU utilization graph reports the processing resources such as scripting, garbage collection, rendering, etc. that are consumed by browser subsystems to run the webpage. The visual throughput graph shows the estimated frames per second during profiling scenario. The timeline details pane provides the full analysis of events that occurred in the various subsystems of the browser.
Emulation is an IE tool that helps with the simulation of a lot of devices, screen sizes, resolutions, and browsers. You can choose between a desktop or a windows phone. You can also specify the browsers like Chrome, Firefox, etc for simulation. An option to set the screen size is also present along with a portrait or landscape view option. If the site to be worked upon uses Geolocation API, customized geolocations can be tested for the website by entering latitude and longitude of any location. Emulation settings can be reset by pressing Ctrl+Shift+L.