Electron实践第二天

简介: Electron实践第二天

1.chrome多进程模型


每个标签都有自己的进程

image.png


2.主进程


每个 Electron 应用都有一个单一的主进程,作为应用程序的入口点。 主进程在 Node.js 环境中运行,这意味着它具有 require 模块和使用所有 Node.js API 的能力。


3.窗口管理


主进程的主要目的是使用 BrowserWindow 模块创建和管理应用程序窗口。


BrowserWindow 类的每个实例创建一个应用程序窗口,且在单独的渲染器进程中加载一个网页。 您可从主进程用 window 的 webContent 对象与网页内容进行交互。


const { BrowserWindow } = require('electron')
const win = new BrowserWindow({ width: 800, height: 1500 })
win.loadURL('https://github.com')
const contents = win.webContents
console.log(contents)


4.应用程序生命周期


主进程还能通过 Electron 的 app模块来控制您应用程序的生命周期。 该模块提供了一整套的事件和方法,可以使你添加自定义的应用程序行为 ( 例如:以编程方式退出您的应用程序、修改程序坞或显示关于面板 ) 。

// quitting the app when no windows are open on non-macOS platforms
app.on('window-all-closed', function () {
  if (process.platform !== 'darwin') app.quit()
})


5.渲染器进程


  • 以一个 HTML 文件作为渲染器进程的入口点。
  • 使用层叠样式表 (Cascading Style Sheets, CSS) 对 UI 添加样式。
  • 通过 <script> 元素可添加可执行的 JavaScript 代码。


6.预加载脚本


预加载(preload)脚本包含了那些执行于渲染器进程中,且先于网页内容开始加载的代码 。 这些脚本虽运行于渲染器的环境中,却因能访问 Node.js API 而拥有了更多的权限。


预加载脚本可以在 BrowserWindow 构造方法中的 webPreferences 选项里被附加到主进程。

const { BrowserWindow } = require('electron')
//...
const win = new BrowserWindow({
  webPreferences: {
    preload: 'path/to/preload.js'
  }
})
//...


目录
相关文章
|
7月前
|
缓存 JavaScript 前端开发
从零开始的抢购脚本开发-油猴开发教程(多快好省)
从零开始的抢购脚本开发-油猴开发教程(多快好省)
160 0
|
2月前
|
JavaScript API 开发者
十分钟 带你强势入门 vue3
十分钟 带你强势入门 vue3
66 1
|
4月前
|
小程序
关于我花了一个星期学习微信小程序开发、并且成功开发出一个商城项目系统的心得体会
这篇文章是作者关于学习微信小程序开发并在一周内成功开发出一个商城项目系统的心得体会,分享了学习基础知识、实战项目开发的过程,以及小程序开发的易上手性和开发周期的简短。
关于我花了一个星期学习微信小程序开发、并且成功开发出一个商城项目系统的心得体会
|
7月前
|
缓存 JavaScript
Nodejs第三天
Nodejs第三天
|
Android开发
Cocos Creator 花了一个月入门经历
一个与人入门算是最笨的那种了吧 分享给大家入门视频教程
863 0
Cocos Creator 花了一个月入门经历
|
7月前
|
前端开发 JavaScript
CPU都被干冒烟了,拥抱HarmonyOS第二天,自定义组件(下)
CPU都被干冒烟了,拥抱HarmonyOS第二天,自定义组件
|
7月前
|
前端开发 JavaScript 数据管理
CPU都被干冒烟了,拥抱HarmonyOS第二天,自定义组件(上)
CPU都被干冒烟了,拥抱HarmonyOS第二天,自定义组件
|
API iOS开发 MacOS
关于electron升级调研的心得笔记
关于electron升级调研的心得笔记
417 0
关于electron升级调研的心得笔记
|
前端开发
前端学习笔记202303学习笔记第五天-了解vite项目的运行流程1
前端学习笔记202303学习笔记第五天-了解vite项目的运行流程1
73 0
|
前端开发
前端学习笔记202303学习笔记第五天-了解vite项目的运行流程2
前端学习笔记202303学习笔记第五天-了解vite项目的运行流程2
70 0

热门文章

最新文章