ChromiumWebBrowser flash black after hiding without disabling WebGL - winforms

Question

I am trying to hide my ChromiumWebBrowser behind images, video, etc... But every time it changes from a ChromiumWebBrowser to anything else than a blank panel or another ChromiumWebBrowser it flashes black for a few frames.
Exemple of my problem
hardware:
i7-8559U
intel IRI plus Graphics 655
CefSharp Version 79.1.350 for a Winform Program
Here is what I tried:
BringToFront other PictureBox
SendToback the ChromiumWebBrowser
Panel visibility
Panel doubleBuffed
I also enable Cef.EnableHighDPISupport(); but to no success.
The only thing that worked so far is to ADD
SetOffScreenRenderingBestPerformanceArgs();
But unfortunately, it disables WebGL implementation :/ and I would like to keep it for later purposes.
static class Program
{
/// <summary>
/// Point d'entrée principal de l'application.
/// </summary>
[STAThread]
static void Main()
{
Cef.EnableHighDPISupport();
Application.EnableVisualStyles();
Application.SetCompatibleTextRenderingDefault(false);
Application.Run(new Form1());
}
}
public partial class Form1 : Form
{
private static ChromiumWebBrowser chrome;
private PictureBox ImageBox = new PictureBox();
private Panel pPictureBox = new Panel();
private Panel pChromium = new Panel();
Timer timer = new Timer();
public Form1()
{
InitializeComponent();
this.FormClosing += new System.Windows.Forms.FormClosingEventHandler(this.Form1_FormClosing);
ImageBox.Image = Properties.Resources._3080;
ImageBox.SizeMode = PictureBoxSizeMode.StretchImage;
pPictureBox.Controls.Add(ImageBox);
ImageBox.Dock = DockStyle.Fill;
pPictureBox.Dock = DockStyle.Fill;
pPictureBox.Size = this.Size;
this.Controls.Add(pPictureBox);
pPictureBox.BringToFront();
InitializeChromium();
timer.Interval = 7000;
timer.Start();
timer.Tick += Timer_Tick;
}
private void Timer_Tick(object sender, EventArgs e)
{
if (pChromium.Visible)
{
pChromium.Hide();
}
else
{
pChromium.Show();
}
}
private void InitializeChromium()
{
pChromium.Dock = DockStyle.Fill;
pChromium.Size = this.Size;
CefSettings settings = new CefSettings();
//Work but disable WebGL
//settings.SetOffScreenRenderingBestPerformanceArgs();
//settings.DisableGpuAcceleration();
Cef.Initialize(settings);
chrome = new ChromiumWebBrowser("https://www.apple.com/ca/airpods-pro/");
pChromium.Controls.Add(chrome);
this.Controls.Add(pChromium);
chrome.Dock = DockStyle.Fill;
pChromium.BringToFront();
}
private void InitializeComponent()
{
this.SuspendLayout();
//
// Form1
//
this.AutoScaleDimensions = new System.Drawing.SizeF(6F, 13F);
this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
this.BackColor = System.Drawing.Color.White;
this.ClientSize = new System.Drawing.Size(1904, 1041);
this.Name = "Form1";
this.Text = "Form1";
this.ResumeLayout(false);
}
private void Form1_FormClosing(object sender, FormClosingEventArgs e)
{
Cef.Shutdown();
}
}
Do you guys have any solution?

Answer 1

Here is my final code for any one interested
Links of the command recommanded by #amaitland
https://peter.sh/experiments/chromium-command-line-switches/#use-angle
https://peter.sh/experiments/chromium-command-line-switches/#in-process-gpu
both command works individualy
Cef.EnableHighDPISupport(); is not required but is recommanded
static void Main()
{
Cef.EnableHighDPISupport();
Application.EnableVisualStyles();
Application.SetCompatibleTextRenderingDefault(false);
Application.Run(new Form1());
}
public partial class Form1 : Form
{
private static ChromiumWebBrowser chrome;
private PictureBox ImageBox = new PictureBox();
private Panel pPictureBox = new Panel();
private Panel pChromium = new Panel();
Timer timer = new Timer();
public Form1()
{
InitializeComponent();
this.FormClosing += new System.Windows.Forms.FormClosingEventHandler(this.Form1_FormClosing);
//any image here
ImageBox.Image = Properties.Resources._3080;
ImageBox.SizeMode = PictureBoxSizeMode.StretchImage;
pPictureBox.Controls.Add(ImageBox);
ImageBox.Dock = DockStyle.Fill;
pPictureBox.Dock = DockStyle.Fill;
pPictureBox.Size = this.Size;
this.Controls.Add(pPictureBox);
pPictureBox.BringToFront();
InitializeChromium();
timer.Interval = 7000;
timer.Start();
timer.Tick += Timer_Tick;
}
private void Timer_Tick(object sender, EventArgs e)
{
if (pChromium.Visible)
{
pChromium.Hide();
}
else
{
pChromium.Show();
}
}
private void InitializeChromium()
{
pChromium.Dock = DockStyle.Fill;
pChromium.Size = this.Size;
CefSettings settings = new CefSettings();
//-------------------------------------------------------------------------
settings.CefCommandLineArgs.Add("in-process-gpu");
//got best FPS with this renderer on "my machine"
settings.CefCommandLineArgs.Add("use-angle", "gl");
//-------------------------------------------------------------------------
//Work but disable WebGL
//settings.SetOffScreenRenderingBestPerformanceArgs();
//settings.DisableGpuAcceleration();
Cef.Initialize(settings);
chrome = new ChromiumWebBrowser("https://alteredqualia.com/three/examples/webgl_pasta.html");
pChromium.Controls.Add(chrome);
this.Controls.Add(pChromium);
chrome.Dock = DockStyle.Fill;
pChromium.BringToFront();
}
private void InitializeComponent()
{
this.SuspendLayout();
//
// Form1
//
this.AutoScaleDimensions = new System.Drawing.SizeF(6F, 13F);
this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
this.BackColor = System.Drawing.Color.White;
this.ClientSize = new System.Drawing.Size(1904, 1041);
this.Name = "Form1";
this.Text = "Form1";
this.ResumeLayout(false);
}
private void Form1_FormClosing(object sender, FormClosingEventArgs e)
{
Cef.Shutdown();
}
}