首页 > 解决方案 > Electron:更快的“加载屏幕”窗口

问题描述

我有一个 Electron 应用程序,我正在尝试尽可能优化启动。我的主要文件是:

const { app, BrowserWindow, ipcMain, dialog } = require("electron")
const path = require("path")
const url = require("url")

let mainWindow = null
let loadingScreen = null
    
const createLoadingScreen = () => {
  loadingScreen = new BrowserWindow({
    useContentSize: true,
    width: 600,
    height: 350,
    frame: false,
    transparent: true,
  })

  loadingScreen.setResizable(false)

  const startURL = url.format({
    pathname: path.join(__dirname, "loading.html"),
    protocol: "file:",
    slashes: true,
  })

  loadingScreen.loadURL(startURL)
  loadingScreen.on("closed", () => (loadingScreen = null))

  loadingScreen.webContents.on("did-finish-load", () => {
    loadingScreen.show()
  })
}

createMainWindow = () => {
  mainWindow = new BrowserWindow({
    useContentSize: true,
    width: 1400,
    minWidth: 1200,
    height: 870,
    minHeight: 870,
    title: "MyApp",
    webPreferences: {
      nodeIntegration: true,
      enableRemoteModule: false,
      enableWebSQL: false,
    },
    show: false,
  })

  mainWindow.setMenu(null)

  const startUrl =
    process.env.ELECTRON_START_URL ||
    url.format({
      pathname: path.join(__dirname, "index.html"),
      protocol: "file:",
      slashes: true,
    })

  mainWindow.loadURL(startUrl)

  mainWindow.on("ready-to-show", () => {
    /// when the content has loaded, hide the loading screen and show the main window
    if (loadingScreen) {
      loadingScreen.close()
    }
    mainWindow.show()
  })
}

app.once("ready", () => {
  createLoadingScreen()
  createMainWindow()
})

app.on("window-all-closed", () => app.quit())

app.on("activate", () => {
  if (mainWindow === null) createMainWindow()
})

应用程序启动时间如下:

App Ready: 0.057 seconds
Loading Screen Display: 2.437 seconds
Main Screen Display: 3.466 seconds

正如您所见,Electron 在 0.057 秒时“准备就绪”,但是,创建我的超级简单(单张图像)HTML 启动页面需要将近 2.5 秒,然后再加载主应用程序需要一秒钟。

我的愿望是找到一种方法,至少让我的启动画面尽快启动,以便用户至少知道应用程序正在加载——它目前只是坐在那里提示用户再次单击图标。

是否有任何技巧可以在 2.5 秒内创建初始页面?

我正在运行以下系统:

Window 10 Pro (Build 18363)
32GB RAM
Intel Xeon W-2145 CPU @ 3.7Ghz (16 CPUs)
NVIDIA Quadro P2200

提前致谢!

标签: electronelectron-builder

解决方案


推荐阅读