You type an address and press enter. Roughly this happens:
- DNS lookup. The domain name is translated to an IP address, because computers route by number.
- A connection opens to that address, usually secured with TLS, which is the S in HTTPS.
- Your browser sends a request. A method, a path, and some headers.
- The server sends a response. A status code, headers, and usually a body.
- The browser parses the HTML, and requests everything it references: stylesheets, scripts, images, fonts.
- It renders, running any JavaScript as it goes.
Almost every question about why a site is slow, broken, or behaving oddly is a question about one of those six.
Why this matters even if you never build a server
- Slow page? Usually step 5, too many things to fetch, or step 6, too much JavaScript.
- Works locally, fails deployed? Usually a step 3 or 4 difference: a different address, a missing header, a blocked origin.
- Something loads but looks wrong? Step 5 ordering, or a request that failed silently.
A request, seen plainly
```
GET /courses/javascript-foundations HTTP/1.1
Host: earniculum.com
Accept: text/html
```
A method (GET), a path, and headers describing what you want and who you are.
And a response
```
HTTP/1.1 200 OK
Content-Type: text/html; charset=utf-8
Cache-Control: public, max-age=3600
```
A status, then headers, then the body. Everything on the web is this exchange repeated, thousands of times a day.
Make the lesson usable
A page load is not one event. DNS, the connection, request, response, asset loading, and rendering can fail independently. The useful habit is to identify the earliest stage that differs from a working case; everything after that point is usually a symptom rather than the cause.
Trace one real page
- Open a familiar page, open developer tools, choose Network, and reload.
- Select the first document request. Record its method, status, content type, and duration.
- Find a stylesheet, script, and image requested after the document; each is a separate exchange.
- Compare an offline reload with a 404 or 500 response. Describe how the evidence differs.
- Write one sentence naming the earliest failed stage. Use it as the opening line of a bug report.
Check your understanding
01Why can a page return 200 and still look broken?
The document succeeded, but a later stylesheet, script, image, or rendering step may have failed.
02What does DNS provide?
It translates a domain name into an address the network can route to.
03Where should you begin when production differs from local development?
Compare the first request or response that differs, including its URL, headers, status, and body.