Geometries 를 공부하는 중에 Float32Array 가 있어서 잠깐 살펴보게 되었다.

Float32Array

Float32Array 이란

The Float32Array typed array represents an array of 32-bit floating point numbers in the platform byte order.
from. MDN

MDN 을 보면 Float32Array 는 32bit 짜리 floating point numbers 를 담는 배열이라는 것을 알 수 있다. 32bit 는 4byte 고 결국 4byte 메모리 영역을 잡는 Floating Point Number 를 담는 배열이라는 뜻이다. 대부분 실수가 8byte, 64bit 를 쓰는데 해당 배열을 쓰면 그에 절반이 되는 배열을 쓴다는 뜻이다.

언제 써야 하는가?

• 메모리를 덜 차지하기 때문에 공간복잡도를 줄일 필요가 있는 경우에 쓴다.
• 메모리를 덜 차지하기 때문에 정밀도가 떨어지는데 소수점 크기가 작은 숫자의 경우만 써야 된다.

이런 한정된 자원을 쓰는 자료구조를 쓰는 경우는 성능 최적화를 하는 경우이고 검색을 해보면 그래픽 처리나 연구 관련 계산을 하는 경우에 쓴다고 한다.

Float32Array with ThreeJS

Built-in-geometries 를 쓰는 경우에는 필요가 없지만 사용자가 직접 vertices 를 지정해서 geometry 를 만들어야 하는 경우, Float32Array 를 써야 한다.

const positionsArray = new Float32Array([
	0, 0, 0,
  	0, 1, 0,
  	1, 0, 0
]);
const positionsAttribute = new BufferAttribute(positionsArray, 3);

Float32Array 에 각 vertices position 을 담는 배열을 만들고 이를 BufferAttribute 에 넘기면서 몇 개의 index 가 하나의 vertice 를 의미하는 지를 같이 파라미터에 넘기면 이를 가지고 BufferGeometry 를 만들 수 있다.

위의 코드로는 삼각형 하나를 만들 수 있는데 만약 사각형을 만들고 싶다면 [1, 1, 0] 을 포함하는 하나의 삼각형을 만들어줘야 한다. 이를 고려했을 때, 정밀도가 필요없는 Object 를 렌더링 할 때, 해당 세그먼트를 최소화 할 필요를 알 수 있다.