4 ms·

Here's an example of a JS application that dynamically animates DOM properties using requestAnimationFrame: http://www.elevatesoft.com:8081/panels/panels.html

Here's an example of a JS application that dynamically animates DOM properties using requestAnimationFrame: http://www.elevatesoft.com:8081/panels/panels.html http://www.elevatesoft.com:8081/panels/panels.html It's a little slow on mobile, but pretty good on desktops, and could probably use some optimizations. The DOM transitions are animated at the of end of each change management cycle for a given UI element. That allows for layout management that occurs independently of what is going on in the DOM, treating the DOM updates as only a "controlled repaint".

exodust 11y ago
That's pretty cool. Performance on mobile is of course important, but perhaps it can be improved. I like CSS, but I also like having other options and ideas available. As others have said, for special one page web apps, the scripted layout might be a good choice. And then we have CSS grids coming soon too. Choice is good!
- TimJYoung 11y ago
  Mobile is a tough nut to crack, due to some hard constraints on the CPU/power consumption, but it's getting better. A new iPhone 5s does a pretty good job with something like that app I linked to, whereas an older Samsung Galaxy Tab 2 does not. A lot also depends upon the browser, since there is a big difference between the JS engines in Chrome (best, by far) and FF/IE when it comes to things like requestAnimationFrame() execution performance. The linked-to example is a dog when run on IE 11/Windows 8 on a practically-new Dell laptop/tablet convertible with an i3, but works nicely in Chrome on the same device. Re: CSS grids - totally agree. But, what I've learned over the last 4 years of developing a web application IDE is this: CSS is great if you want to set the layout and leave it alone (for the most part). In other words, when the JS is decorative, things are great. When the JS becomes the primary actor, things start to break down due to lack of control over how/when the reflows/repaints occur.

exodust 11y ago

That's pretty cool. Performance on mobile is of course important, but perhaps it can be improved. I like CSS, but I also like having other options and ideas available. As others have said, for special one page web apps, the scripted layout might be a good choice. And then we have CSS grids coming soon too. Choice is good!

TimJYoung 11y ago
Mobile is a tough nut to crack, due to some hard constraints on the CPU/power consumption, but it's getting better. A new iPhone 5s does a pretty good job with something like that app I linked to, whereas an older Samsung Galaxy Tab 2 does not. A lot also depends upon the browser, since there is a big difference between the JS engines in Chrome (best, by far) and FF/IE when it comes to things like requestAnimationFrame() execution performance. The linked-to example is a dog when run on IE 11/Windows 8 on a practically-new Dell laptop/tablet convertible with an i3, but works nicely in Chrome on the same device. Re: CSS grids - totally agree. But, what I've learned over the last 4 years of developing a web application IDE is this: CSS is great if you want to set the layout and leave it alone (for the most part). In other words, when the JS is decorative, things are great. When the JS becomes the primary actor, things start to break down due to lack of control over how/when the reflows/repaints occur.