Skip to content

1. Home

aSurgingRiver edited this page Feb 21, 2024 · 2 revisions

background

Having used the official version of WebBrowser of UE, I have a feeling that WebBrowser only provides basic functions, and often cores in complex environments, opening web pages will slow down the game frame rate, and animation and video playback will not be able to do anything. Therefore, it cannot be used in large-scale applications. The official website still needs to be optimized in this regard. Recently, the product needs to use a lot of UE as the 3D rendering scene, and then use JS as the UI, so that the product can be developed efficiently and easy to use. At the beginning, I also used the official WebBrowser to load the JS page. After loading the 2K webpage in the UE empty scene, the game frame rate dropped to less than 60 frames. This kind of performance cannot be applied at all. So later, I tried various browser plug-ins including BLUI, WebUI, etc., all of which could not meet the requirements. Later, I found the WebView browser plug-in, which solved the problem.

Global download [address ]: https://github.com/aSurgingRiver/WebView

Problems solved by WebView When the main thread of the engine has heavy tasks, it will cause the browser to freeze. When JS sends a large number of messages to the UI engine, the engine will freeze. When the UE occupies a high GPU, it will cause the browser to freeze. When loading multiple pages with animations or videos, UE will freeze. When the browser renders a large screen, it will cause the UI frame rate to slow down.

Introduction to WebView

WebView is an enterprise browser plugin designed for Virtual Engine. It uses many advanced technologies. It doesn't drop frames while browsing the web or watching videos. The kernel takes the latest CEF version and optimizes it. It has GPU binding function, supports the separation of game and browser rendering, and increases the rendering cache inside the plug-in, and the rendering effect is smooth. In terms of communication with web pages, V8 technology is used to make Unreal Engine interact with web pages in real time. It is recommended to use Unreal Engine to render the scene and use JavaScript for UI interaction, which can greatly improve the efficiency of system development.

WebView technical exchange

Facebook:https://www.facebook.com/ue.webview

WebView features

  1. Support H264 and h265 protocols
  2. Various video sites like youtube and BiliBili
  3. Webrtc access cloud rendering
  4. Webrtc Online Voice and Video
  5. H5, HTTPS, CSS and JavaScript
  6. UE4 and JavaScript call each other
  7. Mouse event transparent background page, mouse penetration transparency can be adjusted
  8. Right-click page navigation
  9. Debug JavaScript with chrome tools
  10. Mouse drag
  11. Input method conversion
  12. ctrl+wheel zoom page
  13. Efficient rendering of page animations
  14. Load custom protocol on web page like SVN
  15. 8K video at 60fps, no frame loss
  16. GPU binding separates virtual engine and browser rendering

WebView effect

image

image