Mesh Writer

scene.background = new THREE.Color(0xf4f4f4);

const material = new THREE.MeshBasicMaterial({color:0xb67df0});
const geo = new THREE.BufferGeometry();

const width = 30;
const height = 30;
const period = 8;

const numVertices = width * height;
const uvs = new Float32Array(numVertices * 2);
const positions = new Float32Array(numVertices * 3);
const faces = new Uint16Array((width - 1) * (height - 1) * 6);
let faceIndex = 0;
for (let i = 0; i < width; i++) {
  for (let j = 0; j < height; j++) {
      const index = i * height + j;
      if (i < width - 1 && j < height-1) {
          faces[3 * faceIndex] = index;
          faces[3 * faceIndex + 1] = index + height;
          faces[3 * faceIndex + 2] = index + 1;
          faceIndex++;
          faces[3 * faceIndex] = index + 1;
          faces[3 * faceIndex + 1] = index + height;
          faces[3 * faceIndex + 2] = index + height + 1;
          faceIndex++;
        }
        uvs[2 * index] = i / (width - 1);
        uvs[2 * index + 1] = j / (height - 1);
        positions[3 * index] = i;
        positions[3 * index + 1] = j;
        positions[3 * index + 2] =
          Math.sin(Math.PI * 2 * i / period) +
          Math.sin(Math.PI * 2 * j / period);
    }
}
geo.setAttribute('position', new THREE.BufferAttribute(positions, 3));
geo.setAttribute('uv', new THREE.BufferAttribute(uvs, 2));
geo.setIndex(new THREE.BufferAttribute(faces, 1));

geo.computeVertexNormals();
geo.center();

// Wireframe
let wireframeGeo = new THREE.WireframeGeometry(geo);
let wireframeMaterial = new THREE.LineBasicMaterial({ color: 0x000000, linewidth: 1 });
let wireframe = new THREE.LineSegments(wireframeGeo, wireframeMaterial);

let mesh = new THREE.Mesh(geo, material);
scene.add(mesh);
scene.add(wireframe);