Pixi.js v4.5.2 crashing when using an Iphone7 (iOS 10.3.2)

I can’t figure it out, why both Safari and Chrome on my Iphone7 is causing the browser to crash.

I am unable to read any log information as it closes the browser when I’m inspecting. Here is a little piece of my code:

 init: function () {
     self.renderer = PIXI.autoDetectRenderer(1920, 1070, { 
      transparent: true,
      view: document.getElementById('stage'),
      resolution: window.devicePixelRatio || 1,
      autoResize:true
    }); 
    document.getElementById('drawingArea').appendChild(self.renderer.view);


    // create the root of the scene graph
    self.stage = new PIXI.Container();
    self.stage.interactive = true;

    PIXI.loader
      .reset()
      .add("ottoBonesData", "./app/public/static/image/chapter9/ottoProject_ske.json")
      .add("textureDataA", "./app/public/static/image/chapter9/ottoProject_tex.json")
      .add("textureA", "./app/public/static/image/chapter9/ottoProject_tex.png");
      PIXI.loader.once("complete", self._loadComplateHandler, self);
      PIXI.loader.load();

    self.animate();
}

_loadComplateHandler: function(loader, resources){
    var self = this;

    dragonBones.PixiFactory.factory.parseDragonBonesData(resources["ottoBonesData"].data);
    dragonBones.PixiFactory.factory.parseTextureAtlasData(resources["textureDataA"].data, resources["textureA"].texture);   

    self.armatureDisplay = dragonBones.PixiFactory.factory.buildArmatureDisplay("Armature");
    self.armatureDisplay.animation.play("aleteo_mute");
    self.armatureDisplay.scale.x = 0;
    self.armatureDisplay.scale.y = 0;
    self.armatureDisplay.interactive = true;
    //self.armatureDisplay.y = self.renderer.height * 0.5 + 100;
    self.stage.addChild(self.armatureDisplay);

    self.loadMultipleTimelines( self.options.data, self.options.readyCallback);
    self.renderOnCanvas();
 },

  animate : function () {
    var self = this;
    self.renderer.render(self.stage);
    self.frame = requestAnimFrame(self.animate);
  },

  renderOnCanvas() {
    var self = this;
    self.renderer.render(self.stage);
  },

There is no error when I initialize my web game, however, as soon as I play the GSAP timelines that I’m using to call my animations, I can see a couple of seconds of my animations being rendered incredibly slow and then it crashes.

Any ideas? could this be a PIXI problem?

Thanks a lot…

Ricardo

[ivanpopelyshev]

Ok then, we have to write it down somewhere: CSS 3d animations + webgl = pain on iphone.

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.