My inner Steve Jobs is getting a bit annoyed that when I pan around, I can't achieve 60fps reliably. You'll especially notice the choppiness if you pan around a lot of cards. I understand that I could easily get to that frame speed had I chosen to build with canvas or WebGL, but the DOM is a much happier technology to work with.
The crux of the problem is that I have one event listener that fires on every mousemove event to pan the canvas... it's not the most expensive calculation, but it fires quite a bit, causing the browser to constantly spend some time scripting and re-rerendering.
What's strange is that when I plug in my external monitor, that choppiness disappears. According to my webdev friends, external monitors force your browser to use GPU acceleration for everything, regardless if the browser is viewed on the external monitor or laptop.
I found this surprising! It begs the question... why can't my app use GPU acceleration for everything?
Given that context, do you have any advice that could help me achieve 60fps? Is GPU acceleration worth exploring, or is that barking up the wrong tree?
