📹 How Pinterest Improved Video Playback with ABR (Adaptive Bitrate Streaming)

📹 How Pinterest Improved Video Playback with ABR (Adaptive Bitrate Streaming)

2025-07-20

Intro

Hey everyone!

Ever wondered how platforms like Pinterest ensure seamless video playback, even on poor network connections?

In this post, we’ll explore how video streaming works, what ABR (Adaptive Bitrate Streaming) is, and how Pinterest made key enhancements to reduce video startup latency and improve user experience.

🎬 How Video Streaming Works

Imagine you’re building your own video streaming app. Your users could be on a mobile phone, a laptop, or a smart TV — all with different screen resolutions and network conditions. So, how do you serve a smooth experience across the board?

✅ Step 1: Create Multiple Resolutions

Videos are transcoded into multiple formats (e.g., 240p, 480p, 720p, 1080p) and stored in object storage like S3. They’re then delivered globally via CDNs to minimise latency.

✅ Step 2: Stream in Chunks

Videos are not downloaded all at once. Instead, they are broken into smaller chunks (say 100 total). The client fetches only the first few (e.g., chunks 1–3) and begins playback immediately. Meanwhile, upcoming chunks are downloaded in the background.

For instance

“Think of it like this: you’re watching a movie that comes in 100 pieces. Instead of waiting to download the whole movie, you just download the first few pieces to start watching immediately. While you watch, more pieces keep downloading in the background.”

✅ Step 3: Smart Chunk Fetching

If the user is watching in 1080p but suddenly hits a network dip, continuing in 1080p could lead to buffering.

The fix? Let the client detect network conditions and adaptively switch to a lower resolution, like 480p temporarily. When the network stabilises, it switches back to higher quality, all without user interruption.

🗂 Manifest Files — The Streaming Map

Each video resolution has its own manifest file, which lists chunk IDs and the URLs to fetch them from.

{
  "chunks": {
    "chunkId1": "url1",
    "chunkId2": "url2"
  }
}

These manifest files are referenced via a master manifest, which helps the client discover all available resolutions.

Playback Flow

  • User clicks a video → backend returns metadata + master manifest URL.
  • Client fetches the master manifest from the CDN.
  • Client reads it and fetches the required resolution-specific manifest.
  • The client starts fetching chunks based on the current network condition.

t

🎚 What is ABR (Adaptive Bitrate Streaming)?

ABR is the logic built into your video player that dynamically chooses the best resolution based on your network speed, aiming to reduce buffering and maximise quality.

Supported Protocols

  • HLS (by Apple) — used in iOS with AVPlayer.
  • DASH — widely used in Android with ExoPlayer.

These players:

  • Fetch manifests
  • Monitor bandwidth
  • Switch resolution on the fly

🛠 The Problem at Pinterest

Pinterest observed that multiple small network calls to load manifest files were slightly delaying video startup. Even though manifest files are small, fetching them separately adds overhead.

⚡ Pinterest’s Solution

🚀 Optimisation Strategy

Pinterest started sending all manifest files upfront in the initial API response (when the client requests video metadata). This way, the client can skip separate network calls for manifest files and jump straight into chunk fetching.

t

🔍 Engineering Deep Dive

When Pinterest decided to include all manifest files in the initial backend API response, it meant the server had to fetch and bundle multiple manifests in real time, which could have increased latency.

Here’s how they optimised it:

  • ✅ Parallel Fetching at the Backend: Instead of retrieving manifest files sequentially, Pinterest’s backend fetched them in parallel, reducing the total fetch time significantly.
  • ⚡ memCache for Popular Videos: A memCache layer was introduced on the backend. For trending or frequently viewed videos, manifest files were served directly from memory, resulting in faster API responses.
  • 📦 Fallback to S3 on Cache Miss: If a manifest wasn’t found in cache, the backend fell back to fetching it from S3 storage.
  • 🧠 Custom Player Logic: Since the client now receives all manifest files upfront, Pinterest also overrode the default logic in AVPlayer (iOS) and ExoPlayer (Android) to skip making additional manifest fetch calls.

t

🧩 Overriding Default Players

Normally, AVPlayer (iOS) or ExoPlayer (Android) fetches manifests. Pinterest customised them to use the pre-fetched manifests from the API response instead.

📈 Outcome

These backend optimisations helped Pinterest significantly improve video playback performance:

  • 📉 35% reduction in video startup latency by eliminating multiple manifest fetch calls.
  • 🚀 Increased video playback success rate, especially on slower networks.
  • 📈 Boost in user engagement metrics, as users experienced faster and smoother video starts.

This showcases how even small architectural optimisations, like bundling manifest files and caching smartly, can lead to meaningful improvements in real-world performance and user satisfaction.

🧠 Conclusion

To recap:

  • We learned how video streaming and ABR work.
  • We saw how manifest files play a critical role.
  • Pinterest smartly optimised manifest loading by bundling them into the first API call, improving playback performance.

💬 Got Questions?

Drop them in the comments — I’d love to answer.

If you’re curious about the exact implementation, check the references below.

And let me know what topic you want me to cover next!

References

Other Blogs


Enjoyed the read? Share it: