4 ms·
Nice ;) How come you use WebGL rather than e.g. SVG?
by Gehinnn 7y ago
Nice ;) How come you use WebGL rather than e.g. SVG?
- w56rjrtyu6ru 7y agoCorrect me if I'm wrong, but I think WebGL is the most performant graphics pipeline available in browsers today. I'm hooked on SVG's promise of semantic graphics, but every time I tried building something with SVG in a browser the performance just wasn't there, especially on low-end devices.
- rikschennink 7y agoYou're absolutely right, you either go for CSS 3D Transforms, or WebGL, WebGL being faster still.
- aloer 7y agoWhat’s your take on 2d canvas? I always see these 2d Toole using webgl and wonder how big of a difference it is. Filters of course work best in webgl. But the rest? Also, do you use offscreencanvas in chrome?
- rikschennink 7y agoEvery operation is just way faster in WebGL. I currently use WebGL for display preview and 2D canvas for generating the actual image. I suspect you'll run into performance issues if you plan to animate the image in a 2D canvas context (like I do when rotating / flipping / etc.) I've been planning to use offscreencanvas but haven't gotten around to it yet.
- onion2k 7y agoPerformance.
- rikschennink 7y agoInitially I rendered the image preview with CSS 3D transforms, while super fast on Safari, it turned out this wasn't as performant on Chrome when viewing on a retina display (weird right?). So I switched to WebGL, which sits closer (closest?) to the hardware and therefor yields better results. It's now super fast, it can animate filter transitions at 60FPS. SVGs currently don't support hardware acceleration, so that's why I went with CSS transforms for other parts of the UI. The only things rendered with SVG at the moment are the markup, the UI icons, and the rotation control.