WebGLRenderer: Add support for multiple shader programs with a single material.

[gero3]

It would be necessary to have multiple multiple webglprogram on a single material to solve #11400.

This would require several steps to be taken to get this done:

• Figuring out what parameters are necessary to generate a webglprogram and use a single parameter source to create it. (WebGLRenderer: Use single parameter object for program acquisition. #18279)
• Build single parameter source from 4 parameter sources: material, object, renderer, scene.
  • Material parameter: gets regenerated when needsUpdate is true
  • Renderer parameter: gets regenerated every render
  • Scene parameter: gets regenerated every render
  • object parameter: gets regenerated every ??
• Create keys based of the 4 parameter sources to figure out if something changed.
• Use single parameter source as key to figure out if program needs to be created.
• Use single parameter source as key to figure out which program to use.

We would also need to track which program gets used by which material to make sure that the programs get deleted when the material gets disposed of.

[Mugen87]

I've experimented in this context for a while and came up with the following minimal solution: Mugen87@e0099e5

It actually solves the ping-pong effect in certain scenarios e.g. when rendering to a render target with different output encodings (#19056). However, the general performance gets worse since the renderer has to compute a program key per frame for each object right now. This becomes to a problem when rendering scenes with a lot of objects:

https://raw.githack.com/Mugen87/three.js/dev51/examples/index.html#webgl_lights_pointlights2
https://threejs.org/examples/#webgl_lights_pointlights2

I'm trying to figure out a solution to avoid unnecessary calls of getProgram().