Networking committee · Interactive lesson

Three transports. One page bundle. Different outcomes.

Put TCP, UDP, and QUIC through the same controlled network conditions and watch what each transport does with order, loss, and recovery.

Start where you are

How much setup do you want?

Choose a learner mode

Both paths use the same lab, comparison checkpoint, and protocol scenarios.

Beginner primer enabled.

Beginner primer

A web request becomes many small deliveries.

Client and server

Your browser is the client. It asks for a resource; a server answers with bytes that the browser can turn into a page.

Packets

A large response is split into smaller pieces. Those pieces can be lost or arrive in a different order while crossing a network.

Transport rules

TCP, UDP, and QUIC decide what the receiver gets to see and who is responsible for putting the pieces back together.

Protocol stack

HTTP chooses a transport relationship.

This lesson separates browser HTTP from raw datagrams. HTTP/1.1 and HTTP/2 use TCP; HTTP/3 uses QUIC, which runs over UDP.

Established web

HTTP/1.1 or HTTP/2TCP

One reliable, ordered byte stream carries the HTTP data.

Modern web

HTTP/3QUICUDP

QUIC adds reliable, encrypted independent streams on top of UDP.

Application choice

Raw UDPDatagrams

The application must decide whether to order, retry, or repair them.

Not ordinary browser HTTP

The comparison lab

Send the same page through all three lanes.

The bundle contains an HTML shell, two CSS chunks, and three image chunks. Change one network condition and compare the transport response.

Ready to run.

Network preset

All chunks arrive normally.

Shared event timeline

One condition, three transport rules

CONCEPTUAL / REPEATABLE

    Ordered stream

    TCP

    Reliable

    One sequence: later bytes wait behind a missing segment.

    Page resources

    0 / 3

      Packet events

      0 events
        READY

        Run a preset to see ordered delivery.

        Best-effort datagrams

        UDP

        Minimal

        Independent datagrams: loss and order stay visible to the app.

        Page resources

        0 / 3

          Packet events

          0 events
            READY

            Run a preset to see independent datagrams.

            Independent streams

            QUIC

            Stream-aware

            Reliable encrypted streams: one stream can wait while others continue.

            Page resources

            0 / 3

              Packet events

              0 events
                READY

                Run a preset to see stream independence.

                Comparison checkpoint

                Choose first. See the reason immediately.

                There is no score or account. Use each answer to test your model.

                Question 1

                Which transport makes later data wait behind a missing earlier segment?

                Question 2

                Which lane leaves a lost image datagram lost without built-in recovery?

                Question 3

                Which transport can keep unrelated streams progressing during image recovery?

                Protocol choice

                Pick a transport for the job.

                Choose before reading the recommendation, then replay with another protocol.

                Scenario 1

                Download a large file

                Every byte matters, even if the transfer takes a little longer.

                Scenario 2

                Send a live multiplayer update

                A late update can be worse than a missed one if the next state has already arrived.

                Scenario 3

                Load a modern page on a moving phone

                Keep reliable page data moving while the connection changes underneath it.