iErcann

Three.js Performance Guide

Performance Monitoring

To monitor CPU usage while running your Three.js application, you can utilize Chrome DevTools :

Monitoring Draw Calls

You can easily check the number of draw calls made by the renderer using the following code:

iErcann

 
$(function () {
 
  var noteToNum = {};
  var numToNote = {};

   let transpose = -1;
    function getNoteKeyCode(note){
        for (let keyCode in key_binding) {
             const keyNote =key_binding[keyCode].note.note+key_binding[keyCode].note.octave;

iErcann

function getRandomColor() {
    var letters = '0123456789ABCDEF';
    var color = '#';
    for (var i = 0; i < 6; i++) {
        color += letters[Math.floor(Math.random() * 16)];
    }
    return color;
}

function drawPixel(x, y, color) {