Zrozum, co dzieje się od wpisania adresu w przeglądarce do wyrenderowania strony. DNS, IP, TCP, TLS, routing i HTTP wyjaśnione prostym językiem dla frontend developerów.
Wpisujesz google.com w przeglądarkę i po chwili widzisz stronę. Ale co dzieje się po drodze? Jak komputer znajduje właściwy serwer, jak dogaduje się z nim co do szyfrowania i jak odpowiedź wraca z sieci na Twój ekran?
Jako frontend developer używasz internetu codziennie, ale łatwo traktować go jak czarną skrzynkę. Ten artykuł rozkłada ten proces na części bez zbędnego żargonu. To wiedza, która przyda się i przy debugowaniu, i na rozmowie technicznej.
Krótka odpowiedź: Od URL do strony: DNS, czyli Domain Name System, tłumaczy nazwy domen na adresy IP potrzebne do połączenia z serwerem. resolwuje domenę na IP (cache lokalny → ISP → root servers) → TCP handshake (3-way) → TLS handshake (HTTPS) → HTTP request → serwer odpowiada HTML → przeglądarka parsuje i renderuje. Cały ten proces zwykle zajmuje od kilkudziesięciu do kilkuset milisekund, zależnie od cache, sieci i odległości od serwera.
Wielki obrazek — co się dzieje gdy wpisujesz URL
Code
1. Wpisujesz: google.com
↓
2. DNS: "google.com to 142.250.186.206"
↓
3. TCP lub QUIC: Nawiązanie połączenia transportowego
↓
4. TLS/HTTPS: Ustalenie szyfrowania i wysłanie żądania
↓
5. Serwer: Przetworzenie i odpowiedź
↓
6. Przeglądarka: Rendering HTML/CSS/JS
↓
7. Widzisz stronę Google
Teraz rozbijmy każdy krok.
Adresy IP — prawdziwe adresy w internecie
Komputery nie rozumieją google.com. Rozumieją adresy IP — numeryczne identyfikatory:
Code
IPv4: 142.250.186.206 (4 liczby 0-255)
IPv6: 2607:f8b0:4004:800::200e (dłuższy, więcej adresów)
Adres IP działa jak adres pocztowy dla ruchu sieciowego. W praktyce urządzenie często ma lokalny adres w sieci domowej, a na zewnątrz wychodzi przez publiczny adres routera lub infrastruktury operatora.
Twój komputer też ma IP:
Code
# Sprawdź swoje lokalne IPipconfig # Windowsifconfig # macOSip addr # Linux# Sprawdź publiczne IPcurl ifconfig.me
DNS — książka telefoniczna internetu
DNS (Domain Name System) tłumaczy nazwy domen na adresy IP:
1. Wpisujesz: google.com
↓
2. Przeglądarka: "Czy mam to w cache?" → Nie
↓
3. System operacyjny: "Czy mam to w cache?" → Nie
↓
4. Router: "Czy mam to w cache?" → Nie
↓
5. DNS Resolver (ISP): "Zapytam root server..."
↓
6. Root Server: "Zapytaj .com server"
↓
7. .com Server: "Zapytaj autorytatywny serwer domeny google.com"
↓
8. Serwer autorytatywny: "142.250.186.206"
↓
9. Odpowiedź wraca tą samą drogą (z cache)
A → IPv4 adres (google.com → 142.250.186.206)
AAAA → IPv6 adres
CNAME → Alias (www.google.com → google.com)
MX → Mail server
TXT → Tekst (weryfikacja, SPF)
NS → Name server
Klient: Wysyłam pakiet SEQ=1
Serwer: Otrzymałem, ACK=4 (czekam na kolejny od 4)
Klient: Wysyłam pakiet SEQ=4
Serwer: ACK=7
...
Jeśli ACK nie przyjdzie → retransmisja
UDP — szybkość bez gwarancji
UDP (User Datagram Protocol) to "fire and forget":
Szybszy (brak handshake)
Brak gwarancji dostarczenia
Brak kolejności
Używany w:
Streaming video/audio
Gry online
większość klasycznych zapytań DNS
VoIP
Warto znać ważny wyjątek: nowoczesny HTTP/3 działa na QUIC, czyli nad UDP, a nie nad TCP.
Porty — rozróżnianie usług
Jeden serwer może obsługiwać wiele usług. Porty je rozróżniają:
Code
IP: 142.250.186.206
Port 80: HTTP
Port 443: HTTPS
Port 22: SSH
Port 25: SMTP (email)
Pełny adres: 142.250.186.206:443
Każdy router decyduje: "Gdzie wysłać ten pakiet dalej?"
HTTP/HTTPS — protokół aplikacji
Na szczycie warstwy transportowej działa HTTP — protokół, którym rozmawiasz z serwerami web. W HTTP/1.1 i HTTP/2 najczęściej jedzie on po TCP, a w HTTP/3 po QUIC/UDP.
HTTP Request
Code
GET /search?q=hello HTTP/1.1Host: google.comUser-Agent: Mozilla/5.0...Accept: text/htmlAccept-Language: plCookie: session=abc123
1. Klient: "Cześć, obsługuję te algorytmy szyfrowania..."
2. Serwer: "OK, używamy AES-256. Oto mój certyfikat."
3. Klient: (weryfikuje certyfikat z CA)
4. Klient: "Oto zaszyfrowany klucz sesji"
5. Obie strony: Mają wspólny klucz, komunikacja zaszyfrowana
Certyfikat SSL/TLS zawiera:
Nazwę domeny
Klucz publiczny
Wystawcę (CA)
Datę ważności
Podpis cyfrowy
Sprawdź certyfikat:
Kliknij kłódkę w przeglądarce
openssl s_client -connect google.com:443
CDN — treść bliżej użytkownika
CDN, czyli Content Delivery Network, przyspiesza dostarczanie zasobów z serwerów bliższych użytkownikowi. (Content Delivery Network) to sieć serwerów na całym świecie:
Popularne CDN (używane też przez platformy serverless):
Cloudflare
AWS CloudFront
Fastly
Akamai
Co cachuje CDN:
Statyczne pliki (JS, CSS, obrazy)
Czasem całe strony HTML
Podsumowanie — pełna podróż requestu
Code
1. Wpisujesz: https://google.com/search?q=hello
2. DNS Resolution:
google.com → 142.250.186.206
3. TCP Handshake:
SYN → SYN-ACK → ACK
4. TLS Handshake:
Wymiana certyfikatów i kluczy
5. HTTP Request:
GET /search?q=hello HTTP/1.1
6. Routing:
Pakiety przez ~10-20 routerów
7. Serwer:
Przetwarza request, generuje HTML
8. HTTP Response:
200 OK + HTML
9. Przeglądarka:
Parsuje HTML, pobiera CSS/JS, renderuje
10. Widzisz wyniki wyszukiwania!
Czas: od kilkudziesięciu milisekund do setek milisekund, zależnie od DNS, odległości od serwera, TLS, cache i liczby dodatkowych zasobów.
Co dzieje się gdy wpisujesz adres URL w przeglądarkę?
Sekwencja kroków: (1) Sprawdzenie cache DNS w przeglądarce; (2) Jeśli brak — zapytanie do systemu operacyjnego i /etc/hosts; (3) Zapytanie do rekurencyjnego resolvera ISP; (4) Resolver pyta Root Server → TLD Server (.com) → Authoritative Server domeny → dostaje IP; (5) TCP three-way handshake (SYN → SYN-ACK → ACK); (6) TLS handshake (dla HTTPS) — wymiana certyfikatów i klucza; (7) HTTP request; (8) Serwer odpowiada HTML; (9) Przeglądarka parsuje HTML, pobiera zasoby (CSS, JS, obrazy), renderuje stronę.
Co to jest DNS i jak działa?
DNS (Domain Name System) to "książka telefoniczna internetu" — tłumaczy domeny (google.com) na adresy IP (142.250.186.206). Hierarchia: Root Servers (13 klastrów) → TLD Name Servers (.com, .pl) → Authoritative Name Servers (dla konkretnej domeny). DNS cache przyspiesza ten proces — przeglądarka, OS i ISP cachują wyniki przez czas TTL rekordu. Propagacja zmian DNS trwa 0-48 godzin ze względu na różne wartości TTL i cache w różnych punktach sieci.
Co to jest TCP i czym różni się od UDP?
TCP (Transmission Control Protocol): niezawodny, z potwierdzeniami (ACK), rejestruje utracone pakiety, gwarantuje kolejność. Wymaga three-way handshake przed transmisją. Używany przez HTTP/HTTPS, e-mail, SSH. UDP (User Datagram Protocol): bez potwierdzenia, bez retransmisji, szybszy. Używany przez DNS, streaming video, gry online, VoIP — gdzie prędkość ważniejsza od niezawodności. HTTP/3 (QUIC) działa na UDP ale dodaje własną warstwę niezawodności.
Czym jest TLS i jak zabezpiecza połączenie?
TLS (Transport Layer Security) to protokół szyfrowania działający między TCP a HTTP w HTTPS. Proces: (1) Client Hello — przeglądarka wysyła obsługiwane wersje TLS i algorytmy; (2) Server Hello — serwer wybiera algorytm, wysyła certyfikat SSL; (3) Przeglądarka weryfikuje certyfikat przez urząd certyfikacji (CA); (4) Wymiana kluczy i ustalenie klucza sesji; (5) Zaszyfrowana komunikacja. TLS szyfruje transmisję — chroni przed podsłuchiwaniem, ale nie naprawia problemów po stronie aplikacji.
Co to jest CDN i jak przyspiesza ładowanie stron?
CDN (Content Delivery Network) to sieć serwerów rozmieszczonych globalnie (edge nodes). Statyczne zasoby (obrazy, CSS, JS) są kopiowane na edge nodes blisko użytkowników. Gdy użytkownik z Polski odwiedza stronę hostowaną w USA, plik statyczny ładuje się z serwera CDN w Europie — nie z USA. Efekt: niższy latency, mniejsze TTFB, czyli Time to First Byte, mierzy czas od wysłania żądania do odebrania pierwszego bajtu odpowiedzi.. Cloudflare, AWS CloudFront, Fastly to popularne CDN. Vercel i Netlify mają wbudowany CDN dla statycznych assetów.
Co to jest IP, IPv4 i IPv6?
IP (Internet Protocol) to adres identyfikujący urządzenie w sieci. IPv4: 4 oktety (np. 192.168.1.1), ~4 miliardy adresów — skończyły się. IPv6: 128-bit (np. 2001:0db8::1), niemal nieograniczona przestrzeń adresowa. NAT (Network Address Translation) pozwala wielu urządzeniom za routerem dzielić jeden publiczny IP — to dlatego masz 192.168.x.x lokalnie, ale jeden publiczny IP. Większość serwerów wspiera dziś IPv4 i IPv6 jednocześnie (dual-stack).
Jak działają HTTP/2 i HTTP/3 w kontekście wydajności?
HTTP/1.1: jeden request per połączenie (lub pipelining, ale z problemami). Przeglądarka otwiera zwykle kilka połączeń per origin. HTTP/2: multiplexing — wiele requestów przez jedno połączenie TCP, bez head-of-line blocking na poziomie HTTP, header compression (HPACK). Znaczna poprawa przy wielu małych plikach. HTTP/3: używa QUIC (UDP-based), eliminuje head-of-line blocking na poziomie TCP, skraca koszt zestawienia połączenia i lepiej radzi sobie przy stratach pakietów, np. na mobile. Historyczny Server Push nie okazał się trwałą przewagą HTTP/2 i dziś nie jest głównym argumentem przy wyborze protokołu. Większość CDN i nowoczesnych serwerów wspiera HTTP/2 i HTTP/3.
Zrozumienie tych podstaw pomoże Ci debugować problemy sieciowe, optymalizować wydajność i lepiej współpracować z backendowcami. Przydatne będą też podstawowe narzędzia sieciowe, takie jak curl, DevTools i logi serwera.
Jeśli chcesz uporządkować backendowe fundamenty aplikacji i uniknąć typowych błędów architektonicznych już na starcie, skontaktuj się ze mną. Pomagam przekładać wiedzę techniczną na rozwiązania, które da się sensownie utrzymać i rozwijać.
Maciej Sala — project manager i frontendowiec z doświadczeniem w marketingu internetowym. Na co dzień pracuję z Reactem, Next.js i TypeScriptem, łącząc perspektywę produktową z praktycznym podejściem do kodu. Przez kilka lat związany z branżą gier wideo jako project manager i game designer.
Absolwent historii na Uniwersytecie Jagiellońskim i studiów podyplomowych z marketingu internetowego na Akademii Górniczo-Hutniczej w Krakowie. Poza pracą trenuje na siłowni, maluje figurki i realizuje własne projekty.
Anthropic uderza w Figmę i Adobe — oto Claude Design
Anthropic wypuścił właśnie narzędzie AI do tworzenia stron, landing page'ów i prezentacji z promptu. Oto co wiemy o Claude Design i Opus 4.7 — i co to oznacza dla developerów.
Astro.js vs Next.js — które narzędzie wybrać w 2026 roku?
Fachowe porównanie Astro.js i Next.js z perspektywy developera pracującego na co dzień w Next.js. Architektura, wydajność, SEO, DX, koszty i konkretne use case — z benchmarkami i przykładami kodu.
WordPress → Next.js — migracja treści, redirecty 301 i zachowanie pozycji SEO
Jak przenieść stronę z WordPress na Next.js bez utraty pozycji w Google? Eksport treści, mapowanie URL, redirecty 301, migracja obrazów i weryfikacja indeksacji.