Mixed material color / wireframe

Questions
1

To improve the visualization of my geometries created by triangulation and deformation, I have used several variants so far.

  1. single color one-sided and wireframe and transparent.
    see TriangulationSphereWithHoles
const material1 = new THREE.MeshBasicMaterial( { side: THREE.DoubleSide, color: 0x000000, wireframe: true, transparent: true, opacity: 0.99 } );
const material2 = new THREE.MeshBasicMaterial( { side: THREE.FrontSide, color: 0x006600, transparent: true, opacity: 0.9 } );
  1. single color double-sided and wireframe and transparent.
    see InnerGeometryExample01

const material1 = new THREE.MeshBasicMaterial( { side: THREE.DoubleSide, color: 0x000000, wireframe: true, transparent: true, opacity: 0.99 } );
const material2 = new THREE.MeshBasicMaterial( { side: THREE.DoubleSide, color: 0x006600, transparent: true, opacity: 0.9 } );
  1. two-colored ( front/back side via shader) and wireframe and transparent thanks to @prisoner849 ( see How to have different colors/textures on bottom and top side of a Plane? - #5 by prisoner849 ) still works in r113

see InnerGeometryTHREEi_01

However, I have to create two meshes for each geometry and place them identically. That is certainly not effective.

Is there a way to create a material with the color and wireframe properties so that only one mesh is needed?
Ideally also transparent?