QM - Developer Tools - Network

Created by Alex Avila

What is a network call?
A Network Call is a request made by a client (your browser/app) to an external server to exchange data. It follows the Request-Response cycle: the client asks for something (a file, a list of users, a login validation), and the server sends back a response (the data or an error message).

1/28

TermDefinition
What is a network call?
A Network Call is a request made by a client (your browser/app) to an external server to exchange data. It follows the Request-Response cycle: the client asks for something (a file, a list of users, a login validation), and the server sends back a response (the data or an error message).
What does a "403 Forbidden" status code usually indicate?
The server understands the request, but refuses to authorize it. a 403 means the server knows who you are, but you don't have permission for that specific action.
What is a composed of?
A network call is made up of two sides: Request (client → server) Response (server → client)
what are the Request components?
URL (Endpoint) – where the request is going Method – what action to perform (GET, POST, PUT, DELETE, etc.) Headers – metadata (auth tokens, content type, cookies, etc.) Body (optional) – data being sent (e.g., JSON payload)
what are the Response components?
Status Code – result (200, 404, 500, etc.) Headers – metadata about the response Body – returned data (HTML, JSON, etc.)
What is a URL in a network call?
The address of the resource being requested
What are headers used for?
To send metadata like authentication, content type, and cookie
Why are network calls important in debugging?
They reveal backend issues, failures, and performance problems affecting the user experience
What is the Network Stack?
shows detailed information about every network request made during a user session. It lets you inspect not just what calls happened, but also how they behaved over time.
What is the network call stack used for?
To view and analyze all network requests and their performance
Why is call order important?
It shows dependencies and which calls may block others
What are Request Headers?
"Instructions and Credentials" glued to the outside of your data package. They tell the server who you are, what you’re sending, and how you want the response delivered.
How are headers formatted?
As key-value pairs (e.g., Content-Type: application/json) server: AmazonS3
examples of headers
Request URL: https://shop.lululemon.com/static/fmodules/dcp/@lululemon/metarouter-plugin/latest/168.js Request Method: GET Status Code: 200 OK Remote Address: 23.37.17.14:443
What are response headers?
Response headers are key-value pairs sent back from the server to the client that provide metadata about the response.
response headers vs request headers
Request Headers are the client’s instructions to the server Response Headers are the server’s "terms and conditions" sent back to the browser. They tell the browser how to handle the data it just received.
What is a request body?
Data sent from the client to the server
What is a response body?
Data returned from the server to the client
what is the Request Body and Response Body?
Request Body & Response Body are the parts of a network call that carry the actual data
how does it work with the server? the Request Body and Response Body?
Request body (client → server): The data being sent to the server Response body (server → client): The data returned from the server
Why is the request body important for debugging?
It shows what data was sent to the server
Why is the response body important for debugging?
What is the request method?
it defines the specific action the client wants the server to perform on a given resource.
The Core Request Methods
GET POST PUT PATCH DELETE
What is the Initiator?
The Initiator is the link or script that triggered the network request. In the Chrome Network tab, the "Initiator" column provides a stack trace that allows you to work backward from the network call to the exact line of JavaScript that fired it.
what is a har file?
HAR (HTTP Archive) It is a JSON-formatted file that contains a detailed log of every single network request and response that occurred while the recorder was running.
what does a HAR contain?
A HAR file records all the metadata of a browsing session, including: - Request & Response Headers (Cookies, Auth tokens). - Payloads (The data you sent). - Timings (How long each DNS lookup, SSL handshake, and download took). - Status Codes (Every 200, 404, or 500 error).
Why is a HAR file better than a video for debugging?
a HAR file shows the hidden data, headers, and timing of every background call that led to that result.