unity webgl网页运行后屏幕模糊，UI无响应问题解决

【记一个莫名其妙的问题】

工具：Unity 2019.4.40f1c1

先前Unity打包apk，设置了最大帧率15

Application.targetFrameRate = 15;

在Project Settings ->Quality中设置了Other->VSync Count：Don’t Sync

运行后，帧率稳定在100上下，呵呵

后来在代码中加了一行：

QualitySettings.vSyncCount = 0;

问题解决

今天，准备再打一个webgl包
打包运行后，打开网页，画面停留在第一帧，极其模糊，UI点击无响应，但鼠标点击音效正常播放。

刚开始以为是前端代码被我玩坏了，还原h5文件与CSS文件后，问题未解决。

查看网页控制台报错：

Looks like you are rendering without using requestAnimationFrame for the main loop. You should use 0 for the frame rate in emscripten_set_main_loop in order to use requestAnimationFrame, as that can greatly improve your frame rates!

所以大概是‘帧’的问题？尝试注释掉了之前的那一行

QualitySettings.vSyncCount = 0;

问题解决。。。

查阅资料后，vSyncCount的含义是垂直同步，在Project Settings ->Quality中设置的Other->VSync Count有三个选项：
1.Don’t Sync：关闭垂直同步，手动设置帧率
2.Every V Blank：帧率60，手动设置无效
2.Every Second V Blank：帧率30，手动设置无效
设置垂直同步的意义在于防止画面高速高比例变换下的上一帧未渲染完成、下一帧已开始渲染导致的画面撕裂问题。

参考：博客