massive render performance gain by merging path geometries

This commit is contained in:
Stewart Allen 2020-11-07 22:28:31 -05:00
commit 709336c36e
4 changed files with 47 additions and 30 deletions

View file

@ -50,7 +50,8 @@
* @returns {Array}
*/
AP.appendAll = function(arr) {
if (arr && arr.length > 0) this.push.apply(this,arr);
// if (arr && arr.length > 0) this.push.apply(this,arr);
if (arr && arr.length > 0) this.push(...arr);
return this;
};

View file

@ -12,7 +12,8 @@
specular = 0x444444,
emissive = 0x101010,
metalness = 0,
roughness = 0.3;
roughness = 0.3,
newMesh = createPhongMesh;
KIRI.Layer = Layer;
KIRI.newLayer = function() { return new Layer() };
@ -89,18 +90,7 @@
ctrl.group.push(mat);
}
if (faces.length) {
// const mat = new THREE.MeshPhongMaterial({
const mat = new THREE.MeshStandardMaterial({
transparent: data.color.opacity != 1,
emissive,
roughness,
metalness,
// shininess,
// specular,
opacity: data.color.opacity,
color: data.color.face,
side: THREE.DoubleSide
});
const mat = newMesh(data);
const geo = new THREE.BufferGeometry();
geo.setAttribute('position', new THREE.BufferAttribute(faces, 3));
geo.computeFaceNormals();
@ -112,18 +102,7 @@
ctrl.group.push(mat);
}
if (paths.length) {
// const mat = new THREE.MeshPhongMaterial({
const mat = new THREE.MeshStandardMaterial({
transparent: data.color.opacity != 1,
emissive,
roughness,
metalness,
// shininess,
// specular,
opacity: data.color.opacity,
color: data.color.face,
side: THREE.DoubleSide
});
const mat = newMesh(data);
paths.forEach((path, i) => {
const { index, faces, z } = path;
const geo = new THREE.BufferGeometry();
@ -143,4 +122,27 @@
slice.view.add(group);
};
function createStandardMesh(data) {
return new THREE.MeshStandardMaterial({
emissive,
roughness,
metalness,
transparent: data.color.opacity != 1,
opacity: data.color.opacity,
color: data.color.face,
side: THREE.DoubleSide
});
}
function createPhongMesh(data) {
return new THREE.MeshPhongMaterial({
shininess,
specular,
transparent: data.color.opacity != 1,
opacity: data.color.opacity,
color: data.color.face,
side: THREE.DoubleSide
});
}
})();

View file

@ -157,7 +157,21 @@
contour.push(new THREE.Vector2(p.x, p.y));
});
const {index, faces} = ProfiledContourGeometry(profile, contour, poly.isClosed());
const one = this.current.paths[0];
if (one) {
// merge all contour geometry for massive speed gain
const add = one.faces.length / 3;
for (let i=0; i<index.length; i++) {
index[i] += add;
}
const feces = new Float32Array(one.faces.length + faces.length);
feces.set(one.faces);
feces.set(faces, one.faces.length);
one.faces = feces;
one.index.appendAll(index);
} else {
this.current.paths.push({ index, faces, z: poly.getZ() });
}
this.stats.contour++;
});
return this;

View file

@ -125,9 +125,9 @@
// isFlat = true;
// }
if (slices.length > 150) {
isThin = true;
}
// if (slices.length > 150) {
// isThin = true;
// }
// calculate % complete and call onupdate()
function doupdate(index, from, to, msg) {