8 ms·

I did something very similar with progressive (adam7 interlaced) PNG: https://www.da.vidbuchanan.co.uk/adamation/image.png https://www.da.vidbuchanan.co.uk/adam

by Retr0id 3mo ago

I did something very similar with progressive (adam7 interlaced) PNG: https://www.da.vidbuchanan.co.uk/adamation/image.png https://www.da.vidbuchanan.co.uk/adamation/image.png > so playback is entirely dependent on network delay Ultimately true, but I set up my server to send each "frame" separately, with a fixed delay between each. Each frame is small so unless your network is unusually slow, the timing is set by my server.

jbochi 3mo ago
And I did something similar to steam live video via an infinite gif: https://github.com/jbochi/gifstreaming#live-video-streaming-using-animated-gifs https://github.com/jbochi/gifstreaming#live-video-streaming-...
Dwedit 3mo ago
Interesting that people are making hacks of PNG to do animations, yet there's also APNG sitting over there saying "Hey I exist!"
- donatj 3mo ago
  You don't even need a hack, there's built-in support for this. https://en.wikipedia.org/wiki/Motion_JPEG https://en.wikipedia.org/wiki/Motion_JPEG I've been here screaming "Motion JPEG EXISTS and is well supported in browsers" the entire time those gif hacks were popular. I've built a bunch of cool stuff with it. https://github.com/donatj/mjpeg-php/blob/master/mjpeg.php https://github.com/donatj/mjpeg-php/blob/master/mjpeg.php https://github.com/donatj/imgboard/blob/master/main.go https://github.com/donatj/imgboard/blob/master/main.go The PHP example here is an illustration of how easy it is to pull off, and the Go example is part of a JavaScript-free multiuser drawing board.
- Retr0id 3mo ago
  We even have proper video codecs like h264!
  - account42 3mo ago
    Which can't be used in <img> tags which is the only method users have to embed media in many contexts.
- qingcharles 3mo ago
  Sure, but most sites strip the animation out of APNGs while still allowing GIFs, which is frustrating.
moron4hire 3mo ago
I did this once, 20 years ago, with an animated GIF to add a live streaming air quality layer to a map application at work. The image itself was rendered using Java2D. I had a version I was working on that used JOGL to make gradient blobs instead of point clouds, but I couldn't get the server admin to install the OpenGL driver to get it to work.
omoikane 3mo ago
If you have control over the HTTP server, a different technique is to set "refresh" in the response header[1], which makes the client fetch new animation frames periodically. This is the technique used in a 2013 IOCCC entry to show a continuously updated clock that's rendered as PNG[2]. [1] https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Refresh https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/... [2] https://www.ioccc.org/2013/mills/index.html https://www.ioccc.org/2013/mills/index.html The "Refresh" header is encoded backwards on this line: https://github.com/ioccc-src/winner/blob/619f554bbdb19e5003aac5cbb87ea4d53dcee92f/2013/mills/mills.c#L30 https://github.com/ioccc-src/winner/blob/619f554bbdb19e5003a...

by Retr0id 3mo ago

jbochi 3mo ago

And I did something similar to steam live video via an infinite gif: https://github.com/jbochi/gifstreaming#live-video-streaming-using-animated-gifs https://github.com/jbochi/gifstreaming#live-video-streaming-...

Dwedit 3mo ago

Interesting that people are making hacks of PNG to do animations, yet there's also APNG sitting over there saying "Hey I exist!"

donatj 3mo ago
You don't even need a hack, there's built-in support for this. https://en.wikipedia.org/wiki/Motion_JPEG https://en.wikipedia.org/wiki/Motion_JPEG I've been here screaming "Motion JPEG EXISTS and is well supported in browsers" the entire time those gif hacks were popular. I've built a bunch of cool stuff with it. https://github.com/donatj/mjpeg-php/blob/master/mjpeg.php https://github.com/donatj/mjpeg-php/blob/master/mjpeg.php https://github.com/donatj/imgboard/blob/master/main.go https://github.com/donatj/imgboard/blob/master/main.go The PHP example here is an illustration of how easy it is to pull off, and the Go example is part of a JavaScript-free multiuser drawing board.
Retr0id 3mo ago
We even have proper video codecs like h264!
- account42 3mo ago
  Which can't be used in <img> tags which is the only method users have to embed media in many contexts.
qingcharles 3mo ago
Sure, but most sites strip the animation out of APNGs while still allowing GIFs, which is frustrating.

moron4hire 3mo ago

I did this once, 20 years ago, with an animated GIF to add a live streaming air quality layer to a map application at work. The image itself was rendered using Java2D. I had a version I was working on that used JOGL to make gradient blobs instead of point clouds, but I couldn't get the server admin to install the OpenGL driver to get it to work.

omoikane 3mo ago

If you have control over the HTTP server, a different technique is to set "refresh" in the response header[1], which makes the client fetch new animation frames periodically. This is the technique used in a 2013 IOCCC entry to show a continuously updated clock that's rendered as PNG[2]. [1] https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Refresh https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/... [2] https://www.ioccc.org/2013/mills/index.html https://www.ioccc.org/2013/mills/index.html The "Refresh" header is encoded backwards on this line: https://github.com/ioccc-src/winner/blob/619f554bbdb19e5003aac5cbb87ea4d53dcee92f/2013/mills/mills.c#L30 https://github.com/ioccc-src/winner/blob/619f554bbdb19e5003a...