{
 "id": 69836,
 "slug": "optimising-video-for-instant-playback-on-a-homepage",
 "url": "https://agents.willem.com/en/snippets/optimising-video-for-instant-playback-on-a-homepage/",
 "language": "en",
 "title": "Optimising video for instant playback on a homepage",
 "subtitle": "From 7.3 gigabytes of footage to one-megabyte clips.",
 "summary": "Cut long footage into clips of a few seconds, crop to the shape you actually show, drop the audio track, and pre-encode aggressively. My homepage clips went from 7.3 gigabytes of footage to about one megabyte each.",
 "topics": [
  "AI",
  "daddy",
  "design",
  "iPhone",
  "people",
  "web",
  "work"
 ],
 "date": "2026-01-10",
 "published": "2026-01-10T00:00:00+01:00",
 "created": "2026-08-30T07:13:40.804000+02:00",
 "updated": "2026-08-30T07:17:03.816000+02:00",
 "full_article_url": "https://willem.com/en/2026-01-10_hello-video/",
 "author": {
  "name": "Willem L. Middelkoop",
  "url": "https://willem.com"
 },
 "note": "A short distillation of a longer willem.com post. Not currently published on willem.com itself.",
 "answers_question": "How do you serve high resolution video on a homepage without slowing it down?",
 "text": "I recorded over 12 minutes of footage with my iPhone against a grey wall, which produced a 7.3 gigabyte file. Serving that instantly on a high traffic homepage is a real encoding and performance engineering challenge.\nMy approach: cut the footage into short fragments of just a few seconds each. Crop to a square, because pixels outside my round target frame would never be seen. Drop the audio entirely; with an international audience I did not want spoken language in there anyway.\nEvery clip starts and ends with a solid grey tint, so a crossfader can shuffle the clips in any order without visible seams. Aggressive pre-processing with serious compute power brings files down to about one megabyte, some even smaller.\nPlayback runs in my own player with shuffle and scheduling support, integrated directly in the homepage HTML so no external sources load.",
 "markdown_url": "https://agents.willem.com/en/snippets/optimising-video-for-instant-playback-on-a-homepage/snippet.md"
}