Set antialias on/off dynamically

Is it possible to toggle antialias on/off dynamically?

AA has major performance impact but some user might want to turn it on for better graphics or that we check FPS and can automatically turn it off if performance is bad.

As in game config:

render: {
    antialias: false
},

There is the property this.scene.sys.game.config.antialias which return true or false.

I do not know if it has any effect if you change it during game play.

It seams not because the type definition is set to readonly:

/**
* When set to `true`, WebGL uses linear interpolation to draw scaled or rotated textures, giving a smooth appearance. When set to `false`, WebGL uses nearest-neighbor interpolation, giving a crisper appearance. `false` also disables antialiasing of the game canvas itself, if the browser supports it, when the game canvas is scaled.
*/
readonly antialias: boolean;

:thinking:

I have tried these so far, but no luck. The config does change but it seems it is not applied.

    this.game.renderer.config.antialias = true;
    this.game.renderer.config.contextCreation.antialias = true;
    this.sys.game.config.antialias = true;

Looking at the WebGL Renderer, the antialias property is applied when the WebGL context is created. It’s also factored in when creating textures.

The context attributes of a WebGL context cannot be changed after its creation. Even if that was possible, you’d have to either recreate all of your textures or manually change their filters.

2 Likes

So I guess a good solution would be to enable antialiasing by default and track the fps.
If the fps are low, ask the player if he wants to restart the game with antialias turned off.
Maybe?

That should work, yeah. I’m not fully familiar with the WebGL Renderer, so I’m not sure if there’s any way to get around this, but I think it’s rather unlikely given how many things are bound to the context.

Yeah, if we can’t change the WebGL context then I suppose this can’t be done.