Reprinted to: https://www.it610.com/article/1295062035498868736.htm
1.webgl does not display fonts
I started exporting and found that some characters were not displayed. I thought that the resolution compressed the Text text and the characters were not displayed. Later, I found out that it was a webgl problem. I checked the information and said not to use the fonts that come with unity.
2. webgl cannot input Chinese
A bovine blogger solves the Chinese input plug-in
CSDN bloggers share Chinese input plug-ins
Use both together!
3. Blurred fonts
This is relatively common. By default, Unity uses Text to enlarge the font and it will be blurry, or even unclear. The solution to this problem is to use the TextMeshProUGUI plug-in, which can be downloaded in PackageManager.
The advantages of this plugin are:
1. You can make different fonts by yourself;
2. No matter how many times it is enlarged, or the font size is small, it will be displayed clearly;
4. The webgl export package browser opens an error report exceeding the memory size
There will be such errors more or less in the project made into webgl. After searching the official information, using the unity2018 version can adjust the size of the memory used by the export package. The value of changing the memory size has been deleted since the unity2019 version, :(Then find the One solution is to change the memory size of the code. I found that a piece of code under the Universal WebGL template has been commented to change the memory size, and then try to increase the value of the memory. It can be opened normally in Firefox browser, but in Google browser The browser directly reported another error, wanting to cry without tears, Party A requested to use the Google browser, and had to find another way. The final solution was to use Asset Bundle to load the package, reduce the size of the package, and reduce the memory usage.
5. webgl uses Asset Bundle to load resource model material display exception
At the beginning, I exported the webgl package and ab package, loaded them with the browser, and then found a piece of red. Some of the model materials loaded with the ab package were displayed in pink. The first reaction was that the materials were lost. I thought it was the ab package that unloaded the material resources. , and then after changing the code without uninstalling, it is still the same. . . That's not the reason. I checked some information on the Internet and found that the relevant shaders need to be added to ProjectSettings->Graphics->Always Included Shaders. Remember to include the unity Standard material, otherwise you will find that you export the webgl package It will be very slow and the size of your package will be very large, because it contains thousands of shaders, so try to use Standard as little as possible here, and you can use it, but the effect will change, and it will be displayed in the editor very well. Just like changing a shader, try to use other shaders that can replace it, or you can write a shader, or use a shader written by the ShaderGraph plug-in, and then include it here, so that the export speed is fast and the package is small.
6. Some considerations for webgl using Asset Bundle to load resources
Use the Asset Bundle Browser plug-in, which can be downloaded in PackageManager, and there are many tutorials on the Internet. I think this plug-in is quite easy to use. It can display whether there are duplicate resources in different ab packages, allowing developers to reduce the size of the ab package. The following are some precautions for using ab packages: try to use multiple ab packages, and the size of each ab package should not exceed 20M, use ab package classification management; try not to use the method of blocking coroutines to load ab packages; ProjectSettings-> Uncheck Player->Strip Engine Code; remember UnLoad (false) after loading to reduce memory usage; the shader used by the ab package should be included in ProjectSettings->Graphics->Always Included Shaders; use LZ4 compression.
7. webgl play video
This is relatively simple, and there are many plug-ins on the Internet. The VideoPlayer that comes with unity can play local videos and URLs. Note that you need not check Play on Awake at the beginning, and the video will not be played in the browser. I use AVProVideo , this plug-in is not bad, it supports PC, android, IOS, Webgl, Mac and other platforms, you can choose by yourself, there are many online tutorials, also note that the video will not be played at the beginning.
8. webgl play video stream real-time video
There is a requirement to play rtsp video streams in the project, and then I checked some information. After searching for a long time, I saw a plug-in UMP Pro Win Mac Linux WebGL. After using it, I found that webgl does not seem to support it. m3u8 online video (monitoring, live broadcast) solution, this article is very good, you can try it if you want to learn.
9. webgl json serialization and deserialization problems
Use the JsonUtility.FromJson() that comes with unity to parse json data in the editor. Even if it is defined as int data and the value is Null, this can also be parsed in webgl, but some data structures cannot be parsed normally. , such as Dictionary, which can be parsed normally in the editor, but cannot be parsed normally in webgl. Later, I found another Newtonsoft.Json to parse. This can parse dictionary data normally, but you must define it correctly. Unity comes with it The JsonUtility.FromJson() does not need to define the attribute correctly. Some people may define a certain attribute for your interface as an int type, but the given data is null. There are many such people, so what should I do? , using Newtonsoft.Json to parse will report an error, saying that the attribute definition is wrong, and it will also crash. . . Fortunately, there is a solution for finding information, which is to use int? to define, and other types float? and long? can be defined in this way, so that this problem can be solved.
10. webgl+nginx to build a simple service
Some browsers of the packaged webgl do not support direct opening. Google and Firefox cannot be opened directly, so a simple server needs to be built to open the webgl webpage. The following article is a good solution to this problem. unity webgl + nginx Server You can reduce your startup time if you configure your web server to host
11.webgl solves the problem of model sawtooth
The solution to the problem of model aliasing is: Project Settings->Quality->Anti Aliasing, select 8x Multi Sampling, Quality, remember to select the options you set under the webgl platform. Of course, some plug-ins will have anti-aliasing optimization, such as PostProcessing post-processing special effects plug-ins, if you are interested, you can try it.
12. webgl mode
I believe that friends who develop webgl projects should know that writing in the editor can run normally, but when exporting webgl and running it, various errors will be found. I can’t wait for unity to create an editor for testing on the web page, and cooperate with a piece of code in VS. Debug mode, but this is impossible, so try to use debug to locate the error, the editor is also tortured, because some functions can only be deployed and tested on a specific machine, which makes my code wrong and I can only write debug It’s time to position, so write more, because it’s not easy to export the package! Pack for 10 minutes at a time. If you want to test which piece of code has problems, you have to look at debug. Remember to check ProjectSettings->Player->Enable Exceptions to Explicitly Thrown Exceptions Only, otherwise you will not see debug in the browser console Yes, remember to turn it off when it is officially launched.
13. webgl performance optimization
When you open your project full of joy and find that your project is like playing PTT, then you need to optimize it. The optimization includes:
1. Reduce the number of faces and vertices of the model (try not to use too many faces of balls and cylinders);
2. Use static batching, check Project Settings->Player->Other Settings->Static Batching, the corresponding object Static needs to check Batching Static;
3. To use dynamic batching, check Project Settings->Player->Other Settings->Dynamic Batching, and the corresponding object Static needs to check Batching Static;
4. If the texture is blurry, uncheck Generate mip map and reduce MaxSize as much as possible;
5. Remove shadows and use light maps;
6. If the material of the model does not need to be affected by light, try to use Mobile/Diffuse or Unlit/Texture;
7. Try to delete the collision body;
8. Delete the useless Animator (some models will be imported);
9. Use Animator as little as possible, use Dotween or Animation for simple animation, use Animator for tedious and multi-state;
10. Delete grid collision, try not to use grid collision;
11. Use light baking, use Reflection Probe and Light Probe Group, after the property setting is completed, place the model that needs to be affected by the light into it, and click bake in the lighting panel (you can delete the object, the data already exists in the Scene data) ;
12. Use occlusion removal, place the object in the Occlusion Area, static check Occluder static and Occludee static, and bake in the Occlusion panel (you can delete the object, the data already exists in the Scene data);
13. Use new as little as possible when starting to run;
14. Use LOD (this is not recommended, only use it when there is enough memory. Generally, the memory of webgl is tight, and it may be that the memory is exceeded)
Posted on 2022-03-14 15:39