Rendering a DOM across multiple displays
- by meetamit
I'm building a data-driven animation with HTML and javascript to run in a web browser. I would like to display it tiled across three 1080p monitors. This essentially yields a viewport that's 5760px wide and 1080px tall. Pretty large.
Does anyone have experience setting up something like this?
I have many questions below, but any tip would be appreciated:
Is it reasonable to expect a DOM to render into such a large viewport size at close to 60fps?
I might choose to use canvas, instead of SVG or HTML, but that would yield a giant canvas. Can a canvas with such high resolution be performant? Of course everything depends on the complexity of the graphics I want to render, but I'm looking to remove that factor from this question, so assume I'm asking about a canvas animation that can run at 60fps at 1920x1080 resolution. Would it run roughly as fast at 3 times the width?
Would three.js and WebGL be a more proper approach at that resolution?
How do you actually cause Chrome or FF to span 3 monitors at full screen? Do I need a 3rd party solution of any kind?
Thanks!