About the UI of Network Tab
The tab provides various columns of the request, such as status, method, domain, file, etc. Above the tab, you will find various options to filter the request, disable caching, network throttling, etc.
1. Various Options:
The various option in the Tab are:
- Clear: Click it to clear the logs.
- Filter URLs: It is a search bar where you can search for patterns in the URL and file.
- Filter File Type: You can also filter on the basis of various file types, such as HTML, CSS, JS, images, etc.
- Pause/Resume: Click it to pause or resume recording network logs.
- New Request: On clicking it, a network action sidebar with the New Request pane will open. You can create your own request with the respective method, URL parameters, headers, and payload body.
- Search: On clicking it, a network action sidebar with a search pane will open. You can search the header and content of all the listed requests.
- Request Blocking: On clicking it, a network action sidebar with a blocking pane will open. You can add a URL to block it from being used by the web page. There is a checkbox to toggle request Request Blocking.
- Disable Cache: If checked, then the cache will be disabled for the web page so that you can view all possible network requests for the web page.
- Network Throttling: You can emulate various network speeds by selecting from the drop-down list. This helps a lot for inspecting the loading of the web page at different network speeds.
- Network Settings: You get an option to enable persistent logs that helps to disable the log refresh when you reload or navigate around the page. You also get various import and export options that are Import the HAR file, save the All As HAR file, and copy All As HAR.
2. Request Details:
If you click a request in the logs, you get a sidebar with various panes with different details about the request. The various panes in the sidebar are:
- Headers: It provides various information about the method, response headers, and request headers. You have the option to filter the header information, block the request, or resend the request, which will open the network action sidebar.
- Cookies: The cookies for the request are displayed in this pane. You also get the option to filter the cookies.
- Request: The request payload information is displayed in this pane, and you also get to filter various request parameters.
- Response: The response data is present in this pane. You get the option to view the raw data and filter the properties.
- Cache: If the responded resource is cached, then this pane displays the cached information of the resource.
- Timings: It provides the breakdown timing information of the whole request process, such as DNS resolution, TLS setup, waiting, receiving, etc.
- Stack Trace: Provides a list of files that trace the call stack of the responses.
- Security: This provides various HTTPS information related to the connection, host, and certificate.
3. Additional Information:
At the bottom of the tab, you get a performance analysis option and various information, such as the number of requests, the size or transferred size of all requests, the total time needed to load all the requests, the time when the DOMContentLoaded event occurred, and the time when the load event occurred.
The performance analysis button, which looks like a stopwatch, is present in the bottom-left corner of the Network tab. It provides a pie chart and table for displaying request information when the browser cache is primed and when the browser cache is empty.
Network Tab in Mozilla Firefox Browser
The Network Tab in Firefox provides information regarding various requests for the web page. The various types of information it provides are the request’s header, cookies, response, etc. You can also filter the requests or set network throttling.
Table of Content
- Benefits of the Network Tab
- How to open the Network Tab in Firefox?
- About the UI of Network Tab
- Showing usage of the Network Tab
- Conclusion