UnityMirror/spine-runtimes
1
0
Fork 0
mirror of https://github.com/EsotericSoftware/spine-runtimes.git synced 2026-03-26 22:49:01 +08:00
Code Issues Packages Projects Releases Wiki Activity

[ts] Visibility check is only done on scroll events, saves some CPU

Browse Source
This commit is contained in:
badlogic 2016-09-03 14:25:49 +02:00
parent b112ef10d3
commit 35d8598fe3
1 changed files with 13 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
spine-ts/webgl/demos/utils.js
View File

@ -15,9 +15,10 @@ var spineDemos;
spineDemos.requestAnimationFrame(loop); spineDemos.requestAnimationFrame(loop);
var demos = spineDemos.demos; var demos = spineDemos.demos;
for (var i = 0; i < demos.length; i++) { for (var i = 0; i < demos.length; i++) {
var canvas = demos[i].canvas; var demo = demos[i];
var renderFunc = demos[i].renderFunc; var canvas = demo.canvas;
if (spineDemos.isElementInViewport(canvas)) { var renderFunc = demo.renderFunc;
if (demo.visible) {
if (spineDemos.log) console.log("Rendering " + canvas.id); if (spineDemos.log) console.log("Rendering " + canvas.id);
renderFunc(); renderFunc();
}; };
@ -32,20 +33,25 @@ var spineDemos;
} }
spineDemos.setupRendering = function (canvas, renderFunc) { spineDemos.setupRendering = function (canvas, renderFunc) {
var demo = {canvas: canvas, renderFunc: renderFunc, visible: false};
$(window).on('DOMContentLoaded load resize scroll', function() {
spineDemos.checkElementVisible(demo);
});
spineDemos.checkElementVisible(demo);
setupLoop(); setupLoop();
spineDemos.demos.push({canvas: canvas, renderFunc: renderFunc}); spineDemos.demos.push(demo);
}; };
spineDemos.requestAnimationFrame = function(func) { spineDemos.requestAnimationFrame = function(func) {
requestAnimationFrame(func); requestAnimationFrame(func);
} }
spineDemos.isElementInViewport = function (canvas) { spineDemos.checkElementVisible = function (demo) {
var rect = canvas.getBoundingClientRect(); var rect = demo.canvas.getBoundingClientRect();
var x = 0, y = 0; var x = 0, y = 0;
var width = (window.innerHeight || document.documentElement.clientHeight); var width = (window.innerHeight || document.documentElement.clientHeight);
var height = (window.innerWidth || document.documentElement.clientWidth); var height = (window.innerWidth || document.documentElement.clientWidth);
return rect.left < x + width && rect.right > x && rect.top < y + height && rect.bottom > y; demo.visible = rect.left < x + width && rect.right > x && rect.top < y + height && rect.bottom > y;
}; };
spineDemos.setupWebGLContext = function (canvas) { spineDemos.setupWebGLContext = function (canvas) {