Skip to content
This repository has been archived by the owner on Oct 20, 2020. It is now read-only.

Commit

Permalink
Uses rStats to display stats
Browse files Browse the repository at this point in the history
  • Loading branch information
Cedric Pinson committed Dec 14, 2015
1 parent e0433ff commit 8a287c9
Show file tree
Hide file tree
Showing 11 changed files with 907 additions and 454 deletions.
9 changes: 3 additions & 6 deletions benchmarks/osg/mainPerformance.js
View file
Expand Up @@ -234,19 +234,16 @@ module.exports = function () {
console.time( 'time' );

var nCount = 20;
var s = Timer.now();
for ( var n = 0; n < nCount; n++ ) {
viewer.frame();
}
var result = Timer.now() - s;

console.timeEnd( 'time' );
console.profileEnd();

var frameNum = viewer.getFrameStamp().getFrameNumber();

reportStats( viewer.getViewerStats().getAveragedAttribute( frameNum - nCount, frameNum, 'Update duration' ) * 1000.0, 'perf Only Update' );
reportStats( viewer.getViewerStats().getAveragedAttribute( frameNum - nCount, frameNum, 'Cull duration' ) * 1000.0, 'perf Only Cull' );
reportStats( viewer.getViewerStats().getAveragedAttribute( frameNum - nCount, frameNum, 'Draw duration' ) * 1000.0, 'perf Only Draw' );
reportStats( viewer.getViewerStats().getAveragedAttribute( frameNum - nCount, frameNum, 'Frame duration' ) * 1000.0, 'perf Frame' );
reportStats( result, 'perf Frame' );

} );
};
79 changes: 79 additions & 0 deletions examples/performance/index.html
View file
Expand Up @@ -5,7 +5,86 @@
<title>Performance</title>
<link rel="stylesheet" type="text/css" href="../templates/css/base.css">

<style type="text/css">
.rs-base{
position: absolute;
z-index: 10000;
padding: 10px;
background-color: #222;
font-size: 12px;
line-height: 1.2em;
width: 350px;
font-family: 'Roboto Condensed', tahoma, sans-serif;
left: 0;
top: 0;
overflow: hidden;
}

.rs-base h1{
margin: 0;
padding: 0;
font-size: 1.4em;
color: #fff;
margin-bottom: 5px;
cursor: pointer;
}

.rs-base div.rs-group{
margin-bottom: 10px;
}

.rs-base div.rs-group.hidden{
display: none;
}

.rs-base div.rs-fraction{
position: relative;
margin-bottom: 5px;
}

.rs-base div.rs-fraction p{
width: 145px;
text-align: right;
margin: 0;
padding: 0;
}

.rs-base div.rs-legend{
position: absolute;
line-height: 1em;
}

.rs-base div.rs-counter-base{
position: relative;
margin: 2px 0;
height: 1em;
}

.rs-base span.rs-counter-id{
position: absolute;
left: 0;
top: 0;
}

.rs-base div.rs-counter-value{
position: absolute;
left: 115px;
width: 30px;
height: 1em;
top: 0;
text-align: right;
}

.rs-base canvas.rs-canvas{
position: absolute;
right: 0;
}
</style>

<!-- Javascript -->
<script type="text/javascript" src="../vendors/rStats.js"></script>
<script type="text/javascript" src="../vendors/rStats.extras.js"></script>
<script type="text/javascript" src="../vendors/es6-shim.js"></script>
<script type="text/javascript" src="../vendors/es5-shim.js"></script>
<script type="text/javascript" src="../vendors/es6-shim.js"></script>
<script type="text/javascript" src="../vendors/bluebird.js"></script>
Expand Down
255 changes: 255 additions & 0 deletions examples/vendors/rStats.extras.js
View file
@@ -0,0 +1,255 @@
var glStats = function () {

var _rS = null;

var _totalDrawArraysCalls = 0,
_totalDrawElementsCalls = 0,
_totalUseProgramCalls = 0,
_totalFaces = 0,
_totalVertices = 0,
_totalPoints = 0,
_totalBindTexures = 0;

function _h ( f, c ) {
return function () {
c.apply( this, arguments );
f.apply( this, arguments );
};
}

WebGLRenderingContext.prototype.drawArrays = _h( WebGLRenderingContext.prototype.drawArrays, function () {
_totalDrawArraysCalls++;
if ( arguments[ 0 ] == this.POINTS ) _totalPoints += arguments[ 2 ];
else _totalVertices += arguments[ 2 ];
} );

WebGLRenderingContext.prototype.drawElements = _h( WebGLRenderingContext.prototype.drawElements, function () {
_totalDrawElementsCalls++;
_totalFaces += arguments[ 1 ] / 3;
_totalVertices += arguments[ 1 ];
} );

WebGLRenderingContext.prototype.useProgram = _h( WebGLRenderingContext.prototype.useProgram, function () {
_totalUseProgramCalls++;
} );

WebGLRenderingContext.prototype.bindTexture = _h( WebGLRenderingContext.prototype.bindTexture, function () {
_totalBindTexures++;
} );

var _values = {
allcalls: {
over: 3000,
caption: 'Calls (hook)'
},
drawelements: {
caption: 'drawElements (hook)'
},
drawarrays: {
caption: 'drawArrays (hook)'
}
};

var _groups = [ {
caption: 'WebGL',
values: [ 'allcalls', 'drawelements', 'drawarrays', 'useprogram', 'bindtexture', 'glfaces', 'glvertices', 'glpoints' ]
} ];

var _fractions = [ {
base: 'allcalls',
steps: [ 'drawelements', 'drawarrays' ]
} ];

function _update () {
_rS( 'allcalls' ).set( _totalDrawArraysCalls + _totalDrawElementsCalls );
_rS( 'drawElements' ).set( _totalDrawElementsCalls );
_rS( 'drawArrays' ).set( _totalDrawArraysCalls );
_rS( 'bindTexture' ).set( _totalBindTexures );
_rS( 'useProgram' ).set( _totalUseProgramCalls );
_rS( 'glfaces' ).set( _totalFaces );
_rS( 'glvertices' ).set( _totalVertices );
_rS( 'glpoints' ).set( _totalPoints );
}

function _start () {
_totalDrawArraysCalls = 0;
_totalDrawElementsCalls = 0;
_totalUseProgramCalls = 0;
_totalFaces = 0;
_totalVertices = 0;
_totalPoints = 0;
_totalBindTexures = 0;
}

function _end () {}

function _attach ( r ) {
_rS = r;
}

return {
update: _update,
start: _start,
end: _end,
attach: _attach,
values: _values,
groups: _groups,
fractions: _fractions
};

};

var threeStats = function ( renderer ) {

var _rS = null;

var _values = {
'renderer.info.memory.geometries': {
caption: 'Geometries'
},
'renderer.info.memory.textures': {
caption: 'Textures'
},
'renderer.info.memory.programs': {
caption: 'Programs'
},
'renderer.info.render.calls': {
caption: 'Calls'
},
'renderer.info.render.faces': {
caption: 'Faces',
over: 1000
},
'renderer.info.render.points': {
caption: 'Points'
},
'renderer.info.render.vertices': {
caption: 'Vertices'
}
};

var _groups = [ {
caption: 'Three.js - memory',
values: [ 'renderer.info.memory.geometries', 'renderer.info.memory.programs', 'renderer.info.memory.textures' ]
}, {
caption: 'Three.js - render',
values: [ 'renderer.info.render.calls', 'renderer.info.render.faces', 'renderer.info.render.points', 'renderer.info.render.vertices' ]
} ];

var _fractions = [];

function _update () {

_rS( 'renderer.info.memory.geometries' ).set( renderer.info.memory.geometries );
_rS( 'renderer.info.memory.programs' ).set( renderer.info.memory.programs );
_rS( 'renderer.info.memory.textures' ).set( renderer.info.memory.textures );
_rS( 'renderer.info.render.calls' ).set( renderer.info.render.calls );
_rS( 'renderer.info.render.faces' ).set( renderer.info.render.faces );
_rS( 'renderer.info.render.points' ).set( renderer.info.render.points );
_rS( 'renderer.info.render.vertices' ).set( renderer.info.render.vertices );

}

function _start () {}

function _end () {}

function _attach ( r ) {
_rS = r;
}

return {
update: _update,
start: _start,
end: _end,
attach: _attach,
values: _values,
groups: _groups,
fractions: _fractions
};

};

/*
* From https://github.com/paulirish/memory-stats.js
*/

var BrowserStats = function () {

var _rS = null;

var _usedJSHeapSize = 0,
_totalJSHeapSize = 0;

if ( window.performance && !performance.memory ) {
performance.memory = {
usedJSHeapSize: 0,
totalJSHeapSize: 0
};
}

if ( performance.memory.totalJSHeapSize === 0 ) {
console.warn( 'totalJSHeapSize === 0... performance.memory is only available in Chrome .' );
}

var _values = {
memory: {
caption: 'Used Memory',
average: true,
avgMs: 1000,
over: 22
},
total: {
caption: 'Total Memory'
}
};

var _groups = [ {
caption: 'Browser',
values: [ 'memory', 'total' ]
} ];

var _fractions = [ {
base: 'total',
steps: [ 'memory' ]
} ];

var log1024 = Math.log( 1024 );

function _size ( v ) {

var precision = 100; //Math.pow(10, 2);
var i = Math.floor( Math.log( v ) / log1024 );
return Math.round( v * precision / Math.pow( 1024, i ) ) / precision; // + ' ' + sizes[i];

}

function _update () {
_usedJSHeapSize = _size( performance.memory.usedJSHeapSize );
_totalJSHeapSize = _size( performance.memory.totalJSHeapSize );

_rS( 'memory' ).set( _usedJSHeapSize );
_rS( 'total' ).set( _totalJSHeapSize );
}

function _start () {
_usedJSHeapSize = 0;
}

function _end () {}

function _attach ( r ) {
_rS = r;
}

return {
update: _update,
start: _start,
end: _end,
attach: _attach,
values: _values,
groups: _groups,
fractions: _fractions
};

};

0 comments on commit 8a287c9

Please sign in to comment.