CODEWITHSUNDEEP
javascriptvideostreaming
NOP
NOP

Reputation: 854

JavaScript - Stream of JPEGs for poor man's video

I'm looking to try and work out how to stream a series of JPEGs as a video using JavaScript. I would like some input as to whether what I'm thinking is feasible or not.

Using a circular buffer, precache the first n images. As each image is displayed, once the next one appears replace the previous element with a new one from the list, such that it loops back over itself creating the illusion of an infinite buffer. Timing (frame rate) could be controlled using the time library and we simply update the src attribute of an image element at the correct interval so it gives the illusion of video.

Is this achievable with Javascript? I assume a limitation would be how long the script takes to run - which would be dependent upon the number of images that need to be shown. Obviously not expecting blistering performance either, just enough to show some motion is fine. This is obviously a very ugly hack.

Upvotes: 0

Views: 1042

Answers (1)

Jiří Herník
Jiří Herník

Reputation: 2477

Yes, it is achievable if that answers your question ;)

You can precache the images with 

var image = new Image();
image.src = "url";

This way the image should be saved also in browser's cache.

And then using settimeout(function, timems) you just change the src of the current image in page.

Upvotes: 1

Related Questions