electron如何解决白屏问题

electron 白屏问题主要出现在两个地方：

(1).electron未加载完毕html，electron自身产生的白色背景；

(2).electron加载html，html处于加载渲染过程中产生的短暂白屏；

解决方案：

方法1：
(1)中可设置electron自带的transparent属性进行处理。

new BrowserWindow({
    transparent: true,//通过设置 transparent 选项为 true，您可以创建一个完全透明的窗口。
    frame:false,
})

(2)中可通过提高首屏的渲染速度

方法2：

但是，(1)中可能会由于设置了app.allowRendererProcessReuse =false;(electron 14已移除)导致设置背景透明失效。

(2)中的首屏渲染也只能无限接近，虽然可以在渲染前通过设置html loading避免白屏的问题，但在一些业务场景中是不符合业务需求的。

步骤：

1、预加载 BrowserWindow，设置show:false。因为该窗口只是隐藏，并不是关闭，所以内部的html地址仍会加载执行。

2、但是在mac的多桌面、mac和Windows的多扩展屏会出现，show窗口的时候。窗口只会出现在第一次创建窗口的桌面；

如何之前拖动过窗口，窗口再次被show时，只会出现在最后拖动完成的位置。

故此，可以采用以下的方法处理问题。

若是通过点击或是触发某个窗口（已经存在）的位置来唤起。

(1)通过设置父子窗口来完成。

childWindow.setParentWindow(parentWindow);

(2)异步解除父子窗口关系。

setTimeout(()=>{
    childWindow.setParentWindow(null);
},0)