Hello.
If u paste this code (just a source code with a little modifications) here https://pixijs.io/examples/#/plugin-dragonbones/robot.js
const app = new PIXI.Application({ antialias: true });
document.body.appendChild(app.view);
//That will help with fps, but all children become not interactive
//app.stage.interactiveChildren = false;
app.stop();
// load spine data
PIXI.Loader.shared
.add('skeleton', 'examples/assets/pixi-dragonbones/robot/mecha_1002_101d_show_ske.json')
.add('texture_json', 'examples/assets/pixi-dragonbones/robot/mecha_1002_101d_show_tex.json')
.add('texture_png', 'examples/assets/pixi-dragonbones/robot/mecha_1002_101d_show_tex.png')
.load(onAssetsLoaded);
function onAssetsLoaded(loader, res) {
const factory = dragonBones.PixiFactory.factory;
factory.parseDragonBonesData(res.skeleton.data);
factory.parseTextureAtlasData(res.texture_json.data, res.texture_png.texture);
let scale = 0.1;
for (let i = 0; i < 10; i++)
for (let j = 0; j < 10; j++) {
const armatureDisplay = factory.buildArmatureDisplay('mecha_1002_101d', 'mecha_1002_101d_show');
let lb = armatureDisplay.getLocalBounds();
//That makes better fps if uncomment
//armatureDisplay.hitArea = new PIXI.Rectangle(lb.x, lb.y, lb.width, lb.height);
armatureDisplay.pivot.set(lb.x, lb.y);
armatureDisplay.scale.set(scale, scale);
armatureDisplay.position.set(
lb.width*i*armatureDisplay.scale.x,
lb.height*j*armatureDisplay.scale.y);
armatureDisplay.interactive = true;
armatureDisplay.on('click',()=>{console.log(i*10+j)});
armatureDisplay.animation.play('idle');
app.stage.addChild(armatureDisplay);
}
app.start();
and then move a mouse over a canvas FPS drops from ~20-25 frames to 1 frame. How can i avoid that dropping? As i understand ParticleContainer not working with DB or Spine. I'v tried disable mousemove events
app.view.addEventListener('mousemove',(e)=> {e.stopPropagation()})
but that not helped.
if i set app.stage.interactiveChildren = false; that helps with FPS a little, but in that case armatureDisplay.interactive = true will discarded and can't register any on('click') events , like armatureDisplay.on('click',()=>{console.log(i*31+j)});
I can agree that 900 dragonbones objects reduce total FPS from 60 to 30, but don't understand why it falls down on mouse move events.
Probably the main problem is in hitArea, because setting it to the rounding box of the robot makes fps drops much smaller. If that true, how can i setup to check hitArea only on click, not on mouseMove?
Thanks