• Content Count

  • Joined

  • Last visited

  1. This is true. It isn't a constant poor frame rate, it is just a stutter every few seconds. I have noticed that it runs better on Windows than it does on Mac OS and Linux. Also, There is a small amount of stuttering occasionally even when only ~100 note objects are created, especially on Linux. This may be due to most linux drivers having poor WebGL support though.
  2. @Milton Thank you for this recommendation. I have adjusted my code so that the sprites are only added to the stage when they should be visible, and are removed from the stage otherwise. Here is a link to the JSFiddle. It now runs much smoother than it did before, but stuttering still occurs occasionally. You are right in that it would run faster if the loop did not check every note in the array each frame, but am having a bit of trouble implementing this. What do you mean by index on startTime? The array of notes is already sorted by startTime (least to greatest) if that makes it easer. Feel free to play around with the JSFiddle and post your changes.
  3. @ivan.popelyshev Thank you for your quick and helpful response. I adjusted my code so that only one texture is created and used for all the sprites. Here is a link to the JSFiddle. It seems a bit faster, but unfortunately stuttering is still occurring. Because of this, I have not yet implemented your three texture approach so all note lengths are the same. I would like to get it running smoothly with fixed note lengths before adding the functionality for variably lengths. Any idea why it is still stuttering? Thanks again for your help, Micah
  4. @Milton @ivan.popelyshev I think that is a great recommendation but notes must be able to have varying lengths like so: JSFiddle. Because of this, it makes a sprite for every note. Would sprite batching help in this situation? Or is there some way that I can adjust the length of a sprite without messing up dimensions? Thanks, Micah
  5. @Fatalist I followed your recommendation of using sprites instead of Graphics but it still stutters. Here is a link to the updated JSFiddle. Please let me know if I can make any further optimizations. Thanks, Micah
  6. 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