Image by LUM3N from Pixabay

Last year we welcome a new library to make UI components using native widgets called libui. It's written in C++, and has bindings with Node, called libui-node, effectively allowing to develop desktop native applications with Javascript. Using libui-node two projects went live, one supporting Vue (Vuido) and other supporting React (Proton Native). Both use the same library, but neither is developed for the same team. Each one has a different team and a different approach.

Recently, a new Node library with Node bindings for creating UI components was announced, NodeGUI. But the team wasn't creating a new widget library, instead, their goal it's to target bindings of Qt5 widgets. However, it's not the first project to bind Qt widgets in Node, that honor belongs to node-qt, but the project was left behind. The same team provides a React library to work with NodeGUI, conveniently named React NodeGUI. Additionally, another developer is making a library that makes NodeGUI work with Angular, ng-qt.

Goal

libui / node-libui

The libui motto is a portable GUI library for C, so that might give us an idea of what to expect with this. It uses native widgets on each system, with the performance expected of doing so. It has bindings for several platforms, including .NET, Node, Kotlin, and Go but only the last one its develop by the same guy, (ui). All others are being developed by the community, and I think that's not as good as being developed by the same guy/team, but it's ok. As I said earlier, the node library that does the binding is libui-node, and its goal seems to be a Node wrapper for the C++ widgets of libui. Because libui provides native widgets, libui-node only requires the normal node runtime to be able to call those widgets.

NodeGUI

I think the team behind NodeGUI is more modest, as they have one clear goal, to bind Qt5 widgets with node. However, it seems they push a way to have this in the best performance-wise way. They have a fork of regular Node runtime, that merges the event loop of Qt and Node, called qode. With that, you can use the power of both event loops.

Status

libui / node-libui

As the readme says, it supposed to be pre-alpha, meaning not near to be stable, and the project has not been updated in a while. It currently has 3944 commits, 138 open issues, and 63 open pull requests. In the mid-time, node-libui it's as stable as its big brother. Still, you can build something around that. I have not tried anything big but it seems to be fine.

NodeGUI

Itself is very recent, and it's currently actively updated, but it's hard to say if it will keep going like that. The project seems more stable than node-libui, but that's also because they use a stable widget platform. I think the real deal here is Qode, the one tool that powered all this. It currently has 323 commits, 9 open issues, and 1 open PR. Additionally, it has a project board with 6 tasks in To-Do.

Additional renderers

Being able to render just using JavaScript it's good, but be able to use the same platform that you are used to, it's so much better without a doubt.

node-libui

Viudo

This is a node-libui renderer for Vue, developed by mimecorg. It supports declaring custom elements, using them with as syntax. I have to say, that's the first one I tried, and I did it when it just went out. It's easy to use and integrates very well with Vue. It has a CLI template that allows you to use @vue/cli to create the project.

Proton-Native

I don't know why it's called that way, but it's a renderer to React. It's being developed by kusti8. It seems to support all React tools, like Redux and such. It has a CLI tool called create-proton-app that resembles the create-react-app tool.

NodeGUI

React NodeGUI

This is the official library for React and NodeGUI. You don't have a CLI here, so you have to clone an empty repository to start using it. It supports styling with CSS-like syntax, and it supposed to work with all the React plugins out there. It also has support for TS out of the box.

NG-QT

It's developed by marcus-sa. It aims to be an Angular renderer compatible with NodeGUI. So far it supports some components, but still, have some issues to be resolved.

Build tools

node-libui

Proton-Native has a build system based on electron-builder, but it didn't work for me, because it doesn't support Windows. The team behind Vuido has developed a build tool called launchui-packager. It did work, but only with Vuido based project, although it supposed to work with Proton-Native, it didn't. I don't know if it is because Proton-Native itself doesn't support Windows, that it should. Both approaches are just packaging the project with an embedded node runtime, and the native modules from libui

NodeGUI

The team is working on the build system. I think this is harder to be implemented, but it could be a better system than the two node-libui have, because it could be a complete build tool, and embedded with the Qode run time.

What to choose?

I don't think you can choose any. Both are very experimental projects that look more like a declaration of intention than something you could use for production applications. However, NodeGUI seems to be faster in terms of development, but again, it lacks a proper build system to be able to distribute your application.

That's all folks!

Thank you for reading. I hope you have liked it, and you find it helpful.

Have you experimented with any of the technologies that I did mention? Tell me about your experiences in the comments below.