복잡한 계단 난간 모델링 최적화하기

아래와 같은 복잡한 계단 난간을 모델링할때 난간 벽면과 바닥에 대한 철재 부분의 세밀한 부분도 모두 모델링한다면 매우 많은 정점과 면으로 구성된 모델이 나올 것이고 이를 웹에서 인터렉티브하게 시각화할 경우 속도 측면에서 그 효율성은 매우 떨어질 것입니다.

위의 모델에 대한 최적화된 모델링을 위해서는 먼저 계단 난간의 벽면과 바닥에 대해 매우 세밀한 모델링을 다음처럼 구축합니다.

그리고 위의 벽면과 바닥에 대한 텍스쳐를 2개 베이킹하는데요. 하나는 노말맵 또 하나는 알파맵입니다.

그리고 다음과 같은 모델에 위의 텍스쳐를 맵핑 시킵니다.

맵핑은 다음과 같은 쉐이더 노드로 구성합니다.

위의 쉐이더 노드 구성 시에 Blend Mode를 Alpha Clip으로 지정해서 알파값에 대한 임계값(Clip Threshold)을 직접 지정할 수 있도록 해야 합니다.

간단하게 Eevee로 렌더링된 결과는 다음과 같습니다.

JSZip에서 파일명이 한글인 파일을 압축한 파일 읽기

JSZip은 웹에서 zip 압축 파일을 생성하거나 풀 때 사용하는 라이브러리인데, 기본적으로 압축 파일 안의 파일 명이 한글일 때 파일 명이 깨진다. 그런데 이 문제를 해결할 수 있다. iconv 라이브러리를 사용하면 되고 JSZip은 내부적으로 iconv 라이브러리와 연계하여 압축 파일 안의 파일 명이 한글일때 문제점을 해결해 주는 API를 지원한다. 코드는 다음과 같다.

const zip = new JSZip();
zip.loadAsync(aBuf, {
    decodeFileName: function (bytes) {
        return iconv.decode(bytes, "euc-kr");
    }
}).then((zip) => {
    for(let file of Object.values(zip.files)) {
        console.log(file.name);
    }
});