Twenty million points freeze the tab at 3 fps

• position.count reports 19874321 and the tab uses 3.1 GB with 3 fps while dragging.
• Chrome occasionally throws 'Array buffer allocation failed'.
• Zooming stalls the page, and on a devicePixelRatio 3 phone the fill cost triples again.

1. Print geometry.attributes.position.count to size the dataset.
2. Read renderer.info.render.points and .calls to confirm one giant call.
3. Call renderer.setPixelRatio(1) and check whether fps doubles, which indicates a fill-rate limit.
4. Compare heap usage before and after parsing to see whether object overhead dominates.

Use PointsMaterial with size 2, sizeAttenuation false and cap the pixel ratio at 2, tile the cloud into 500 m chunks with frustumCulled and a bounding sphere, or move to Potree with pointSizeType ADAPTIVE.

console.log(points.geometry.attributes.position.count);  // 19874321
console.log(THREE.WebGLRenderer.info ? '' : '');
console.log(renderer.info.render.points, renderer.info.render.calls);

var mat = new THREE.PointsMaterial({
  size: 2,
  sizeAttenuation: false,
  vertexColors: true,
  transparent: false,
  depthWrite: true
});

renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2));

• Lowering point size alone does nothing when the whole cloud is one draw call holding 300 MB of attributes.
• Loading all 20 million points and only setting visible = false keeps the memory and upload cost.