求教写跨平台的桌面GUI程序,Nodejs的Electron是不是个好的选择?

发布于 1周前 作者 sinazl 来自 nodejs/Nestjs

求教写跨平台的桌面GUI程序,Nodejs的Electron是不是个好的选择?
目前看下来,个人觉得好处好像是,可以直接用网页的 js 代码,很多逻辑可以直接抄袭;
坏处好像这个节点很多人对 electron 嗤之以鼻,可是又没有人总结,也没有人给出更好的解决方案。
是不是 1,安装包太大了? 2,慢?
大家能不能指一条路呢。

62 回复

然而他们很多人都在用 atom 和 vscode。
你有网页的基础,要开发快就用。你应该也知道有什么坑了。ps:面向客户的话先问清楚,我们这边曾经用 electron 开发了客户端,开发完了客户才说 electron 是网站,太 low,不安全云云,于是还用 pyqt 重做。


以前做过简单的开发…嗤之以鼻有一部分原因是中文文档和分享太少。记得云音乐以前好像用的这个

个人项目的话,哪个开发效率高用哪个。

electron 框架在跨平台开发方面已经算比较成熟了,只要你不搞太底层的开发那么坑不大(上次做文件系统被坑惨了)。而且结合社区积累的知识点、解答的问题,应该能度过很多坑了。看你是不是能熟练使用搜索工具了。

1、安装包大。确实是一个问题,但是在 mac 下,其实各个软件体积都还挺大的。或者可以试试这个打包: https://github.com/electron-userland/electron-forge ;但是你的软件有特别要注重体积的应用场景吗?

还有 js 文件暴露的问题。意味着如果你要做一些安全方面的开发,请尽量在后端搞。

2、慢。看你说是哪一方面的了。编程语言? UI 渲染?还是网络请求?如果你不做高密度计算工程,如果慢,那就不是框架的问题。

补充一点:vscode 基于 electron 开发的案例,不能作为普通开发者的参考。

用的 nwjs,react 全家桶配合 node 美滋滋

近期的 GUI 全部用 electron + vue 来开发了。迅速。

至于上面又说中文资料少的,我最鄙视这种人了。资料已经不少了,踩过的坑基本都能找到文档,英文的也看的懂。还拿中文文档说事情的人,你这辈子也就这点出息了。

说 low 的那些客户,我是没遇到过,反而称赞界面更漂亮了,更现代化了。

能够迅速的完成开发,快速迭代,客户能很快的拿到工具开始用,这个已经非常值得了。

赶紧做,别想那么多。

electron is flash for the desktop.

可怕的是 electron 是个初期的 flash(可能刚刚开始), 而不是现在被淘汰的 flash.
当然了, 我觉得用 electron 是现在最好的选择(就像 flash 当时也是最好的选择一样)

当你电脑上有一个 electron 应用的时候你会称赞它, 并且被它的外表所吸引, 可能会嫌弃其他应用.
当你电脑上所有应用都使用 electron 的时候, 一切变得就不那么美好了.

主要看应用类型了,如果是偏向底层的应用软件肯定不合适,如果偏网络应用的,而且大部分在 web 上就能操作的,那这个是最合适了。

electron 适不适合是看你的需求的,如果应用与操作系统结合比较多,对性能要求很高就不太适合,如果只是做一些业务逻辑的东西问题不大,所以先调研一下,别最后做到后面发现有问题解决不了推倒重来就麻烦了,技术调研很重要的,近几年遇到好几家公司就是死在移动客户端上,一开始用 html5 开发 app,到后期快上线了发现有解决不了的问题

Electrom 或者 QML 吧

感谢大家热情回复。
性能要求不高,个人用的管理软件而已,需要一部分网络通讯。

基本上很大一部分操作抄袭网页的逻辑甚至界面。
现在想着能快速做一个东西出来,至少用起来,但是确实觉得 ele 很炫。

感谢提醒 ele+vue

这个具体怎么配置? nwjs 不是已经背 ele 取代了吗
目前自己用,大小倒不是问题。高密度的计算打算用 julia 解决。
再次感谢大家热情回复。

不会谷歌,英文社区一堆,github issues

另外请教一下大家有没有财务管理类的 electron 开源代码可以学习的? git 上有个俄国人写的,觉得不是特别清晰。

取代到不至于,只不过各有优缺点罢了。配置就是 webpack+react 全家桶的单页配置,路由就是 HashRouter 的形式,去掉 webpack 的热更新,其他的和前端开发差不多。

看起来这个配置就较为复杂。如果有清晰的文档还好。不知道 helloworld 环境要搞多久?

现在没人谈 Qt 了吗?

对于开发者当然是好选择……
作为用户,我很不喜欢用 electron 做的桌面程序……

electron 最大的问题还是资源占用,每多开一个 electron app 就相当于多开了一个浏览器。话说现在有没有 C/S 结构的 electron 呢



qt 挺好用的,就是 license 有点贵了。

当然应该用 qml 啊

qt 有免费实现啊

如果有一天满屏都是 electron 桌面,对系统也是考验,项目到后期效率和资源就成了关键了。qt 和 electron 都尝试下看看,谢谢大家。

曾经技术选型考虑过 Electron,不支持 XP,只能换用 NW.js

业务需求决定技术选型

曾经我想用一个开源项目,但作者只放出了源码。
所以我只能 git clone。
只是当我 npm i 的时候,electron 一直 i 不了,三四次之后我就放弃了,直接转找其他 qt 打包好的。。。

借楼请问一下,electron 可以开发类似$$或者网游加速器之类的应用么。
看了下文档,只看到了针对渲染进程的 session 有使用代理的方式( session.setProxy ),没看到能监听系统网络的 API。

为什么这条回复有种翻译腔在里面的感觉 哈哈哈哈

告诉你我们遇到一些坑。
node 原生库的多平台 rebuild 麻烦,系统内置的库在某些系统上有可能缺失。
node 进程和浏览器进程通信的 ipc 会阻塞浏览器渲染进程,通信多了就感觉卡。
窗口不 focus 时接收不到点击事件,所以 blur 时无法直接点击自己实现的窗口控制栏按钮关闭。
毕竟是个浏览器,本地交互有权限问题,比如粘贴不能识别为文件只是图片。
mac 下和输入法有兼容性问题,经常 crash,1.7.5 才修复。
调用 windows 通知系统有积压消息问题。
mac 下开关 dock 栏自动隐藏会导致禁止窗口缩放的控制失效。

坐等 PySide2

感谢分享这么多经验。解决这些应该付出很多时间。

看好 electron,不看好 Qt。个人使用下来 Qt 有点老旧(望指正)。

其实关系不大,两者针对的需求不太一样,electron 比较适合偏业务逻辑的应用,对性能稍微有要求的用 electron 开发出来根本没法用,体验很差,除非是垄断行业,否则别人用 Qt 开发出类似的应用,用户全跑了,而 Qt 适合开发各种跨平台的应用,缺点就是开发效率低一点,不过在 symbian 时代后期就已经推出 qml,配合 js 开发效率高了不少,现在很多人都不知道自己电脑里很多应用都是 Qt 开发的,比如游戏平台暴雪的战网和 11 平台、Autodesk 系列、android 官方模拟器及 genymotion、amd 的驱动管理、反编译的 ida pro、播放器 vlc、虚拟机 virtualbox、google 的桌面软件系列、skype 和 yy 语言等等太多了

能不能介绍下学习路径? 目前只是对 python 算熟悉

可以试试 QML 或者 pyqt。另外,Qt 的 QWebEngine 能够调用 Javascript,混合开发还是很方便的。不过,C++来开发,进度的确是慢别人一步。

如果你的应用是偏逻辑的,用 electron 没啥问题,就是安装包比较大,如果写个小工具用它的话就不方便了,一丁点功能就上百兆的体积,如果你用 Qt 的话,要学习 C++,成本有点高,不用 Qt widget 用 qml 还好点,但是 qml 开发的时候遇到一些需要定制的东西还得用 c++封装,尽管这种情况不一定需要,不过你熟悉 Python 所以 PyQt 比较适合你现在的情况,搭建好环境了解一下 Qt 的 Gui 库和信号槽机制,然后对着官方文档就可以开工了,当然坑是少不了的

atom 卡的要死, 居然还有人用

非常感谢您的建议。都是写的自己使用的小程序。

哪里可以看到 qt 或者 qml 的概况、文档,学习路线图?如果有整理过的那就太好了。

对开发人员来说可能是个好选择,但作为用户我最烦这种软件,除非 vscode,否则一律不用

界面写起来太慢了吧。

是好选择。实际上需要一套代码跨平台,除了 electron 和 qt 之外也没有什么好选择了。

重点是不要做成浏览器+网页版那种。

楼上各位都说 vscode 好用,那是因为别人“伪装”成桌面应用很用心,而且优化得基本不卡了。

除了效率之外的另一个问题就是确实文件体积很大。

如果不追求跨平台共用代码的话,分别 native 实现当然是最好的,比如 win 上用 c# 撸一个。

呃,除了 electron 和 qt,你还可以上个 java #滑稽

还有 Java FX( ̄ー ̄)ニヤリ

golang 可以试试

其实自用的小软件,做成服务器加网页的形式就很好,没必要追求 GUI,比如 electron,如果不花很多时间精力去做界面伪装原生软件,也就和打开个网页一模一样,与服务器加网页相比优势不明显,

你这里にやり一下,我 特别怕入坑 java
想着如果越来越大,数据源越来越多,可能也是一个很好的选择。

和 Electron 在看起来“主流”的 Web 开发之类圈子火热相对的是,Qt 这东西在 VFX 圈已经无双了 … Maya,Modo,Nuke,Houdini,Mari,Substance 系列,叫的上名字的,叫不上名字的,打开没个 Qt 都不好意思见人,好像 Max 也换了 Qt 了
这个占有率恐怕能跟 Electron + 浏览器相比,我个人觉得是比 Electron 牛多了
同时这一行现在坠好的语言是 Python,PyQt 和 PySide 当然也跟着鸡犬升天了
当然这些东西对性能的要求比较高,也没啥网络请求,主要是跨平台,风格统一可扩展之类的需求
( Photoshop 和 ZBrush 俩没用 Qt 也没 Linux 版的一旁瑟瑟发抖)

Electron 这东西啥时候能不一个应用都带一个 100 多 M 的 runtime 我就不黑他,浏览器这么一个天然 monolithic 的东西好像解决这个问题很蛋疼 …
恐怕唯一不介意这么大一块破烂进来的软件只有单机游戏了( http://blog.wolfire.com/2009/07/a-webkit-primer-part-1/)


好久不用 Qt 了,还以为 Qt 凉了,还好,还好

golang 哪个界面库比较好用

我觉得你直接从 PyQt 入手学比较好,找 PyQt5 的教程,英语不差的话直接看 python 官方 wiki 的教程,看完 Qt 的 UI 和信号槽部分就可以入手做了,如果你想从 C++开始把 Qt 一整套全部系统学习,周期比较长,受挫感也强,当然时间够的话也可以,毕竟技多不压身

说实话 golang 写界面我只是有了解,据说 go-sciter 不错,也是用 html 写,不过打包差不多就 3M 左右,可以尝试下。大学的时候玩过 mfc 和 wpf,后来实习的时候用 java 写界面,从 swing 到 javafx,感觉 javafx 还不错。再后来自己玩过 nwjs,再到 electron。再后来就搞 web 前端和后台了。感觉 electron 体积确实是个问题,当然如果技术栈用这个或者自己写的玩玩的话就无所谓。

更正一下,公司技术栈。。。

楼主 那个日文看不懂

提到 JavaFX,我今天早上不知道在找什么恰好找到了这贴子
https://reddit.com/r/programming/comments/740bcd/say_no_to_electron_building_a_fast_responsive
里面提到了可以用 Java 9 新的 module system,配合 JavaFX,把 JRE 打包进去

听起来非常“ enterprisey ”,不那么 enterprisey 的是,这套方案应该还没有人用 …

这贴子里面也有 sciter 作者的回复,感觉很厉害
我也赞同他“ UI needs multiple DSLs ”,以及浏览器的路线和方向是对的,但是执行上出了问题导致不适合做 UI 的看法

试试他山框架挺不错的

使用Node.js的Electron来开发跨平台的桌面GUI程序确实是一个很好的选择。Electron是一个开源框架,它允许开发者使用Web技术(HTML、CSS、JavaScript)来构建跨平台的桌面应用程序。以下是一些关键点,说明为什么Electron是一个合适的选择:

  1. 跨平台兼容性:Electron基于Chromium和Node.js,可以在Windows、macOS和Linux等操作系统上运行。开发者可以使用相同的代码库在不同的操作系统上构建应用程序,而不需要为每个操作系统单独开发代码。
  2. 开发效率高:Electron让前端技术人员可以利用已经掌握的前端技术(如Vue、Angular、React等)快速开发桌面应用。它提供了丰富的工具和插件,帮助开发者解决跨平台开发过程中遇到的各种问题。
  3. 性能与稳定性:通过优化,Electron可以做到良好的性能和稳定性。虽然其打包体积和内存占用相对较大,但随着网络环境和磁盘存储能力的提升,这些问题对用户的影响越来越小。

以下是一个简单的Electron应用程序示例代码:

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

function createWindow() {
  const win = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true
    }
  });

  win.loadFile('index.html');
}

app.on('ready', createWindow);

这个示例展示了如何创建一个基本的Electron窗口,并加载一个HTML文件。

回到顶部