perf(media): defer image/video decryption until near-viewport (P5-5)

Creates useNearViewport hook (IntersectionObserver, 200px rootMargin, one-shot disconnect after first trigger). ImageContent and VideoContent now gate loadSrc() on nearViewport — when autoPlay is enabled, encrypted media is not decrypted until the element is within 200px of the visible area, reducing initial page load cost on long timelines. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-06-18 17:56:34 -04:00
parent a6bf4eb7e7
commit 3df95adc52
4 changed files with 47 additions and 7 deletions
@@ -278,7 +278,7 @@ Themes:

 ---

-### [ ] P5-5 · Intersection-Based Lazy Loading
+### [x] P5-5 · Intersection-Based Lazy Loading ⚠️ UNTESTED — needs verification in timeline with many images

 **What:** Use `IntersectionObserver` to trigger media decryption and loading only when components approach the viewport.  
 **Approach:** Reduce initial memory footprint and improve timeline load times by deferring decryption of images/videos until they are visible.