Understanding Cache Keys and Variants in Web Development

Scott and Wes dive into the cache problem, tackling user-specific data and caching security. From marketing A/B testing to content negotiation, they explore various challenges and solutions, including different URL/query parameters, edge logic, and client-side caching.

• 00:00 Welcome to Syntax!
• 01:22 Syntax is on YouTube.
• 02:16 Let’s talk about the cache problem.
• 03:33 User-specific data and caching security.
• 06:27 Why might this pop up?
  • 06:29 Marketing A/B testing - cookie based.
  • 06:55 User-selected features - such as themes.
  • 06:58 Language or geo-based items - accept language.
  • 07:11 Images - WebP for some browsers, jpg for others.
  • 07:45 JSON/HTML based on accept header.
  • 08:17 Different encoding.
• 08:26 Content negotiation.
• 08:54 The solutions.
  • 09:04 Provide different URLs/Query parameter.
  • 11:19 Don’t cache the page, cache the data based on query.
  • 15:01 Implement a “Cache Key” - one render for every option.
  • Netlify
  • Fastly
  • Cloudflare
  • 18:17 Use edge logic.
  • 19:52 Just do it client-side.

Syntax: X Instagram Tiktok LinkedIn Threads

Wes: X Instagram Tiktok LinkedIn Threads

Scott:X Instagram Tiktok LinkedIn Threads

Randy: X Instagram YouTube Threads