Skip to content

Commit

Permalink
add screenshot and performance metrics
Browse files Browse the repository at this point in the history
  • Loading branch information
cmhhelgeson committed Nov 26, 2024
1 parent fa1cbef commit b1c7c62
Show file tree
Hide file tree
Showing 2 changed files with 23 additions and 9 deletions.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
32 changes: 23 additions & 9 deletions examples/webgpu_compute_prefix_sum.html
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
<br /> Prefix sum performance comparisons.
<br /> Each display loops through initialization, sum, and validation steps.
<br/>
<div id="local_swap" style="
<div id="left_side" style="
position: absolute;
top: 150px;
left: 0;
Expand All @@ -25,7 +25,7 @@
pointer-events: none;
text-align: left;
"></div>
<div id="global_swap" style="
<div id="right_side" style="
position: absolute;
top: 150px;
right: 0;
Expand Down Expand Up @@ -66,23 +66,26 @@
rightGridDim: uniform( Math.sqrt( maxElements ) ),
validate: uniform( 0 ),
// Algorithm being displayed
'Left Method Name': 'Fake Prefix',
'Left Method Name': 'Fake',
'Right Method Name': 'Kogge-Stone',
};

const algorithms = [
'Sklansky',
'Kogge-Stone',
'Fake Prefix',
'Fake',
'Incorrect'
];

const gui = new GUI();

gui.add( effectController, 'Left Method Name', algorithms );

gui.add( effectController, 'Right Method Name', algorithms );

const timestamps = {
left_side: document.getElementById( 'left_side' ),
right_side: document.getElementById( 'right_side' )
};

// Initialize Two Views
init( false );
init( true );
Expand Down Expand Up @@ -134,7 +137,7 @@
// Emulates a prefix sum by manually assigning the instanceIndex to the storage buffer.
// This method should only be used to validate the correctness of new algorithms, and not as
// a yardstick for performance.
'Fake Prefix': {
'Fake': {
threads: [ maxElements ],
runMethod: ( currentElements ) => {

Expand Down Expand Up @@ -373,9 +376,12 @@
}

let stepType = 'Init';
renderer.info.autoReset = false;

const stepAnimation = async function () {

renderer.info.reset();

const methodName = rightSide ?
effectController[ 'Right Method Name' ] :
effectController[ 'Left Method Name' ];
Expand Down Expand Up @@ -404,7 +410,6 @@
case 'Validate': {

const currentElements = new Uint32Array( await renderer.getArrayBufferAsync( currentElementsBuffer ) );
//console.log( currentElements );

effectController.validate.value = 1;
stepType = 'Init';
Expand All @@ -415,6 +420,8 @@

case 'Init': {

effectController.validate.value = 0;

renderer.compute( method.initFunction );

stepType = 'Run';
Expand All @@ -429,7 +436,14 @@

renderer.render( scene, camera );

effectController.validate.value = 0;
console.log( renderer.info );

timestamps[ rightSide ? 'right_side' : 'left_side' ].innerHTML = `
Compute ${rightSide ? effectController[ 'Right Method Name' ] : effectController[ 'Left Method Name' ]} Prefix Sum: ${renderer.info.compute.frameCalls} pass in ${renderer.info.compute.timestamp.toFixed( 6 )}ms<br>
Draw ${renderer.info.render.drawCalls} pass in ${renderer.info.render.timestamp.toFixed( 6 )}ms
`;


setTimeout( stepAnimation, 1000 );

Expand Down

0 comments on commit b1c7c62

Please sign in to comment.