Sign in to follow this  
irrationnelle

Use pixi v5 and also pixi-legacy for fallback concurrently

Recommended Posts

Hello,

I use pixi v5 for Angular v6 on my project.

Recently, my customers who have devices without WebGL rendering asked me they would like to use my project.

So I decided that my project use pixi v5 and pixi-legacy together.

First, I think I can use ApplicationLegacy of pixi-legacy instead of Application of pixi v5 like below

import { Application as ApplicationLegacy } from 'pixi.js-legacy';
import { Application, Sprite, Container, Texture, BLEND_MODES, Renderer, TilingSprite, utils } from 'pixi.js';

 

constructor(
) {
  try {
    this.pixi = new Application({
      view: this.canvas,
      width: CANVAS_WIDTH,
      height: split ? SPLIT_CANVAS_HEIGHT : CANVAS_HEIGHT,
      backgroundColor: BACKGROUND_COLOR,
      antialias: true,
      preserveDrawingBuffer: true
    });
    initPixiSetting();
  } catch (error) {
    this.pixi = new ApplicationLegacy({
      view: this.canvas,
      width: CANVAS_WIDTH,
      height: split ? SPLIT_CANVAS_HEIGHT : CANVAS_HEIGHT,
      backgroundColor: BACKGROUND_COLOR,
      antialias: true,
      preserveDrawingBuffer: true
    });
    initPixiSetting();
  }
}

But, My project did not enter in catch statement when WebGL is not supported

And then, I knew that I imported just 'pixi-legacy' and my project is worked as canvas mode, not WebGL like this

import 'pixi.js-legacy';
import { Application, Sprite, Container, Texture, BLEND_MODES, Renderer, TilingSprite, utils } from 'pixi.js';

 

So I have a question

in this case, does my project use pixi v5 with devices which support WebGL but use pixi-legacy with device without WebGL?

Or, my project always uses pixi-legacy whenever my users deal with any devices which support WebGL or do not support WebGL?

Thank you in advance for your response

Share this post


Link to post
Share on other sites

Its a general problem of imports.

Suppose you have a module A, and you also have a B that modified it. Does it modify A or its a completely new instance that you can use both of them?

In our case, pixi.js-legacy is just a collection of hacks on top of pixi.js. If you imported it, you actually use the same PIXI instance as in `pixi.js` , but with some mods: autoDetectRenderer is one of them.

Its not different PixiJS instance, its the same, if you import `pixi.js-legacy` it changes things permanently.

That's the source of bundle: https://github.com/pixijs/pixi.js/blob/dev/bundles/pixi.js-legacy/src/index.js

it swaps this one: https://github.com/pixijs/pixi.js/blob/873b65041bd3a5d173b0e0e10fa93be68bc033d9/packages/core/src/autoDetectRenderer.js

to this: https://github.com/pixijs/pixi.js/blob/873b65041bd3a5d173b0e0e10fa93be68bc033d9/packages/canvas/canvas-renderer/src/Renderer.js#L12

SUMMARY:

This is the correct one:

Or, my project always uses pixi-legacy whenever my users deal with any devices which support WebGL or do not support WebGL?
 

Edited by ivan.popelyshev

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.