GLSL · 03 정밀도와 수치 범위
단계: 셰이더 언어와 데이터 흐름 · 편집 가능한 예제 · 저장 ID: glsl-step-03
목표와 학습 후 역량
- 정밀도 정보를 확인한다.
- 큰 좌표의 수치 문제를 탐색한다.
선수 지식
2단위 결과물과 기록을 이어 사용합니다. 정밀도와 수치 범위 실험에 앞서 이전 입력과 기준 출력을 보관합니다.
핵심 개념과 설명
정밀도
precision qualifier는 표현 가능한 범위와 정확도에 관련됩니다. 특히 fragment의 float 기본 정밀도 선언을 빠뜨리지 않습니다.
큰 좌표
큰 수에 작은 변화를 더하면 변화가 표현되지 않을 수 있습니다. 좌표를 국소 기준으로 옮겨 계산 범위를 줄이는 방법을 비교합니다.
실습 준비
예제 화면의 실행 범위 안내를 먼저 확인하세요. 다음은 과제를 별도 프로젝트로 확장할 때의 준비 환경입니다. 별도 localhost 프로젝트에서 WebGL2와 GLSL ES 3.00으로 직접 구현하는 문서 안내 실습입니다. 기존 예제의 GLSL 버전을 먼저 확인하고 1.00 문법을 혼용하지 않습니다.
연결된 예제는 출발점입니다. 아래 과제 전체가 완성된 코드는 아니며, 예제의 지원 범위를 넘는 작업은 별도 프로젝트에서 수행하세요.
실습 과제
- precision.js에서 getShaderPrecisionFormat 결과를 기록하세요.
- fragment.glsl에 highp float를 선언하고 큰 offset에 작은 sin 변화를 더하세요.
- offset 제거 전후의 패턴을 같은 화면 크기에서 비교하세요.
관찰할 변수
| 변수 | 기준 조건 | 바꿀 조건 | 예상할 변화·검증 가설 |
|---|---|---|---|
| 좌표 offset | 0 | 100000 | 작은 차이를 표현하기 어려워 패턴이 흔들리거나 뭉칠 수 있다고 예상합니다. |
표의 예상은 측정 결과가 아닙니다. 한 번에 한 조건만 바꾸고 실제 결과가 다르면 원인을 기록하세요.
완료 조건
- 장치의 highp·mediump 범위와 precision을 기록한다.
- 두 offset의 같은 시점 이미지를 저장한다.
자가 점검
- highp를 쓰면 모든 수치 문제가 사라지나요?
- 큰 월드 좌표를 카메라 기준으로 옮기면 무엇이 개선되나요?
공식 참고
연결된 예제와 실행 범위
브라우저 WebGL ShaderMaterial 실행. 고정 640×360 비교이며 프레임 간격은 GPU 시간과 다릅니다.
원본 코드·기록은 자동으로 덮어쓰지 않습니다. 기존 예제를 초기화할 때도 필기는 유지됩니다.
다음 학습
이전: 스칼라와 벡터 타입 · 다음: Attribute와 보간