HTML5 Canvas 3D WebGL (TM) js Library


Normally performance of canvas 3D (WebGL™) using fast current graphics hardware is outstanding. There are, however, older and/or slower devices and/or host computers that have problems with high screen/canvas resolutions. Some computers might not have a GPU at all (in which case taccgl™ probably will run in 2D mode) or a slow GPU built into the CPU. Mobile devices often have a GPU, which however often is slow. Some mobile devices have high pixel ratios that require significant rendering performance.

taccgl™ then reduces the size of the drawing canvas, effectively playing animations only in part of the window, it disables shadows and switches from per-fragment to per-vertex lighting. Finally it also reduces 3D canvas resolution.

taccgl™ performs almost all javaScript calculations before the animation starts and leaves calculations for individual frames almost completely to the graphics card. Still there is a single javaScript function (taccgl_draw3d) that is called once per frame and basically just calls the canvas 3D drawArrays function to do the drawing.

If there are any other javaScripts running during an animation, taccgl_draw will only be called when the other javaScript is done (since there is no real multi-threading in javaScript). If your target is a framerate of e.g. 60 fps taccgl_draw needs to be called every 16ms. So you need to make sure, that all your javaScripts in the page running during the animation take significantly less than 16ms or else you will expericence dropped frames.

WebGL™ is a trademark of the Khronos Group Inc.

Next Page:Version History
Previous Page: Background Mode
Please Add a Comment or Question, click here!