PLEASE HELP: PIXI.js animation optimization

Hey guys! I'm pretty new to this forum and to PIXI.js so please excuse me if I'm posting in the wrong place.

I am creating a game similar to guitar hero, but for piano (basically a synthesia clone). Here is a link to my JSFiddle

I have the basics setup how I want, but I am running into some performance issues. I need the game to run at a solid framerate with up to ~10,000 notes in a level (not all being displayed at the same time of course).  Currently, the note graphics are created and added to the stage within a group and animated downward. When they are added, their visible property is set to false and is only set to true when the are within the view.

Here is my animation loop: 

function animate() {
    gameTime = performance.now() / 1000 - startTime;
    // CULLING loop
    // loop to go through all notes and see if they should currently be visible
    for (i = 0; i < numNotes; i++) {
      // if the note should be visible, make it visible
      if (gameTime + offset > notes[i].startTime && gameTime < notes[i].stopTime + offset) {
        if (notes[i].graphic.visible == false) {
          notes[i].graphic.visible = true;
        }
      }
      // if the note should not be visible, set visible to false
      else if (notes[i].graphic.visible == true) {
        notes[i].graphic.visible = false;
      }
    }

    // set y pos based on gameTime
	  group.y = (ySlope * -1 * gameTime);

    // or set it manually
	  // group.y += 8;

    renderer.render(stage);
    requestAnimationFrame(animate);
}

The frame rate is currently not where I want it to be, so I am hoping that someone can show me where I can make some optimizations. Feel free to play around with the JSFiddle.

Thanks,

Micah