Unity3d Official Tutorial: WebGL (ii)

Deploy compression Engineering

When you build your WEBGL project in release mode, unity compresses the output files of your project to reduce the amount of engineering downloads. You can select the type of compression in the compression format option in the Publish Settings (menu: Edit->project Settings, Player, publishing Settings): gzip: This is the default option. gzip files are larger than Brotli files, but build faster and are natively supported by all browsers in the HTTP protocol and HTTPS protocol. The file name will have an additional suffix of. Gzip. Brotli:brotli compression provides the best compression rate. Brotli compressed files are significantly smaller than gzip files, but will take a long time to compress, increasing the iteration time of your release project. Brotli escort is natively supported by Chrome and Firefox in the HTTPS protocol (see WebGL Browser compatibility for more information). Brotli compressed files will have a. br suffix. Disabled: This disables the compression feature. Use this option if you want to implement your own compression in a pre-processing script.

Compression-built unity projects can work on any browser. Unity contains a software decompressor written in JavaScript that is rolled back when the server side does not enable HTTP compression transfer. The data is downloaded from the server by the browser and is decompressed by Unity's loader code. When this is done, a message appears in your browser's JavaScript console (containing your file name instead of the example here):

82 milliseconds to complete the decompression <Example/MyProject.jsgz>. If you set up a Web browser to use compression to manage files, you can remove this delay.

Here, 82 milliseconds is just an example; the amount of milliseconds spent depends on the size of the content and the speed of the computer. Larger projects take longer to decompress, and faster computers consume less time. The decompression time is typed to prompt you: You can save how much startup time by letting the browser control the decompression. Advanced : Browser local decompression

The browser can unzip it locally when it downloads data from the Unity project. This avoids the benefit of additional delays due to extracting files in JavaScript, reducing startup time. In order for the browser to decompress locally, you need to configure the Web server to provide compressed files with the correct HTTP headers: This tells the browser that the data is compressed using gzip or brotli, so that the browser extracts the data as it begins to transfer. Brotli compression is supported by Firefox and Chrome only in the HTTPS protocol, and GZIP compression is supported by all browsers. View WebGL Browser compatibility for more information. set up a Web server

The setup process for local decompression of the browser depends on your Web server. The instructions on this page are for two of the most mainstream web servers, Apache and IIS. Note that these are available under the default settings, but may need to be adjusted to match your personalization settings. In particular, if you already have another server-side configuration to compress local files, there may be problems preventing this setting. Apache

Apache uses an invisible. htaccess file for server settings. The sample code below shows an example of a. htaccess file that you can put into your distribution directory to configure Apache to take control of your compressed files.

 <ifmodule mod_rewrite.c> <ifmodule mod_mime.c> Options +symlinksifownermatch RewriteEngine on Rewri Tecond%{http:accept-encoding} br rewritecond%{request_filename}br-f rewriterule ^ (. *) \. (Js|data|mem|unity3d) $ $1.$2BR [L] addencoding br. JSBR addencoding br. Databr addencoding br. MEMBR addencoding br. u NITY3DBR Rewritecond%{http:accept-encoding} gzip rewritecond%{request_filename}gz-f RewriteRule ^ (. *) \.  (Js|data|mem|unity3d) $ $1.$2gz [L] addencoding gzip. JSGZ addencoding gzip. Datagz addencoding gzip. Memgz addencoding gzip. Unity3dgz </IfModule> </IfModule> 

When Apache receives a request for a file (for example, Release/mgame.js), here the configuration checks whether the client allows brotli-encoded data (Rewritecond%{http:accept-encoding} BR), and then checks the Release/mygame.jsb**r whether there are files (Rewritecond%{request_filename}br-f). If both cases match, Apach rewrites the request to the. jsbr file, and responds. AddEncoding Br. JSBR notifies Apache to tell the client by adding a header, and the file uses Brotli encoding.
The following sample code block makes the same setting for Gzip. Therefore, if the Release/mygame.jsgz file exists, but the Brotli compression condition is not established, Apache will use the. gzip format file processing. IIS

IIS uses the Web. config file for server configuration. The following sample code shows an example of a Web. config file that you can put in your release directory to configure how IIS handles compressed files.
In order to use this, you need to install Microsoft IIS URL Rewrite IIS module; otherwise, the browser throws a 500 internal server error. If you do not have this module installed, you can throw the code with this file but not between < rewrite> and </rewrite>. This does not make the compressed transport available, but allows IIS to handle file extensions.

<?xml version= "1.0" encoding= "UTF-8"?> <configuration> <system.webServer> <staticContent> <remove fileextension= ". Mem"/> <remove fileextension= ". Data"/> <remove fileextens

        Ion= ". Unity3d"/> <remove fileextension= ". jsbr"/> <remove fileextension= ". Membr"/> <remove fileextension= ". Databr"/> <remove fileextension= ". Unity3dbr"/> <remove fil Eextension= ". Jsgz"/> <remove fileextension= ". Memgz"/> <remove fileextension= ". Datagz"/&gt

        ; <remove fileextension= ". Unity3dgz"/> <mimemap fileextension= ". Mem" mimetype= "Application/octet-stream" /> <mimemap fileextension= ". Data" mimetype= "Application/octet-stream"/> <mimemap fileExtens Ion= ". Unity3d" mimetype= "Application/octet-stream"/> <mimemap fileextension= ". Jsbr" MimeType= "application/ Octet-stream " /> <mimemap fileextension= ". Membr" mimetype= "Application/octet-stream"/> <mimemap fileExte Nsion= ". Databr" mimetype= "Application/octet-stream"/> <mimemap fileextension= ". Unity3dbr" MimeType= "applic Ation/octet-stream "/> <mimemap fileextension=". Jsgz "mimetype=" Application/octet-stream "/> &L T;mimemap fileextension= ". Memgz" mimetype= "Application/octet-stream"/> <mimemap fileExtension= ". Datagz" mi Metype= "Application/octet-stream"/> <mimemap fileextension= ". Unity3dgz" Mimetype= "Application/octet-stream "/> </staticContent> <rewrite> <rules> <rule name=" Append BR Suff IX to WebGL content requests "> <match url=" (. *) \. (js|data|mem|unity3d) $ "/> <conditions> <add input=" {Http_accept_encodin G} "pattern=" br "/> <add input=" {Request_filenaMe}br "matchtype=" Isfile "/> </conditions> <action type=" Rewrite "url=" {r:1} .

                {R:2}BR "/> </rule> <rule name=" Append gz suffix to WebGL content requests "> <match url= "(. *) \. (js|data|mem|unity3d) $ "/> <conditions> <add input=" {Http_accept_encodin

                G} "pattern=" gzip "/> <add input=" {request_filename}gz "matchtype=" Isfile "/> </conditions> <action type= "Rewrite" url= "{r:1}. {r:2}gz "/> </rule> </rules> <outboundRules> <rule Nam E= "Append BR content-encoding header to the rewritten responses" > <match servervariable= "Response_c Ontent-encoding "pattern=". * "/> <conditions> <add input=" {Request_filen AME} "pattern=" \. (Js|data|mem|unitY3d) br$ "/> </conditions> <action type=" Rewrite "value=" br "/>

                </rule> <rule name= "Append gzip content-encoding header to the rewritten responses" >

                    <match servervariable= "response_content-encoding" pattern= ". *"/> <conditions> <add input= "{request_filename}" pattern= "\. (js|data|mem|unity3d) gz$ "/> </conditions> <action type=" Rewrite "value=" Gzi
 P "/> </rule> </outboundRules> </rewrite> </system.webServer>

If these extensions can be overwritten at a higher level of the directory structure, you only need the "remove fileextension=". * "" in this line. debugging and problem capture for WebGL engineering

Unity WebGL content cannot be correctly tuned to try MonoDevelop or visual Studio, which makes it difficult to find out what is wrong. Here are some tips on how to get information from your project. browser's JavaScript console

Unity WebGL does not have access to your file system, so you cannot write to a log file like any other platform. However, it writes all information that may be written to the log (for example, debug.log,console.writeline or unity's internal log) to the browser's JavaScript console. For Firefox, you can open the JavaScript console by pressing CTRL-SHIFT-K on the Windows system, or by pressing COMMAND-OPTION-K on your Mac. For Chrome, you can open the JavaScript console by pressing CTRL-SHIFT-J on the Windows system, or by pressing COMMAND-OPTION-J on your Mac. For Safari, you can open the JavaScript console by enabling the development menu within the Advanced table in preferences and then pressing COMMAND-OPTION-C. For Microsoft Edge or Internet Explorer, you can open the JavaScript console by pressing F12. Development Mode Engineering

For debugging purposes, you may want to create a development mode project in unity (the Development Mode engineering options box is in the Build Settings window). Development Mode engineering allows you to connect analysis tools, and they will not be compressed so that the resulting JavaScript code will still contain a readable function name (although C + + is processed). When you run to a browser error, or when you throw an exception, and the exception support is disabled, or when using Debug.logerror, this can be done using the browser display stack trace to use the analysis tool. Unlike enabling full exception support (see below), you can get a controlled stack trace that has strange names and includes not only managed code but also internal unity engine code. Exception Support Exception

WebGL has different levels of exception support (see Building for WebGL pages). By default, Unity WebGL supports only the exceptions that are obviously thrown. You can enable full exception support, which is an extra option to generate code in Il2cpp, which captures the access to null references and out-of-bounds array elements in your code. These additional options can significantly affect execution performance, increase code size, and load time, so this pattern is recommended only for debugging purposes.
Full exception support also launches the function name to generate stack traces for your code. Thus, for uncaught exceptions and Debug.Log states, you will see the stack trace in the console, and you can use System.Environment.Stacktrace to get the stack trace string.