MP4 vs HLS: When Adaptive Video Streaming Helps
AI-assisted writing with some human love from Madison, MS. Trust me, it’s a lot more readable that way. :-)
A small, optimized MP4 is often the right choice for a short background loop. A longer or heavier video can be a different story. If the file is too large for the visitor’s connection, the picture stops while the browser waits for more data.
Adaptive HLS streaming gives the player another option. HLS stands for HTTP Live Streaming. It breaks a video into small pieces and prepares those pieces at several quality levels. The player can move between those levels while the video is running.
Try my live MP4 versus HLS comparison. It plays the same 12-second clip both ways and shows start time, playback stops, stopped time, and picture quality.
What the test showed
I prepared one 1080p MP4 and two HLS versions of the same video:
- The 1080p MP4 is 8.87 MB.
- The 360p HLS version is 0.68 MB.
- The 720p HLS version is 2.06 MB.
I tested each format twice in Chrome at two controlled connection speeds. The browser cache was off, so an earlier download could not make the next test look faster. I also added 40 milliseconds of network delay.
At 1 Mbps, which is a slow connection, the MP4 took about 5.85 seconds to start. It then stopped 33 times and stayed stopped for about 53.9 seconds in total. The HLS stream started in about one second, selected 360p, and played without stopping.
At 10 Mbps, both formats played without stopping. The MP4 started in about 0.66 seconds. HLS started in 0.26 seconds and selected 720p.
This is one controlled test, not a promise about every video or visitor. The result shows why file size and connection speed matter. It also shows what HLS can do when several video qualities are available.
How visits turn into video costs
A page visit is not automatically a video play. Someone may leave before pressing Play. An autoplay video may begin on every visit. A page can also start several videos. Count actual video starts and watched time whenever possible.
For a simple planning example, assume every visitor watches the full 12-second test clip once:
- At 10,000 visits with one full play each, the MP4 delivers about 88.7 GB. HLS delivers about 6.8 GB at 360p or 20.6 GB at 720p.
- At 100,000 visits with one full play each, the MP4 delivers about 886.7 GB. HLS delivers about 68 GB at 360p or 206.2 GB at 720p.
- At 1 million visits with one full play each, the MP4 delivers about 8.87 TB. HLS delivers about 680 GB at 360p or 2.06 TB at 720p.
Real HLS use will usually fall between the quality examples because the player can switch levels during a view. People who stop early also use less data. Preloading and autoplay can use data even when the visitor does not intentionally watch.
Ways to serve the video
Keep the files on your current host or CDN
This may cost nothing extra while you stay inside the plan’s traffic limit. It is the simplest choice for a small MP4. Self-managed HLS can also be inexpensive, but someone must create the quality levels, upload all the pieces, configure the player, and keep the setup working.
Use a service priced by data
Bunny Stream lists delivery from $0.005 per GB, storage from $0.01 per GB, and a $1 monthly minimum. Encoding and its player are included. At that starting delivery rate, 100,000 full plays of this sample would cost about $0.34 at 360p or $1.03 at 720p before storage and regional price differences.
Use a service priced by watched time
Cloudflare Stream charges $1 per 1,000 delivered minutes. Storage is sold in $5 monthly blocks of 1,000 stored minutes. Encoding and bandwidth are included. At 12 seconds per play, 100,000 full plays equal 20,000 delivered minutes. That is about $20 for delivery plus one $5 storage block.
Use a marketing video platform
Wistia Business starts at $79 per month. The higher price includes business video hosting, a customizable player, analytics, and marketing tools. It makes more sense when viewer reports and lead tracking help pay for the plan.
These prices were checked September 11, 2026. Starting prices can vary by region and use. Treat the examples as planning numbers, not quotes.
How to choose what to serve
Use a small MP4 for a short loop or clip when the current hosting plan can handle the traffic. Use self-managed HLS when adaptive quality matters and your team can prepare the files and maintain the player. Use a managed streaming service when you want someone else to handle encoding, quality levels, delivery, and the player. Use a marketing platform when the business needs viewer analytics and lead tools.
Before choosing, collect four numbers: monthly video starts, average watched seconds, average data delivered per play, and the host’s traffic price or limit. Those numbers turn a vague traffic estimate into a useful monthly budget.
How HLS adapts while the video plays
A normal MP4 gives the browser one version of the video. If that version needs more data than the connection can deliver, playback may stop and wait.
HLS works more like choosing the right lane as traffic changes. The player downloads a small piece, checks the connection and its ready-to-play buffer, then chooses the quality for the next piece. It may begin at 360p, move to 720p when the connection improves, and move back down if the connection becomes weak.
The quality can change several times during one video. That is the “adaptive” part. The goal is to keep the video moving, even if the picture becomes less sharp for a while.
When a simple MP4 is better
HLS is not automatically better. It adds more files, more preparation, and a player that understands HLS.
A small MP4 is usually a good fit when:
- The video is a short background loop.
- The file is already small.
- Sound is not needed.
- The visitor does not need to watch for long.
- You want the simplest setup possible.
For these clips, the extra HLS playlists and pieces may add work without giving the visitor a useful improvement.
When HLS is worth considering
HLS becomes more useful as videos get longer, larger, or more important to the page. It can help when:
- Visitors may watch for more than a few seconds.
- People use a wide mix of mobile and home connections.
- The same video needs to work on small phones and large screens.
- Stopping to buffer would make the page frustrating or hard to use.
- You want the player to change quality without asking the visitor.
Apple created HLS, and browsers can play it either directly or through a library such as HLS.js. In WordPress, you also need a video player that accepts an HLS playlist ending in .m3u8.
What HLS does not solve
HLS can reduce buffering, but it cannot guarantee perfect playback. A connection can still be too slow or unstable. Poorly prepared video can still be too large. The player also needs enough time and data to decide when to change quality.
The player does not create the different video sizes by itself. Those versions must be made before playback, either by a video service or by your own encoding process. They also need to be stored somewhere and delivered to the visitor.
That means the real decision is not “MP4 or HLS for the whole website?” Check each kind of video. Keep tiny loops simple. Test heavier clips on a slow connection. Use the format that gives the visitor a clear improvement.
See the difference yourself
The live MP4 versus HLS demo uses the same source clip for both formats. Try MP4 first, stop it, then try HLS. Your result may be different because your browser can save video data and your connection will not match the controlled lab test.
The sample is a short excerpt from Big Buck Bunny, copyright 2008 Blender Foundation / bigbuckbunny.org, used under the Creative Commons Attribution 3.0 license.