electron如何解决白屏问题

Posted 2023-03-10

参考技术A electron白屏问题主要出现在两方面：

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

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

1中可设置electron自带的transparent属性进行处理。

2中问题可通过提高首屏渲染速度

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

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

步骤：

1、预加载browserWindow，设置show:false。

因为该窗口只是隐藏，并不是关闭，所以内部的html地址仍然会加载执行。

2、但是，在mac的多桌面、mac与windows的多扩展屏会出现，show窗口的时候。

窗口只会出现在第一次创建的窗口的桌面；

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

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

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

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

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