I have 2 sample videos (v1 50MB and v2 150MB). They are the same video where v1 is downscaled from v2.
v1 resides in our firebase bucket while v2 is a sample video available online. However, if I try to stream v1 in react-native or even in the web browser, the streaming is orders of magnitude(takes a min to start playing) rather than v2 (starts in a few seconds).
What could be the problem? It appears the simple urls are streaming and buffering perfectly in react-native-video while firebase urls 'seem' to be downloaded first and then played.
The problem is the placement of the moov
box (a container for all metadata) in the MP4 files. In the case of v1
it's placed at the end and the entire file needs to be downloaded before the playback can start. In the case of v2
it's placed in the beginning so playback can start immediately. You need to optimize v1
, look-up MP4 fast-start.