let tile: workgroup<array<f32, 64>>는 WGSL의 var<workgroup>입니다. 워크그룹마다 복사본이 하나씩 있어 그 안의 인보케이션들이 함께 쓰며, 여기서는 인보케이션이 한 칸씩 차지하는 스크래치로 씁니다. 원자적 값의 워크그룹 배열과 인보케이션별 카운터도 함께 둡니다.
workgroup-scratch.shade.ts
O0과 O1에서는 컴파일러가 레벨만 받아 WGSL을 생성하므로, 괄호와 최소화, 숫자 리터럴, 난독화, f64 에뮬레이션은 GLSL 탭에만 적용됩니다. f64 에뮬레이션은 reflect()가 따로 받으므로 모든 레벨에서 리플렉션에 반영됩니다.
이 파일에는 @vertex 진입점이 없어서, 화면 전체를 덮는 삼각형 뒤에 놓고 컴파일합니다. 그 삼각형이 프래그먼트 단계에 0에서 1까지 도는 uv를 넘깁니다. 탭과 캔버스에는 그렇게 만든 프로그램이 나옵니다.
TS
VS Code가 열리지 않았다면 TypeShade 확장이 없는 것일 수 있습니다. 설치 방법을 확인하십시오.
진단컴파일 대기 중
버텍스 진입점과 프래그먼트 진입점이 있는 모듈을 컴파일하면 그려집니다.
프래그먼트 진입점을 픽셀마다 한 번씩, GPU 없이 실행합니다.
셰이더에서 console.log를 부르면 그 줄이 여기에 나옵니다. 컴퓨트 모듈은 모든 인보케이션의 줄을 보여 줍니다. 그리는 모듈은 캔버스의 픽셀을 클릭하거나, WebGPU에서 프레임 전체를 기록하면 됩니다.
편집기에는 이 예제의 파일이 들어 있고, 프로그램은 이 파일과 이 파일이 가져오는 파일로 이루어집니다. 내용을 고치면 브라우저에서 다시 컴파일하고, 편집기 옆의 탭이 따라 바뀝니다.
TypeShade