However, FiveM’s NUI environment does not appear to expose this functionality, and resource developers cannot enable Chromium flags through their React or JavaScript applications.
We are developing a custom FiveM framework using React, TypeScript, and Node.js, and this API would be extremely valuable for advanced UI rendering, including integrating HTML elements into Canvas-based rendering pipelines.
I’d like to ask the development team:
Does FiveM’s current CEF build contain the CanvasDrawElement implementation, even if disabled?
Could this Blink feature be enabled selectively in a future CEF build?
Would it be possible to introduce an opt-in mechanism for experimental Chromium features in NUI?
If direct support isn’t feasible, is there an officially supported alternative?
We understand that experimental browser features may have stability, security, and performance implications. Even optional support intended for development and testing would be valuable.
HTML-in-Canvas could be a valuable addition to FiveM NUI, especially for developers combining modern frontend frameworks like React or Vue with Canvas and WebGL.
Currently, integrating DOM elements into WebGL rendering pipelines requires additional workarounds, such as DOM overlays, manual texture rendering, or recreating UI components directly in Canvas/WebGL.
Native HTML-in-Canvas support could simplify several use cases:
WebGL & Shader Integration: Apply custom shaders, transformations, and visual effects to HTML content.
Component Reusability: Reuse existing React/Vue components without rebuilding layouts and styling in Canvas.
Advanced UI Development: Enable more flexible integration between DOM and GPU-accelerated rendering.
While FiveM already provides DUI for rendering browser content onto in-game textures, HTML-in-Canvas addresses a different need: integrating DOM elements directly into NUI’s Canvas/WebGL rendering pipeline.
I understand there may be compatibility, performance, and stability concerns, but even an experimental opt-in option would be valuable for developers to test and provide feedback.
Hopefully, the team can consider enabling CanvasDrawElement and related APIs in a future CEF update, or clarify whether experimental support is possible.
With HTML-in-Canvas officially targeting Chromium 157 and planned to ship enabled by default, this makes the request even more relevant for FiveM.
Since the feature is implemented at the Blink level and doesn’t require Chrome-specific code, it would be interesting to know whether it could become available in FiveM’s NUI once CEF is updated to a compatible Chromium version.
Hopefully, the Cfx.re development team can clarify whether upcoming CEF upgrades could include support for this API.