使用pixi和p5声音库制作的听觉反应视觉效果的性能问题

Question

请参阅此处的示例

我想这取决于你的机器，但对我来说，在第一首歌之后，帧率就疯狂地下降了。我确保没有超过必要的精灵（4:2图像和2位移贴图）。

这是一个像素的东西，也许是WebGL？我不知道如何改进，也不知道在哪里可以找到更好的表现。

Answer 1

好的。我发现了问题。你一次又一次地将displacementTexture添加到stage（stage.addChild（displacement纹理）中，但你从来没有真正删除过它。因此，您的totalSpritesOnStage无法正常工作。

添加这样的东西怎么样：

if (stage.children.length > 4) {
    // let's destroy the sprite now
    stage.removeChildren(4);

它看起来很快也能使用，尽管我没有非常彻底地检查功能。

这也困扰着我个人，因为声音被一次又一次地下载：）

function preload(song) {
console.log('preloading song: ' + currentSong);
console.log(song.filename);
if (allSounds[song]) {
    sound = allSounds[song];
    sound.setVolume(volume);
    sound.play();
    return;
}
allSounds[song] = sound = new p5.SoundFile('songs/' + song.filename,
    onMusicLoaded,
    h.onError
);
// The volume is reset (to 1) when a new song is loaded. so we force it 
sound.setVolume(volume);
}