Live data from Hacker News

Bouncing DVD Logo

bouncingdvdlogo.com

141–150 of 293 posts

Re: Bouncing DVD Logo

#141

Earlier quoted context omitted.

>I was wondering why the animation was so stuttery and then I saw they are using setInterval for the animation... setInterval isn't the problem. He's animating the CSS position (top, left), which triggers a full reflow and causes the stuttering. Always animate with translate3d, which is GPU accelerated.

As someone who's new to front end and css is there a good resource on what properties are more costly, or which functions are newer and meant to be more performant like translate3d is mentioned as being gpu accelerated? I've seen mentions of reflow, repaint, and layout thrashing but not a comprehensive list of what functions are meant to replace what other ones, or relative cost of each function in common use cases.…

The key to animation on the web is to at all costs avoid using JavaScript to manipulate a DOM object on a tight timer. To achieve a smooth animation, you need between 24fps and 120fps depending on the device, so between 43 and 8 milliseconds to get everything done. Doing DOM stuff that fast is going to be a headache compared to using CSS animation or even using the Canvas API.

Re: Bouncing DVD Logo

#142
post #111
post #68

Earlier quoted context omitted.

That you feel the need to inform us of this "historical fact" makes me feel especially old... having lived through the CRT -> LCD transition period when buying an LCD made going to LAN parties a lot easier

I finally threw out my $1500 Sony Trinitron 27" high resolution CRT this year. It worked fine, felt like a huge waste of money. But it weighed over 100 pounds!

I once spent over $2k on a second-hand 21" CRT at an IT auction. Took two of us carrying it up/down stairs because I was worried about one of us slipping if solo. Needed a corner desk to fit the thing. I remember having 2-3 CRT screens pre-2000 and the desk required filled the room.

Re: Bouncing DVD Logo

#143
post #109

Earlier quoted context omitted.

It's just a less-than-ideal implementation, your CPU is most definitely not suffering. Here is a completely smooth version: https://codesandbox.io/s/nostalgic-cherry-wwpzj?file=/src/in... (I made the exact same thing last year as a joke for our team monitors)

This is definitely not smooth on iOS, on a brand new iPhone that’s arguably way faster than whatever system played the original DVD screensaver. On a technical note, not that there’s much you can do about this, but because you’re reading clientWidth and clientHeight each frame, you’re forcing reflow. A performant implementation would probably require avoiding the DOM altogether within the draw loop, so that would mea…

There are no elements in the page for style to be recalculated, so I doubt the reflow is what's slowing it down. I'm curious on what could cause bad performance for you though. It runs smoothly at 60fps on an iPhone 11 and the iPad, using Safari. Did you open the standalone page at https://wwpzj.csb.app/? My only guess would be that the CodeSandbox UI is too heavy for mobile.

For science, I went ahead and converted the code to ES3 and ran on the 10-year old first generation iPad (with setInterval) and it's still pretty smooth.

Re: Bouncing DVD Logo

#145

Earlier quoted context omitted.

Oh my, what is wrong with people?? Or maybe it's just me. I have a PTSD like reaction instead. I was a DVD programmer for 10 years, and every where I looked would be a screen with a DVD player connected doing this. I'm so glad to not be in the shiny round disc business any more.

What was the role of ‘DVD programmer’ like? Could you tell us more?

Depends on what year you started really. The original DVD burner cost $15k and the blank discs were $50 each but only held 3.95GB of data. The 2nd gen burner dropped to $5k and The first software was painful running under NT 4.0. With specialty discs with a large number of individual assets, it was easy to create so many files in a single folder that the system would slow to a crawl, and eventually crash during the muxing stage. You'd start it up again and watch it fly by the files it had already muxed, and then slow down when it got to the new files. It was a glorious day when Win2k comes out, and the same type of project no longer crashes like it did under NT. WinXP was like a gift from heaven. Then, you'd get some challenging programming requests like make a randomized game attempting to not repeat an item until all items have been displayed once. You get it programmed and begin testing in the plethora of consumer DVD players on the market. You then discover that some of the lower cost players don't acutally have the ability to select a random number. Instead, they have a preset list of random numbers starts over every time the player is restarted making it impossible to play the game as requested. You think browser compatibility is a pain, the DVD player/media combinations were insane.

Then there was MPEG-2 encoding. Early days required specialty hardware boards in your computer to do real-time encoding. These were in the $20k-$50k systems. High end encoders would allow for 2-pass encoding, but that meant playing the VTR for the first pass, rewinding the tape, and then doing the second pass in real-time. A 2 hour movie would take over 4 hours to encode. Then, if there was a problem with the encode (bitrate/buffer spikes/underflows), you'd have to figure out how to solve it and do the encode a second time. If you had the fancy encoder, you could do segment based encodes so you didn't need the full 4 hours. Mid-2000s, software encoding became viable. Now, you could run 2-pass encodes faster than real-time.

Then there were the oddities to deal with like timing was based on a 27MHz clock, so when the software told you there was a problem at time 59265000000, it actually meant 6mins 35secs.

No, I'm not scarred by the experience ;-)

Edit: I didn't actually answer the question. The role was to take the video/stills/subtitle assets and link them together. Every button on a menu screen had to be programmed to go to a specific spot on the disc. The video/audio/subtitles had to be combined to play together, then when finished told where to go, or stop, or loop, etc. Menu elements had to be placed in the correct section of the disc to that the menu/title buttons on the remote behaved correctly. DVDs had a very defined structure. VTS_01.vob VTS_02.vob makes me shudder when I seem them now.

Re: Bouncing DVD Logo

#146
post #60

As a historical note, the bouncing logo wasn't just for fun, but was important to prevent screen burn-in on CRTs. If you had a static image on a CRT for a long time, it could damage the phosphor. Sometimes you could even see the image when the screen was off! This was the original purpose of screensavers, which saved your screen from damage. Displaying a dynamic image prevented one part of the screen from being overu…

I had heard of this before, but didn't know that screensavers were designed to prevent that damage from happening. In this case, the bouncing DVD logo seems like an odd choice, as the way it's designed, there are certain pixels on the screen that it will never cross (corners, for example), which would fail to serve the desired purpose. Can someone explain?

Those pixels are off.

Re: Bouncing DVD Logo

#149
post #68

Earlier quoted context omitted.

That you feel the need to inform us of this "historical fact" makes me feel especially old... having lived through the CRT -> LCD transition period when buying an LCD made going to LAN parties a lot easier

I think my favorite contextual example of this is the opening line from Neuromancer: "The sky above the port was the colour of television, tuned to a dead channel." Means something very different now.

I guess that means perfect blue skies these days haha

Re: Bouncing DVD Logo

#150
post #94

Earlier quoted context omitted.

Blu-ray has been around for a good while now.

And broadband adoption. I think streaming actually killed it, not a higher resolution format.

Doesn't Blu-ray still have better quality than most streaming services?
Post reply on HN