What is the difference between '@mux/mux-video' and 'next-video'

[dreamyguy]

Hey!

We currently use @mux/mux-video to render videos in our NextJS app, but I just discovered this package (next-video).

I got curious about next-video. What does it do that @mux/mux-video doesn't?

Should we consider migrating from @mux/mux-video to next-video?

[luwes]

That's a good question!

The main thing next-video adds is a workflow to easily upload your local (or remote) videos to one of the available video providers. Mux is the default provider.

This project aims to be the video variant of the next/image component if that makes sense.

If your videos are already uploaded via another way maybe via a CMS, and are already processed and optimized then this pkg is probably not that useful.

What's your workflow currently?

You can also use the @mux/mux-video player with next-video by using a custom player.

Another useful thing next-video does by default is use a slotted poster image with a blur-up thumbnail placeholder. The blur-up thumb indicates to users something is loading immediately on page load, and the slotted poster image makes it that the image source starts loading right away before even the JS of the player has loaded. And it uses the right image resolution for the player size.

We have some articles on this ;)
https://www.mux.com/blog/blurry-image-placeholders-on-the-web
https://www.mux.com/blog/mux-player-lazy-loading-with-blurhash

Let me know if you have any other questions.

[dreamyguy]

Hey @luwes,

Thanks for a thorough reply! We're currently using @mux/mux-video as we needed to take many design choices, that package exposes the full spectrum of MUX's API, which is great.

The background for my question was plain curiosity, and perhaps an itch to hear how maintainers themselves define that difference.

We've completely replaced Vimeo with it, and are using it with Sanity. The initial hiccups we had were soon overcome.

Cheers! 🍹