Skip to content
Scrollchart
Computing Rich #quic#http3#udp

QUIC: 1-RTT Encrypted Setup

TLS 1.3 fused into the transport. 0-RTT resumption, per-stream loss recovery.

A free, animated quic: 1-rtt encrypted setup you can read here or embed on any website, from Scrollchart.

QUIC: 1-RTT Encrypted Setup

QUIC Handshake: 1-RTT Setup over UDPTLS 1.3 fused into the transport, with 0-RTT resumption and per-stream loss recoveryClientServer1-RTT boundaryInitial[0]: CRYPTO ClientHello + key shareTLS 1.3 ClientHello carried in CRYPTO frame inside a long-header Initial packetInitial[0]: ServerHello, key share | Handshake: cert, verify, FINServer picks group, derives shared secret, encrypts the rest of the handshake immediately1-RTT: Handshake FIN + first encrypted application dataClient verifies, ACKs handshake, ships request bytes in the same flight1-RTT: application data responseConnection open. One round trip from cold start.Round-trip cost from cold startTCP + TLS 1.3: 2 RTT (SYN/SYN-ACK, then TLS ClientHello)QUIC v1: 1 RTT (transport and crypto fused)QUIC 0-RTT resumption: 0 RTT (early data with replay risk)What QUIC fixes versus TCPPer-stream loss recovery: one dropped packet does not stall siblingsConnection ID survives client IP and port changes (network migration)Encrypted transport headers reduce ossification by middleboxes

QUIC handshake over UDP merging transport and crypto setup into 1-RTT. Connection ID survives IP changes. Per-stream loss recovery avoids HOL blocking that plagues HTTP/2 over TCP.

Good for

  • HTTP/3 and QUIC adoption explainers
  • Web performance and TTFB content (mobile and lossy networks)
  • Networking course material on next-generation transports

Source & accuracy

This quic: 1-rtt encrypted setup is an editorial illustration built to represent the concept accurately. Where it shows figures, they are typical or representative values chosen to make the relationship clear, not a single underlying dataset. The diagram and its explainer are reviewed and maintained centrally, and updated over time as understanding improves.

Encryption in one round-trip

QUIC merges the transport layer (UDP) with TLS 1.3 encryption in a single protocol. A traditional TCP connection over TLS takes three steps: TCP SYN/ACK (1 RTT), then TLS handshake (1 RTT), then data (1+ RTT). QUIC does it in 1 RTT: the client sends initial packet with a key share, the server responds with its key and settings, and both derive shared encryption keys immediately. Data can be sent in the same packet as the client's initial message (0-RTT), encrypted under a pre-shared key from a prior connection.

Per-stream loss recovery

TCP treats a lost packet as a network-wide congestion signal and backs off all streams. QUIC separates this: each logical stream (request, response) has its own sequence numbers and loss detection. If stream A's packet is lost, stream B continues unaffected. This is critical for HTTP/3: a lost video frame in one stream does not slow the web page load in another. Loss recovery granularity matches application needs.

Connection migration

QUIC connections are identified by a connection ID, not IP and port. If a mobile user switches from Wi-Fi to cellular, their IP changes. TCP would close the connection. QUIC detects the IP change and validates the new peer, then continues the same connection seamlessly. This enables handoff during long requests, critical for video streaming and file uploads on mobile.

Embed this diagram

Add this animated quic: 1-rtt encrypted setup to your own site. Copy one line of HTML, or use the embed builder for theme and sizing options.

Reference

What this is
A free, embeddable, animated quic: 1-rtt encrypted setup for any website.
Who uses it
Developer blogs, DevOps / SRE sites, Security blogs.
How to embed
Copy one line of HTML. No signup. No watermark. Works in WordPress, Webflow, Ghost, Substack, plain HTML.
File size
iframe embed, ~80 KB gzipped (loads on demand, does not block your page paint).
License
Free forever. Editorial explainer text included; updated centrally over time.
URL
scrollchart.com/diagram/quic-handshake

Embed format options

Copy the universal HTML snippet, the WordPress shortcode, or an iframe fallback - see the WordPress plugin page for details. Any format keeps the same Core Web Vitals profile and the same explainer text.

Embed snippet 
<div data-scrollchart="quic-handshake" data-scrollchart-v="1"></div>
<script src="https://scrollchart.com/embed.js" async></script>

By embedding, you acknowledge the diagram and explainer text are served from scrollchart.com and may be updated from time to time to reflect new research or to link to relevant sources within the explainer.

Frequently asked questions

Where can I get a free animated "QUIC: 1-RTT Encrypted Setup" for my website?
Scrollchart provides "QUIC: 1-RTT Encrypted Setup" as a free, embeddable animated diagram you can add to any website with one line of HTML. No signup is required and there is no watermark. The diagram and its explainer text are served from scrollchart.com, so the embed stays current without any maintenance on your end.
How do I embed a quic: 1-rtt encrypted setup in a developer or tech blog?
Copy the one-line snippet from the Scrollchart diagram page and paste it into your post HTML. It works in any static site generator, CMS, or hand-coded HTML page. The embed is a thin loader, not an iframe, so the content is fully in your DOM.
Related diagrams

Other computing explainers

See all computing →
Computing Rich

TLS 1.3 Handshake

Client hello, key share, server response, finished. Encrypted in 1-RTT, optional 0-RTT resumption.
Computing Rich

TCP State Machine

CLOSED to ESTABLISHED to TIME_WAIT and back. The full TCP lifecycle as a state diagram.
Computing Rich

HTTP/2 Frames and Streams

Multiple streams interleave on a single TCP connection. Head-of-line blocking gone (mostly).