Take a (Client) Hint!
summary
Client hints are concrete HTTP headers and navigator.connection values that let servers and service workers tailor responses: opt in via Accept-CH/Accept-CH-Lifetime, require HTTPS, and currently land in Chrome-derived browsers (about 68% reach). Use cases: inspect DPR, Width and viewport to pick exact image sizes (mod_rewrite or server scripts) and read save-data, RTT, downlink, ECT to score network quality. Real results: image negotiation cuts a 740K page to 414K and aggressive stripping down to 12 kilobytes; Cloudinary reports a median 42% byte savings.
AI-written summary · about
chapters (8)
- 0:00Introduction
- 0:57Understanding client hints
- 6:10Implementing client hints
- 9:10Device-based hints
- 16:43Advanced usage and logic
- 20:52Network-based hints
- 32:17Best practices and tips
- 35:50Q&A session
related talks
47mMore Than You Wanted to Know About Resource Hints
40mHTTP Headers for the Responsible Developer
52m“More Than You Ever Wanted to Know About Resource Hints”
39mHTTP headers for the responsible developer
46mHeaders for Hackers
08mThe Performance Alphabet
30mHTTP headers for the responsible developer
36mHacking Web Performance