Surya Prakash YadavSenior Software Developer
Back to All ProjectsConsumer Social Mobile App

High-Performance Short Video / Reels Application

60 FPS TikTok/Reels Style Vertical Video Social Experience

A high-throughput short-form video mobile platform delivering ultra-smooth vertical swipe feeds, intelligent video preloading and disk caching, asynchronous metadata ingestion, double-tap interactive reactions, and real-time comment threads.

My RoleLead Mobile Developer
Timeline & Scope4 Months

Key Verified Outcomes & Results

< 50ms
Average Video Start Latency
60 FPS
Butter-Smooth Feed Scroll Rate
99.9%
Crash-Free Rate (Zero OOM Spikes)
3.2x
Increase in User Session Duration
The Business & Technical Challenge

Consumer short-video platforms live and die by playback latency. Buffering wheels, frame drops during fast swipes, and memory leaks from unreleased player controllers cause severe user abandonment (>40%).

The Engineered Solution

Engineered an optimized video playback pipeline in Flutter utilizing native Android ExoPlayer / iOS AVPlayer hooks, a dual-layer LRU memory/disk cache, pre-fetching algorithms for adjacent videos (N+1, N+2), and a strict controller recycling pool to prevent memory leaks.

System Architecture

Clean Architecture + BLoC State Management + Video Controller Pool Pattern

Production Verified

Separates feed navigation from video decoding. A dedicated `VideoFeedBloc` coordinates playback states, while a `VideoPlayerPool` manages hardware decoders, preloads upcoming index buffers, and releases off-screen surfaces to guarantee 60fps scrolling.

Touch Event
1. Vertical PageView Swipe

User flicks upward; index changes from video [i] to [i+1].

Playback Engine
2. Controller Pool Activation

Pre-buffered instance at [i+1] plays instantly with 0ms buffering.

Cache Coordinator
3. Preload Ahead Worker

Asynchronously fetches initial media chunks for index [i+2] and [i+3].

Memory Guard
4. Discard & Recycle

Controller at [i-2] is stripped of decoder hardware and reset into idle pool.

Core Engineering Features & Capabilities

Seamless 60 FPS Vertical Paging with zero jitter between video transitions
Adaptive Pre-buffering Pipeline pre-caching the first 3 seconds of upcoming videos
Player Controller Recycling Pool capping active video decoders to 3 instances
Double-Tap Heart Micro-Animations and particle interaction effects
Real-Time Floating Comment Drawer with optimistic message posting
Audio/Video Synchronization with background pause/resume lifecycle management
HLS & MP4 Adaptive Bitrate Streaming support
Share Sheet & Watermarked Video Export utility

Complex Engineering Challenges & Technical Solutions

Challenge #1Out-of-Memory (OOM) Crashes on Budget Android Devices

Root Problem

Initializing a new VideoPlayerController per feed card quickly exhausted hardware media decoder limits on budget phones (max 4-6 decoders).

Senior Implementation

Built a strict 3-slot Controller Pool (Previous, Current, Next). Cards further away render high-res thumbnail covers only, and controllers are reassigned dynamically as the user scrolls.

Challenge #2Cold-Start Playback Latency

Root Problem

Waiting for HTTP metadata handshakes caused a 400-800ms black flash when switching videos.

Senior Implementation

Implemented a custom CacheManager that pre-fetches the initial 1.5MB of upcoming videos into local storage, enabling instantaneous playback onset.

Complete Technology & Tooling Stack

Flutter 3.xmobile
BLoC Architecturemobile
Video_Player & Better_Playermobile
ExoPlayer / AVPlayer Native Hooksmobile
Firebase Firestore & Storagebackend
Cloudflare Stream / AWS CloudFrontdevops
Framer / Rive Micro-Animationsfrontend
Hive (User Interaction Cache)database

Key Architectural Takeaways

  • Hardware video decoders must be treated as scarce finite resources on mobile operating systems.
  • Optimistic UI rendering combined with intelligent preloading makes cross-platform Flutter feel faster than unoptimized native code.