This topic describes Web Inspector features you can use to help debug and optimize your application.
The Web Inspector has the following tabs:
The "Elements" tab allows you to see the Web page components (the CSS style, event listeners, and properties).
Figure 1. "Elements" tab
Figure 2. "Console" tab
Figure 3. "Sources" tab
The "Network" tab allows you to inspect resources downloaded over the network.
Figure 4. "Network" tab
The "Timeline" tab allows you to perform advanced timing and speed analysis. You can see how long the browser takes to handle DOM events, and render and paint windows.
Figure 5. "Timeline" tab
Figure 6. "Profiles" tab
Figure 7. "Application" tab
The "Audits" tab allows you to analyze a page as it loads and provide suggestions and optimizations for decreasing load time and increase perceived (or real) responsiveness.
Figure 8. "Audits" tab