Electron.js指南——屏幕外渲染

屏幕外渲染

屏幕外渲染使您可以在位图中获取浏览器窗口的内容，因此可以将其渲染到任何位置，例如在3D场景中的纹理上。Electron中的屏幕外渲染使用与Chromium Embedded Framework项目类似的方法。

可以使用两种渲染方式，并且只有脏区域才可以通过， 'paint'以提高效率。渲染可以停止，继续并可以设置帧频。指定的帧速率是一个最高限值，当网页上没有任何事件发生时，则不会生成任何帧。最大帧速率为60，因为在此之上没有好处，只有性能损失。

注意：屏幕外窗口始终创建为无框架窗口。

渲染模式

GPU加速

GPU加速渲染意味着将GPU用于合成。由于必须从需要更高性能的GPU复制帧，因此此模式比另一种模式慢很多。此模式的好处是支持WebGL和3D CSS动画。

软件输出装置

此模式使用软件输出设备在CPU中进行渲染，因此帧生成要快得多，因此，此模式优于GPU加速模式。

要启用此模式，必须通过调用app.disableHardwareAcceleration()API禁用GPU加速 。

用法

const { app, BrowserWindow } = require('electron')

app.disableHardwareAcceleration()

let win

app.whenReady().then(() => {
  win = new BrowserWindow({
    webPreferences: {
      offscreen: true
    }
  })

  win.loadURL('http://github.com')
  win.webContents.on('paint', (event, dirty, image) => {
    // updateBitmap(dirty, image.getBitmap())
  })
  win.webContents.setFrameRate(30)
})