WebGL 빌드 디버깅 및 문제 해결
WebGL 네트워킹(Networking)

WebGL 그래픽스(WebGL Graphics)

WebGL is an API for rendering graphics in web browsers, which is based on the functionality of the OpenGL ES graphics library. WebGL 1.0 roughly matches OpenGL ES 2.0 functionality, and WebGL 2.0 roughly matches OpenGL ES 3.0 functionality.

Camera Clear

The default WebGL behaviour is to clear the drawing buffer after each frame. This means on Unity WebGL, the content of the frame buffer clears regardless of the Camera.clearFlags setting. However, you can change this behaviour at instantiation time. To do this, set webglContextAttributes.preserveDrawingBuffer to true in your WebGL template:

UnityLoader.instantiate("unityContainer", "%UNITY_WEBGL_BUILD_URL%", {
    Module: {
        "webglContextAttributes": {"preserveDrawingBuffer": true},
    }
});

디퍼드 렌더링

WebGL2.0을 사용할 수 있을 때 Unity WebGL은 디퍼드 렌더링 경로만 지원합니다. WebGL1.0에서 Unity WebGL 런타임은 포워드 렌더링을 대신 사용합니다.

전역 조명

Unity WebGL은 베이크된 GI만 지원합니다. 실시간 GI는 WebGL에서 현재 지원되지 않습니다. 또한 비방향 라이트맵만 지원합니다.

리니어 렌더링

Unity WebGL only supports linear color space rendering with WebGL 2.0. Linear color space rendering doesn’t have fallback support for WebGL 1.0. To build a WebGL player using linear color space rendering, you need to remove WebGL 1.0 API in the Player settings, open the Other Settings panel, disable the Automatic Graphics API setting.

일부 웹 브라우저에서는 sRGB DXT 텍스처 압축이 지원되지 않습니다. 따라서 리니어 렌더링을 사용하는 경우 런타임 시점에 모든 DXT 텍스처의 압축을 풀어야 하므로 렌더링 성능이 저하될 수 있습니다.

MovieTextures

WebGL은 MovieTexture 클래스를 사용한 비디오 재생을 지원하지 않습니다. 하지만 HTML5 비디오 요소를 사용하여 WebGL 콘텐츠의 비디오를 효율적으로 재생할 수 있습니다. 이렇게 하는 방법의 예를 보려면 이 에셋 스토어 패키지를 다운로드하십시오.

WebGL 셰이더 코드 제한

The WebGL 1.0 specification imposes some limitations on GLSLS shader code, which are more restrictive than many OpenGL ES 2.0 implementations. This is mostly relevant when you write your own shaders.

구체적으로 설명하면 WebGL에서는 인덱스 배열 또는 행렬에 사용할 수 있는 값이 제한됩니다. WebGL에서는 상수식, 루프 인덱스, 또는 조합을 사용한 동적 인덱싱만 허용됩니다. 아무 식이나 사용해서 인덱스할 수 있는 버텍스 셰이더의 통합 액세스만 예외입니다.

또한 제어 구조에도 제한이 적용됩니다. 허용되는 유일한 루프 타입은 이니셜라이저가 변수를 상수로 초기화하고, 업데이트에서 상수를 변수에 더하거나 변수에서 빼고, 연속성 테스트에서 변수를 상수에 비교하는 for 카운트 루프입니다. 이런 기준을 충족하지 않는 for 루프와 while 루프는 허용되지 않습니다.

폰트 렌더링

Unity WebGL은 모든 Unity 플랫폼처럼 동적 폰트 렌더링을 지원합니다. 하지만 사용자 기기에 설치된 폰트에 액세스할 수 없으므로 사용되는 폰트(국제 문자의 폴백 폰트나 폰트의 볼드/이탤릭 버전 등)를 프로젝트 폴더에 포함시키고 폴백 폰트 이름으로 설정해야 합니다.

안티앨리어싱

WebGL supports anti-aliasing on most (but not on all) combinations of browsers and GPUs. To use it, anti-aliasing must be enabled in the default Quality setting for the WebGL platform.

WebGL1.0에서는 다음과 같은 몇 가지 제약이 있습니다.

  • Switching Quality settings at runtime will not enable or disable anti-aliasing. It has to be set up in the default Quality setting loaded at player start up.

  • 각기 다른 멀티 샘플링 수준(2x, 4x 등)은 WebGL에서 켜져 있든 꺼져 있든 영향이 없습니다.

  • 카메라에 포스트 프로세싱 효과를 적용하면 내장 안티앨리어싱이 활성화됩니다.

  • HDR is not compatible with anti-aliasing so make sure the Allow HDR camera option is disabled.

WebGL2.0에서는 이런 제약이 없습니다.

반사 프로브

반사 프로브는 WebGL에서 지원되지만, 특정 밉맵으로 렌더링하는 것에 대한 WebGL 사양의 제약으로 인해 매끄러운 실시간 반사 프로브는 지원되지 않습니다. 따라서 실시간 반사 프로브는 항상 선명한 반사를 생성하므로 해상도가 매우 낮은 것처럼 보일 수 있습니다. 매끄러운 실시간 반사 프로브에는 WebGL 2.0이 필요합니다.

WebGL 2.0 지원

Unity includes support for the WebGL 2.0 API, which brings OpenGL ES 3.0-level rendering capabilities to the web.

By default, Unity WebGL builds support both WebGL 1.0 and WebGL 2.0 APIs, This can be configured in the WebGL Player settings under the Other Settings panel by disabling the Automatic Graphics API property.

브라우저에서 WebGL 2.0이 지원되는 경우 스탠다드 셰이더 품질 개선, GPU 인스턴스화 지원, 방향 라이트맵 지원, 셰이더 코드의 제한 없는 인덱싱 및 루프, 성능 개선을 통해 콘텐츠가 향상됩니다.

You can use SystemInfo.graphicsDeviceType at run time to determine whether the Unity instance is rendering with OpenGLES3 (WebGL2.0) or OpenGLES2 (WebGL1.0).


  • 2018–10–26 일부 편집 리뷰를 거쳐 페이지 수정됨

  • Unity 2017.2에서 WebGL 2.0용 리니어 렌더링 추가됨 NewIn20172

WebGL 빌드 디버깅 및 문제 해결
WebGL 네트워킹(Networking)