Do any of you have a Mac Mini that you don't need, vintage 2010 or newer?
You know that TV in DNA Pizza that displays flyers of our upcoming events? I tried to add a stock-ticker-like crawl to the bottom of it to give a shout-out to our (public) Patreon supporters, but it's only getting about 2 frames per second. That display is actually just a web page running Javascript that is running on a "Chrome TV" box, which is a cheap-assed computer running Android, the Google equivalent of Apple TV. We're using a Keedox Amlogic s802, 2GKz quad core, which even seems to have a reasonable GPU in it, but no web browser can keep up with this animation without stuttering.
So it's probably time to just stop wasting my time goofing around with these toy computers and just put a real computer behind it. That sounds like overkill, but I guess it's not overkill if it's the only thing that will actually work.
Also!
Now that construction of the wider sidewalk is finally done, nine months after they told us it would be, it's time to figure out how to re-install our parklet.
Because of the new constraints, instead of being L-shaped and sitting at the curb, it now needs to be a straight bar with seating on both sides going down the middle of the sidewalk. And it will be smaller by about 9'. We will have to cut off the short leg of the L, plus about 3' on one end, but it will allow seating and standing on both sides instead of just one, so something like this:
The sad news is, it's probably going to cost over $3,000 to re-install it. There's a lot of cutting and welding involved. That's a lot less than the $10k+ it took us to build it the last time, but this is not really the time to be spending a bunch of money.Maybe we should do a second Kickstarter for it?
Please come to Turbo Drive tonight. If you enjoyed the cyberpunk dystopia we called Cyberdelia, you will probably enjoy this as well.
- Some Guy: "I was going to buy a ticket, but it's raaaaaining."
Don't be that guy.
29 Responses:
Maybe this is overkill but have you considered something like this:
https://alphamaxmedia.com/w/index.php?title=NeTV2
You can plug it into a lot of things and overlay video. Bunnie is pretty clever...
Then again a mac mini also works....
If you have one, and you can verify that it loads and displays the URL above without stuttering, awesome. But it sounds to me like what you are actually suggesting is, "Here's yet another embedded system for you to spend another $80 on without any real expectation that it will work", and in that case, I'll pass...
Long story short: don't bother, they're quite slow and very limited. Hacking your existing Chromebox is going to be a better usage of your time.
I just gave you a Mac.
Okay, like 10 years ago, but is it all used up?
It's still in use playing music videos, I think!
Holy shit. They don't build em like that anymore.
Well, I suppose I could upgrade retina again...
I think I have a 2009 MacMini in the Goodwill pile. Or I could donate an SGI O2 to a worthy cause.
My experience with the 2009 Minis is that they can't display modern jQuery web pages in realtime. But give it a try on the URL above?
Do you have a license key for Netscape Enterprise Server for that O2? Because maybe I'll upgrade our web hosting with it...
I'll have to check in a few days on both accounts so someone is likely to beat me to the punch though I pretty sure I the O2 had a clean install when I got it. My current dream server for slowass.net is the Trascend WiFi SD card, btw.
I'm pretty sure we have a bunch of 2010+ Mac minis at work, but I won't be able to check until next week. If no one else comes to the rescue before then I'll see what I can do.
I can certainly find a use for several of those...
Sadly it seems like they have all been scavenged. Sorry about that :(
Is this better or worse on that machine:
http://standforsomething.net/dna/marquee.html?cascade,ticker
It's got some jank still, but runs somewhat faster on my not-underpowered machine than your page....
(I modified your marquee function to use the existing transit library and transforms instead of animating the left property, which should be more efficient. Further optimizations could certainly be done, but I wondered about this baseline before diving all the way in.)
I can testify my early 2009 mini runs the standforsomething url quite smoothly, which pleases me as this machine is still my daily driver. It is showing it’s age, and I’m stuck at 10.11. I’m not playing games with it, but for actual work, it’s fine. But yeah, it is on a compatibility cusp, so the future isn’t so bright.
Thanks very much! That makes it work reasonably well. It's still a little stuttery, but it's serviceable.
It took me a while to determine this, because through a series of events best characterized as "Android is really just stultifyingly awful", all of our flyer screens were down for a week. Yay.
Oof. Sorry to hear about hardware problems. That's even less fun than debugging code....
Maybe it's best to stop at serviceable, but I tried it again with pure CSS animations instead of transit: http://standforsomething.net/dna/marquee-v2.html?cascade,ticker
They both run very smoothly at 60fps on my machine in Chrome with no other tabs. V2 has the slightest amount of less GPU memory taken up (dipping below 20mb a little farther a little more often), but the difference is pretty negligible, and the memory seems to be more dependent on the images in the browser cache than anything else, I think. As a baseline, your current live page is using 30 - 60mb and struggling to get above 50fps in the same conditions, though, I truncated your RSS feed for simplicity, so a good deal of that could just be fewer images again....
In Firefox with entirely too many other tabs open, V2 does run smoother for me, so maaaaaybe that's sort of a little bit like an underpowered machine? Sorry I can't test more thoroughly.
They're very similar under the hood since it's still transforms, but V2 should be slightly easier to maintain, and will potentially benefit from browser renderer improvements at a greater rate since it's closer to bare metal, as it were?
(V2 has a commented inline style block in the html of the bulk of what's different between the two, and it links to upcoming-v2.js which has changes indented past the 80 character line, but they basically just amount to turning off the JS marquee function. Was quicker and simpler than extending your system of flags, but apologies nonetheless for doing it the lazy way.)
Your CSS animations approach also works, but doesn't seem to be any faster, and there's a snap-glitch at the end of the animation cycle, so I guess I'll just stick with the transit version.
There was some bad craziness with whatever the browser is on this Android TV box. If you look at my latest, I had to add a bunch of padding onto the end of the marquee div, or it was truncating the text. Maybe a font metrics problem? I saw it sometimes in Mac Opera, but not always. Also, on the Android box I couldn't use or it would replace some random selection of characters in the font with black rectangles. Also it just flat-out refuses to load https pages with self-signed certs, no dialog box or anything. That made debugging it on my staging server somewhat challenging.
Such a wonderful little machine. Truly a bundle of joy.
Running on the Android box, it periodically stutters -- this has been the case forever -- but I've never figured out exactly what causes it. It's not directly related to the number of images on screen, size of the images, or whether the pulsing glow on today's flyer is happening, or anything obvious. So I suppose it's related to memory usage in some complicated way. Also, anim-GIFs only get like 1 fps.
I think the truncating thing is a CSS problem. You're explicitly setting the width to 100% and overflow to hidden on .ticker. You would think this would make the width as wide as the content, but it's making it 100% of the browser window and then cutting off what doesn't fit because of the hidden overflow.... Hard to debug without seeing it, but stepping through the CSS there makes me think that's probably it? Although that would have been more dramatically noticeable on the much longer ticker2, so maybe that's not it at all.
Either way, though, I think the explicit width on .ticker and the overflow on .ticker and on the child span aren't doing anything for you. There are a few other rules I would change/restructure, but that's probably bike-shedding and certainly wouldn't be likely to improve framerate.... I can't quite figure out why toggling the absolute position of the child span kills the animation, though. If it's really just translating it, the position shouldn't matter, and I don't see any specifically conflicting or dependent rules.
One last thing to test, if you're not completely over it, is to make the transform a translate3d(x, 0, 0) instead of translate(x, 0). Even though the math is the same, it triggers the browser to use the GPU instead of CPU, which you likely have more overhead on. This has steep diminishing returns as too many GPU layers quickly turns into worse performance, and I'm not sure whether each flyer is already one or not due to transit's internals. But, it's a pretty trivial test, and since your browser is clearly a black box of mysterious fun, it could definitely help (or hurt) a good deal.
The triggering black rectangles is truly batshit.
Well, the translate3d trick doesn't seem to make a visible difference in speed, and it would take a bit more restructuring to make that work with scaling and rotation. (See convert_to_3d in the new code).
You might have been right about the width: 100% -- it also works with auto -- but the truncation thing seems to be even weirder than that: if I set a background color and border on the .ticker>span it's clearer what's going on: the thing is still sliding in, but sometimes it just doesn't get around to rendering the foreground bits for a while! E.g., the background color will render, but the text and border are missing for up to a couple of seconds and then they paint in all at once, as if it's just taking its time paging those bits in from whatever buffer they are stored in.
Which makes all kinds of sense, since this thing doesn't have spinning platters for storage... I guess it's blowing a tile cache and re-rendering?
I enjoy my "glitch" tag, but come on.
I have a 2005 era G4 mini that I'm not using, probably insufficient both on clock speed and OS/browser compatibility, but let me know if you want to give it a shot.
Thanks, but no. G4s can't do anything useful with modern web pages. I've tried.
That was my fear, I got nowhere trying to get to your test URL, but figured it didn't hurt to offer
I don't have such a machine to donate, I'm sorry.
Unsolicited, half-baked suggestion incoming: I looked at doing something like this in my last job. The raspberry pis are crap at doing the rendering themselves, but they are surprisingly good at processing video (once you've paid to unlock the MPEG decoding features of the GPU). My (never finished) intention at $job-1 was to do the webpage-rendering-to-video crunching on a (more powerful than Pi) server somewhere and stream video to the Pi(s) over Ethernet. Alas, I think the eventual solution used was to put a full-blown PC in every display screen on campus running 24/7 to render what was essentially a static slideshow. And mother earth weeps.
Email me with a shipping address and I'll get you a new one.
That would be lovely, thank you! DNA Lounge, 375 Eleventh St. San Francisco CA 94103.
Ok, it's on the way.
I just got the missing mini-HDMI adapter I needed to test the 2009 Mac Mini and the animation looks pretty good, though Safari isn't double buffering and I notice the slight sheer between frames which IMO looks line for an information screen. Heck, the world is full of bars where people sit around and watch NFL through the lens of mpeg4 corruption...
... but it looks like you're sorted. If not, holler, and I'll drop this thing in the post.
An Intel NUC may be to your liking? One with 2 2.8GHz cores, 8GB RAM, a 120GB SSD, and that is "4K Capable" isn't cheap ($629), but if form factor/size/space is a significant concern, and you can't get something fast enough donated, that may be a good option. Here's the Amazon link.