WebGL boot onboarding trigger update process Analysis

WebGL boot onboarding trigger update process Analysis

The beautiful Life of the Sun Vulcan (http://blog.csdn.net/opengl_es)

This article follows "Attribution-non-commercial use-consistent" authoring public agreement

Reprint Please keep this sentence: Sun Vulcan's Beautiful Life-this blog focuses on Agile development and mobile and IoT device research: IOS, Android, HTML5, Arduino, Pcduino , or else. Articles from this blog refuse to be reproduced or reproduced. Thank you for your cooperation.

Requestanimframe (tick);

This command is the new command in HTML5 to replace the timer trigger update for animated updates, with a special feature in its background implementation. is to merge and re-render the animations on the page. Provides very high operational efficiency, and when the current page label leaves the present screen without display. Its own initiative to suspend.

It's best to try it and open a HTML5 three-dimensional demo sample that shows that the CPU fan will go crazy in a few minutes, but switch the page label to another page in a few minutes. CPU fan has slowed down significantly. The fever is not that big.

It's just not clear whether the CPU or GPU is heating up, assuming you can find a desktop to test. Open the lid of the chassis, touch the heat sink of both the temperature changes should be very clear, or temperature monitoring software can be found.

Moonangle and Cubeangle are two variations of the angle of view used in the transformation of the views model, where the animation is updated to make it go through the time, and a certain angle of rotation occurs to achieve the display purpose of dynamic update rotation.

When only Drawscene () is retained; This sentence. Does not present the content. and animate (); Only used to update the rotation angle. Can not be considered, then requestanimframe (tick); This sentence may be a necessary condition for ensuring its display;

However. Requestanimframe (tick); In my understanding. It is only used to trigger the run tick (); Method itself. How could it have such a deadly effect?

Perhaps the delay in the resource is loaded. You may need to refresh regularly to get the latest results for each status update.

Does this mean that the resource consumption is too large for a static display? Or, can we solve this problem in the same way that the trigger is loaded?

Then JS may be able to have this function!

Perhaps JQuery's encapsulation of JS events can be a great solution to these problems. To be further studied, after the text to continue to supplement.

var lasttime = 0;function animate () {    var timenow = new Date (). GetTime ();    if (lasttime! = 0) {        var elapsed = Timenow-lasttime;        Moonangle + = 0.05 * elapsed;        Cubeangle + = 0.01 * elapsed;    }    Lasttime = TimeNow;} function tick () {    requestanimframe (tick);    Drawscene ();    Animate ();} function Webglstart () {    var canvas = document.getElementById ("Lesson13-canvas");    INITGL (canvas);    Clear screen and enable deep test    gl.clearcolor (0.0, 0.0, 0.0, 1.0);    Gl.enable (GL. Depth_test);        Initshaders ();    Initbuffers ();    Inittextures ();    Tick ();}

WebGL boot onboarding trigger update process Analysis