\n
![](\"https:\/\/blogger.googleusercontent.com\/img\/b\/R29vZ2xl\/AVvXsEi3xfaeSVwhItxPTRdI2vEUu6t8ZSJWKMYB6xWkb9inI8ab1GltWuCExl29Z8SAQ1Fo2A4moEQLykBdkjIZ_IqikrD-QrmkwWKCOaKALh5fMiV5SRRUM7JRmjavEZ64horigEBxNK5RtW_NI88_LjbqTa69Os3a-ADQbrNp7R5e78dXmkc7rsYyx3cRYdo\/s1600\/AndroidSpotlight_Camera&Media_Blog_Media3%201.5.0_Card%20%281%29.png\")
<\/p>\nPosted by Mayuri Khinvasara Khabya – Developer Relations Engineer (LinkedIn<\/a> and X<\/a>)<\/em><\/p>\n In today’s media-centric apps, delivering a smooth, uninterrupted playback experience is key to a delightful user experience. Users expect their videos to start instantly and play seamlessly without pauses.<\/p>\n The core challenge is latency. Traditionally, a video player only starts its work\u2014connecting, downloading, parsing, buffering\u2014after the user has chosen an item for playback. This reactive approach is slow for today’s short form video context. The solution is to be proactive. We need to anticipate what the user will watch next and get the content ready ahead of time. This is the essence of preloading.<\/p>\n The key benefits of preloading include:<\/p>\n In this three-part series, we’ll introduce and deep dive into Media3\u2019s powerful utilities for (pre)loading components.<\/p>\n The core idea behind preloading is simple: load media content before you need it. By the time a user swipes to the next video, the first segments of the video are already downloaded and available, ready for immediate playback.<\/p>\n Think of it like a restaurant. A busy kitchen doesn’t wait for an order to start chopping onions. \ud83e\uddc5 They do their prep work in advance. Preloading is the prep work for your video player.<\/p>\n When enabled, preloading can help minimize join latency when a user skips to the next item before the playback buffer reaches the next item. The first period of the next window is prepared and video, audio and text samples are buffered. The preloaded period is later queued into the player with buffered samples immediately available and ready to be fed to the codec for rendering.<\/p>\n In Media3 there are two primary APIs for preloading, each suited for different use cases. Choosing the right API is the first step.<\/p>\n This is the simple approach, useful for linear, sequential media like playlists where the playback order is predictable (like a series of episodes). You give the player the full list of media items using ExoPlayer’s playlist<\/a> APIs and set the PreloadConfiguration<\/a> for the player, then it automatically preloads the next items in the sequence as configured. This API attempts to optimize the join latency when a user skips to the next item before the playback buffer already overlaps into the next item.<\/p>\n Preloading is only started when no media is being loaded for the ongoing playback, which prevents it from competing for bandwidth with the primary playback.<\/p>\n If you\u2019re still not sure whether you need preloading, this API is a great low-lift option to try it out!<\/p>\n <\/p>\n With the PreloadConfiguration<\/a> above, the player tries to preload five seconds of media for the next item in the playlist.<\/p>\n Once opted-in, playlist preloading can be turned off again by using PreloadConfiguration.DEFAULT<\/span> to disable playlist preloading:<\/p>\n <\/p>\n For dynamic UIs like vertical feeds or carousels, where the “next” item is determined by user interaction, the PreloadManager API is appropriate. This is a new powerful, standalone component within the Media3 ExoPlayer library specifically designed to proactively preload. It manages a collection of potential MediaSources, prioritizing them based on proximity to the user’s current position and offers granular<\/u><\/b> control over what to preload, suitable for complex scenarios like dynamic feeds of short form videos.<\/p>\n The DefaultPreloadManager<\/a> is the canonical implementation for PreloadManager.<\/p>\n The builder of DefaultPreloadManager<\/span> can build both the DefaultPreloadManager and any ExoPlayer<\/a> instances that will play its preloaded content. To create a DefaultPreloadManager, you will need to pass a TargetPreloadStatusControl, which the preload manager can query to find out how much to load for an item. We will explain and define an example of TargetPreloadStatusControl in the section below.<\/p>\n <\/p>\n Using the same builder<\/a> for both the ExoPlayer and DefaultPreloadManager is necessary, which ensures that the components under the hood of them are correctly shared.<\/p>\n And that’s it! You now have a manager ready to receive instructions.<\/p>\n What if you want to preload, say, 10 seconds of video ? You can provide the position of your media items in the carousel, and the DefaultPreloadManager prioritizes loading the items based on how close it is to the item the user is currently playing.<\/p>\n If you want to control how much duration of the item to preload, you can tell that with DefaultPreloadManager.PreloadStatus you return.<\/p>\n For example,<\/p>\n This granular control can help you optimize your resource utilization which is recommended for a seamless playback.<\/p>\n <\/p>\n Tip: PreloadManager can keep both the previous and next items preloaded, whereas the PreloadConfiguration will only look ahead to the next items.<\/em><\/p>\n With your manager created, you can start telling it what to work on. As your user scrolls through a feed, you’ll identify the upcoming videos and add them to the manager. The interaction with the PreloadManager is a state-driven conversation between your UI and the preloading engine.<\/p>\n 1. Add Media Items<\/b><\/p>\n![](\"https:\/\/blogger.googleusercontent.com\/img\/b\/R29vZ2xl\/AVvXsEh1PmhSCIphw3wGW7dJ9Yr7LLgG_6rqNwklO04UO6iZAsh6HjosgOn_SovJ8sEJvNYdeU08nMgnHQ3_L8F3pNU0Z72viRxqg8Ir0ceP-XVx45lkfImCbLnKywl7lho5CWJt0hBqt5dehuzLLpkrmkHdpTXRCzokmV4m3lswrsxAHWRHCstygUnK5PKCrO4\/s1600\/AndroidSpotlight_Camera&Media_Blog_Media3%201.5.0_Banner.png\"\/)
<\/a><\/p>\n\n
\n
\n
\n
Preloading to the rescue! \ud83e\uddb8\u200d\u2640\ufe0f<\/span><\/h2>\n
1. Preloading playlist items with PreloadConfiguration<\/span><\/h3>\n
2. Preloading dynamic lists with PreloadManager<\/span><\/h3>\n
Setting Up Your PreloadManager<\/span><\/h4>\n
Configuring Duration and Ranking with TargetPreloadStatusControl<\/a><\/span><\/h4>\n
\n
\n
Managing Preloading Items<\/span><\/h4>\n