Version: 2021.3
Building and distributing a WebGL project
Reduce load times with AssetBundles

Building your WebGL application

To create a build for WebGL, go to File > Build Settings from Unity’s main menu. In the Platform list, select WebGL and then click Switch Platform.

빌드 설정을 완료하고 나면 다음 두 옵션에서 선택합니다.

  • Build builds your application into a Player.
  • Build and Run builds your application in a Player, and opens that Player on your target platform.
빌드 설정 창
빌드 설정 창

The Unity build system for WebGL supports the following settings:

설정 기능
Texture Compression Select from the available formatting options below to set the default texture compression format for the textures in the project.You can also use this setting to change from a script or using the command-line switch -setDefaultPlatformTextureFormat. For more information, see the texture compression format overview.This setting is also available in the Player settings window.
Use default format (DXT) This is the default compression format.
ETC This extension is part of the WebGL API and exposes the ETC compressed texture format.
ETC2 This extension is part of the WebGL API and exposes the ETC compressed texture format. Use this texture compression format if using OpenGL 4.3.
ASTC This texture compression format is a popular choice due its wide range of derived compression ratios. For instance, ASTC compression is available for most Intel GPUs and Nvidia Tegra chips.
DXT This extension supports the DXTn/BCn compression format.
Development Build Enable this setting to include scripting debug symbols and the Profiler in your build. When you enable this, Unity sets the DEVELOPMENT_BUILD scripting define. You should use this setting only when you want to test your application. Note that development builds do not minify content, which means the development builds are very large to distribute.
Code Optimization Select the optimization mode to use for compiling the WebGL code.
Speed This is the default setting. Selecting this generates WebGL code that is optimized for runtime performance.
Size Selecting this generates WebGL code that is optimized for build size. This is particularly useful when building WebGL games to run on mobile browsers on Android and iOS, where the default optimize-for-speed option would generate larger WebAssembly files for mobile devices to consume.
Autoconnect Profiler Typically, when enabled, this setting allows you to automatically connect the Unity Profiler to your build. However, for WebGL, as you cannot connect the Profiler to a running build, use this option to connect the content to the Editor instead. This is because the Profiler connection is handled using WebSockets on WebGL, but a web browser only allows outgoing connections from the content. For this setting to be available, you should enable the Development Build option.
Deep Profiling Support Enable this setting to turn on Deep Profiling in the Profiler. This makes the Profiler instrument every function call in your application and returns more detailed profiling data. When you enable Deep Profiling Support, it might slow down script execution. This option is only available if you enable the Development Build option.
IL2CPP Code Generation Define how Unity manages IL2CPP code generation. This option is only available if you are using IL2CPP for your scripting backend, not Mono. To change your scripting backend, go to Player Settings > Configuration > Scripting Backend and change from Mono to IL2CPP.
Faster runtime Generates code that is optimized for runtime performance. This is the default behavior in previous versions of Unity.
Faster (smaller) builds Generates code that is optimized for build size and iteration. It generates less code and produces a smaller build, but may have an impact on runtime performance, especially for generic code. You might want to use this option when faster build times are important, such as when iterating on changes
Build Use it build your application.
Build And Run Use it to view the WebGL Player locally. Unity uses a local web server to host your build, and opens it from a localhost URL. Alternatively, you can use a custom local web server with properly configured response headers. For more information, see WebGL: Compressed builds and server configuration.

For changing the settings for Asset Import Overrides, see Build Settings.

Build Folder

The Build folder contains the following files ([ExampleBuild] represents the name of the target build folder).

파일 이름 내용물
[ExampleBuild].loader.js 웹 페이지가 Unity 콘텐츠를 로드하는 데 필요한 JavaScript 코드.
[ExampleBuild].framework.js JavaScript 런타임 및 플러그인.
[ExampleBuild].wasm WebAssembly 바이너리.
[ExampleBuild].mem 플레이어의 힙 메모리를 초기화하는 바이너리 이미지. Unity는 멀티 스레드 WebAssembly 빌드에 대해서만 이 파일을 생성합니다.
[ExampleBuild].data 에셋 데이터 및 씬.
[ExampleBuild].symbols.json 오류 스택 추적을 디맹글하는 데 필요한 디버그 심볼 이름. 이 파일은 Debug Symbols 옵션(File > Build Settings > Player Settings)을 활성화한 경우에만 릴리스 빌드에 대해 생성됩니다.
[ExampleBuild].jpg 빌드가 로드되는 동안 표시되는 배경 이미지. 이 파일은 플레이어 설정(File > Build Settings > Player Settings > Splash Image)에서 배경 이미지가 제공된 경우에만 생성됩니다. 자세한 내용은 스플래시 화면 페이지를 참조하십시오.

빌드에 대해 Compression Method를 활성화하면 Unity는 압축 방식에 해당하는 확장자를 식별하고 해당 확장자를 Build 하위 폴더 내의 파일 이름에 추가합니다. Decompression Fallback을 활성화하면 Unity는 빌드 파일 이름에 .unityweb 확장자를 추가합니다. 그렇지 않으면 Unity는 Gzip 압축 방식의 경우 .gz, Brotli 압축 방식의 경우 .br 확장자를 추가합니다. 자세한 내용은 WebGL: 압축 빌드 및 서버 설정을 참조하십시오.

If you enable Name Files As Hashes in the Player Settings, Unity uses the hash of the file content instead of the default filename. This applies to each file in the build folder. This option allows you to upload updated versions of the game builds into the same folder on the server, and only upload the files which have changed between build iterations.

참고: 일부 브라우저에서는 파일 시스템에서 플레이어를 직접 열 수 없습니다. 이는 로컬 파일 URL에 적용된 보안 제한 사항 때문입니다.

Deep Profiling Support

Deep Profiling Support 설정을 활성화하면 Unity 프로파일러가 애플리케이션의 모든 함수 호출을 프로파일링합니다. 자세한 내용은 세부 프로파일링 문서를 참조하십시오.

Player settings

WebGL은 플레이어 설정(메뉴: Edit > Project Settings 에서 Player 카테고리 선택)에 몇 가지 추가 옵션이 있습니다.

기타 설정

엔진 코드 스트립

Other Settings 를 열어 Strip Engine Code 옵션에 액세스합니다. 이 옵션은 기본적으로 선택되어 있어 WebGL에 대해 코드 스트리핑을 활성화합니다. 이 옵션이 선택되어 있으면 Unity는 사용되지 않은 클래스에 대한 코드를 포함시키지 않습니다. 예를 들어, 물리 컴포넌트 또는 함수를 사용하지 않으면 전체 물리 엔진이 빌드에서 제거됩니다. 세부 정보는 아래의 스크리핑 섹션을 참조하십시오.

퍼블리싱 설정

Enable Exceptions

Publishing Settings 를 열어 Enable Exceptions 에 접근합니다. Enable Exceptions 를 통해 런타임에 예기치 않은 코드 동작(일반적으로 오류로 간주됨)을 처리하는 방법을 지정할 수 있습니다. 다음 옵션이 있습니다.

  • None: 예외 지원이 필요하지 않은 경우에 선택합니다. 성능이 극대화되고 빌드가 최소화됩니다. 이 옵션을 선택하면 폐기된 예외로 인해 해당 설정에 오류가 있는 경우 콘텐츠가 중지됩니다.
  • Explicitly Thrown Exceptions Only (기본): 스크립트의 throw 문에서 명시적으로 지정된 예외를 캡처하고 finally 블록이 호출되도록 하려면 이 옵션을 선택합니다. 이 옵션을 선택하면 스크립트에서 생성된 JavaScript 코드가 더 길어지고 더 느려지지만, 스크립트가 프로젝트의 중요한 병목 지점인 경우를 제외하고는 문제가 되지 않을 것입니다.
  • Full Without Stacktrace: 다음을 캡처하려면 이 옵션을 선택합니다.
    • 스크립트의 throw 문에서 명시적으로 지정된 예외(Explicitly Thrown Exceptions Only 옵션과 동일)
    • Null 레퍼런스
    • 범위 이탈 배열 액세스
  • Full With Stacktrace: 이 옵션의 상기 옵션과 유사하지만 스택 추적도 캡처합니다. Unity는 이런 예외에 대한 확인을 코드에 포함시켜서 예외를 생성하므로, 이 옵션을 선택하면 성능이 둔화되고 브라우저 메모리 사용이 증가합니다. 디버깅에만 이 옵션을 사용하고 항상 64비트 브라우저에서 테스트해야 합니다.

Publishing Settings__를 선택하여 Data Caching__에 접근합니다.

데이터 캐싱

To access Data Caching, go to Publishing Setings via File > Build Settings > Player Settings > WebGL. This enables the browser to cache the main data files into the IndexedDB database.

기본 브라우저 HTTP 캐시를 사용한다고 해서 브라우저가 특정 리스폰스를 캐싱한다고 보장하지는 않습니다. 이는 브라우저 HTTP 캐시의 공간이 제한되고, 브라우저가 너무 큰 파일은 캐싱하지 못할 수 있기 때문입니다.

로드 시간을 향상하기 위해 IndexedDB를 사용하면 브라우저 제한을 초과하여 파일을 캐싱할 수 있습니다. 더 많은 파일을 캐싱하면 다음 빌드 실행 동안 사용자 컴퓨터에서 다운로드한 콘텐츠를 사용할 수 있는 가능성이 높아집니다.

데이터 캐싱은 HTTP 리스폰스를 위해 .data 파일만 IndexedDB 캐시에 캐싱합니다. 에셋 번들을 캐싱하려면 Data Caching을 활성화하고 unityInstance.Module.cacheControl()을 오버라이드해야 합니다. 이렇게 하려면 Module.cacheControl(url)이 요청된 에셋 번들 URL에 대해 must-revalidate를 반환하는지 확인하십시오. 예를 들어 createUnityInstance()가 반환하는 Promise의 이행 콜백에서 unityInstance.Module.cacheControl() 함수를 오버라이드할 수 있습니다. createUnityInstance()에 대한 자세한 내용은 WebGL: 압축 빌드 및 서버 설정을 참조하십시오.


  • Unity 2019.1에서 asm.js 링커 타겟 삭제됨
  • Unity 2020.1에서 빌드 파일 업데이트 및 데이터 캐싱 추가됨
Building and distributing a WebGL project
Reduce load times with AssetBundles