Frame rate too slow when creating movie from individually-downloaded JPEGs

Question

I have a directory that is continously filled with jpg images. I want to display these images like a movie in a webpage.

What I've tried is:

function slideit() { 
 $.get("test.php", function(show) { if(show != "") { 
 document.getElementById("movie").innerHTML="<img src=\"data:image/jpg;base64," + show + "\" />", 
 setTimeout('slideit()', 0) } } ); };

The PHP file is

function getrunpic()
    {
    $file=trim(shell_exec('ls directory | sort -n | grep jpg | head -1'));
    $file="directory/".$file;
    $imagedata = file_get_contents($file);
    $pic = base64_encode($imagedata);
    unlink($file);
    return $pic;
    }

echo getrunpic();

I also tried it with JSON encodeing.

The problem is that the data transfer from php to javascript takes too long. (shows only about 8 pics per sec; I need 25).

Does anybody have an idea to make the process faster?

Thanks in advance

`setTimeout(slideit, 0)` is equivalent but much more efficient than `setTimeout('slideit()', 0)` — pomeh, May 16 '12 at 10:08
http://socket.io/ - Try this one ,but i really doubt the results on what you're trying to do. — Rosmarine Popcorn, May 16 '12 at 10:47

score 2 · Answer 1 · edited May 23 '17 at 10:09

2

This is not the way to go. You should create the movie server-side and then stream it client-side. This is the only way to take advantage of the most basic functions of a codec, like compression, keyframes, etc, and to be able to guarantee at least some consistency to the viewer.

See this: Create Video File using PHP

edited May 23 '17 at 10:09

Community

1
1

answered May 16 '12 at 10:06

Palantir

23,820
10
76
86

The images are displayed on an Iphone. When i use a movieclip with a HTML player, the movie is shown in Full size and that is not what we want becouse the other site info is lost then. – BSDGuy May 16 '12 at 10:10
Anyway, wrt your code, at least do preload images and use the timer function to display them only. So you should try to load as many images as you can, feed a buffer, and use the timer function only to display them... – Palantir May 16 '12 at 10:11
1

I can't imagine this to be the only way to stream video to an iPhone. Maybe you should ask a different question on how to better achieve your goal? Have you looked into the html video tag, and such? – Palantir May 16 '12 at 10:14
Yes I did. But iphone only can display movies in full size. So the other site info is lost. – BSDGuy May 16 '12 at 10:16
How about this? http://stackoverflow.com/questions/3699552/html5-inline-video-on-iphone-vs-ipad-browser – Palantir May 16 '12 at 10:18
This works with ipad but not with iphone. sorry. Already tried this. – BSDGuy May 16 '12 at 10:22

Squig · Answer 2 · 2012-05-16T10:30:39.137

1

I don't think it will be the transfer "from php to javascript" - it's more likely to be the transfer from the server to the browser that's causing the issue. To make 25 individual HTTP requests per second, each one would need to be done in under 40ms (although you may get slightly longer with concurrent browser connections and overlapping requests).

Loading yahoo.com's home page and watching Firebug's "Net" panel, filtered to show just the HTTP requests for images, an average request shows the following times:

1ms blocking
1ms DNS lookup
125ms connecting
124ms waiting
116ms receiving

... which means that you're always going to struggle to get 25 frames / second using individual requests.

Have you considered using a streaming media (video) format? There are some tutorials over at mediacollege.com and more information on this wikipedia page.

edited May 16 '12 at 10:30

answered May 16 '12 at 10:08

Squig

862
6
15

The images are displayed on an Iphone. When i use a movieclip with a HTML player, the movie is shown in Full size and that is not what we want becouse the other site info is lost then – BSDGuy May 16 '12 at 10:12
I have called the script from the server itself and it was as slow as caling it from any browser. calling the php script alone with a loop returns the base64 image much faster.(35/sec) – BSDGuy May 16 '12 at 10:14

Frame rate too slow when creating movie from individually-downloaded JPEGs

2 Answers2