Antialiasing in WebGLRenderer

You've identified the core issue correctly. The antialias parameter is only used during the initial creation of the WebGL context when you instantiate the WebGLRenderer. Once the WebGL context is created, this setting cannot be changed dynamically.

The antialiasing setting is passed to the underlying WebGL context creation method (canvas.getContext('webgl', {antialias: true})) and becomes a permanent characteristic of that context. Simply setting renderer.antialias = false later won't have any effect because:

1. The WebGL context has already been established with antialiasing enabled
2. The WebGLRenderer doesn't expose a property to toggle this setting after initialization

Possible Solutions

If you need to toggle antialiasing based on performance:

1. Create a new renderer instance:

   JAVASCRIPTCopied
   // Dispose of the old renderer
   renderer.dispose();
   // Create a new one with different settings
   renderer = new THREE.WebGLRenderer({ 
     antialias: false,
     canvas: existingCanvas  // Reuse the same canvas if needed
   });

2. Use post-processing antialiasing:
   Instead of relying on the WebGL context's built-in antialiasing, you could implement a post-processing antialiasing technique like FXAA or SMAA using Three.js's post-processing capabilities, which can be toggled on and off.

3. Create two renderers upfront:

   JAVASCRIPTCopied
   const rendererAA = new THREE.WebGLRenderer({ antialias: true });
   const rendererNoAA = new THREE.WebGLRenderer({ antialias: false });
   
   // Then switch between them based on performance
   let currentRenderer = rendererAA;
   
   // When performance is low
   currentRenderer = rendererNoAA;

The most straightforward approach is to create a new renderer instance with the desired settings when you need to change the antialiasing behavior.