WebGL의 캐시 동작

Unity WebGL에서는 캐시 API를 사용하여 .data 파일과 AssetBundles에 캐시된 에셋 데이터를 브라우저 캐시에 저장합니다.최대 파일 크기, 최대 전체 캐시 크기, 퇴거 기준과 같은 브라우저 캐시에 대한 스토리지 제한은 사용하고 있는 브라우저와 플랫폼에 따라 다릅니다.자세한 내용은 브라우저 스토리지 제한 및 퇴거 기준을 참조하십시오.

데이터 캐싱

데이터 캐싱에 액세스하려면, File > Build Settings > Player Settings에서 WebGL의 Publishing Setings를 엽니다.이렇게 하면 브라우저가 주요 데이터 파일을 IndexedDB 데이터베이스에 캐싱할 수 있습니다.

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

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

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

WebGL 캐시 동작 커스터마이즈

기본적으로 WebGL 캐시는 에셋 데이터 파일 .data와 에셋 번들 파일 .bundle을 저장하며, 캐시에서 로드하기 전에 이를 다시 확인합니다.UnityLoader 설정을 변경하는 새로운 WebGL 템플릿을 추가하여 이 동작을 변경할 수 있습니다.

다음 예시는 커스텀 cacheControl 함수를 index.html 파일 내의 UnityLoader 설정에 추가하는 것을 보여줍니다.

var config = {
   // ...
# if USE_DATA_CACHING
   cacheControl: function (url) {
     // Caching enabled for .data and .bundle files.
     // Revalidate if file is up to date before loading from cache
     if (url.match(/\.data/) || url.match(/\.bundle/)) {
         return "must-revalidate";
     }

     // Caching enabled for .mp4 and .custom files
     // Load file from cache without revalidation.
     if (url.match(/\.mp4/) || url.match(/\.custom/)) {
         return "immutable";
     }
 
     // Disable explicit caching for all other files.
     // Note: the default browser cache may cache them anyway.
     return "no-store";
   },
# endif
   // ...
}

cacheControl 함수는 요청한 URL을 파라미터로 받아 다음 중 하나를 반환합니다.

• must-revalidate - 함수가 must-revalidate를 반환하면 캐시가 활성화된 상태로 돌아가고 캐시에서 파일을 로드하기 전에 파일을 다시 확인합니다.

• immutable - 함수가 immutable을 반환하면 캐시가 활성화되고 파일을 다시 확인하지 않고 캐시에서 로드합니다.

• no-store - 함수가 no-store를 반환하면 캐시가 비활성화됩니다.

브라우저는 .html, .js, .css, .json, .jpg, .png와 같은 특정 파일 타입을 자동으로 저장(캐싱)하므로 WebGL 캐시에 명시적으로 저장할 필요가 없습니다.일반적으로 WebGL 캐시의 후보에는 대용량 파일과 커스텀 파일 포맷을 사용하는 파일이 포함됩니다.