Wails is a project that allows you to write desktop applications using Go and web technologies. It can be seen as a fast and lightweight alternative to Electron for Go. With its rich modern frontend, you can easily build applications using the flexibility and powerful features of Go.

In the previous AsBot client, Xiaoz used Wails technology for development.

Wails Features

• Native menus, dialogs, themes, and transparency
• Support for Windows, macOS, and Linux
• Built-in templates for Svelte, React, Preact, Vue, Lit, and Vanilla JS
• Easy calling of Go methods from JavaScript
• Automatic conversion of Go structs to TypeScript modules
• No need for CGO or external DLL on Windows
• Real-time development mode using Vite
• Powerful command-line tools for creating, building, and packaging applications
• Rich runtime library
• Applications built with Wails are compatible with Apple & Microsoft stores

When to Choose Wails

When it comes to cross-platform client development, Electron is the first choice that comes to mind. Electron is the preferred choice for cross-platform client development, and many well-known software, such as VScode and the refactored version of Tencent QQ, are developed using Electron. However, Electron also has some disadvantages, such as high memory usage, large application size, and the need to be familiar with Node.js. If you cannot tolerate these disadvantages and meet the following conditions, you can consider using Wails.

Suitable scenarios:

1. Developing simple clients
2. Being familiar with the Go programming language
3. Being familiar with a frontend framework, such as Vue3

If you meet the above requirements, you can definitely use Wails to develop cross-platform clients. But if you are not familiar with the above technology stack, I do not recommend choosing Wails because the learning curve may be higher than Electron.

Getting Started with Wails

When Xiaoz used Wails for development, he used Vue3 as the frontend technology, but Wails supports not only Vue3 but also Svelte, React, and others.

Requirements:

• Go 1.18+
• NPM (Node 15+)

To install Wails, refer to the documentation: Wails Installation

Getting Started

After successfully creating a Wails project, you can start frontend development in the frontend directory. If you are using Vue3 as the frontend technology, you usually need to use JavaScript libraries such as Vue Router, Pinia, and axios together.

Then choose a Vue 3 UI component library that you are familiar with, such as Element Plus.

Options

If you need to modify application parameters, you can set them in main.go, such as default window size and title. For more details, refer to the official documentation: Application Options

Frontend and Backend Communication

If you want to call backend methods provided by Golang in the frontend, you can write your own methods in app.go. For example:

// Scan files and store them
func (a *App) ScanFiles(path string) string {
   result := controller.Scan(path)
   return result
}

To call the ScanFiles() method in the frontend, you need to import it first:

import { ScanFiles } from "../../wailsjs/go/main/App.js"

Then call it:

ScanFiles(path.value)
   .then((res) => {
       console.log(res)
   })
   .catch((err) => {
       console.log(err)
   })

I personally find this calling method cumbersome, especially when dealing with complex data. We can also use a different approach and use HTTP for communication, such as using Gin as the backend web service.

Communication with Frontend using Gin

If we use Gin as the web service for the backend, the frontend only needs to make HTTP calls. But there are a few things to note here.

1. Gin framework needs to run before wails.Run(), otherwise, Gin will block Wails.
2. Gin needs to keep running in the background, otherwise, it will also block Wails.

To run Gin in the background, use the following code:

   go func() {
       r.Run(":11280")
   }()

Packaging Wails

Use the command wails build to package it into a binary file. You can also use wails build -upx to compress it using upx to make it more compact. upx is available by default on Windows, but needs to be installed separately on other platforms. In some cases, using upx compression may cause exceptions, so choose according to the actual situation.

If there are any issues with the packaged client and you need to debug it, you can use wails build -debug to compile it, allowing you to use frontend debugging tools.

No Cross-Compilation Support

Wails does not support cross-compilation, which means you cannot package macOS programs on Windows. Therefore, Xiaoz set up a Hackintosh specifically for packaging macOS applications. See: How to Install MacOS on Intel NUC8i5BEH: Tutorial and Experience Sharing.

Pitfalls

Wails does not automatically compile and update after modifying files

The problem is that when creating a project, Wails automatically generates the folder frontend/Views. Note that the Views has a capital "V". On Windows machines, it is case-sensitive. When using Vue Router, pay attention to the case of the path, otherwise, it will not throw an error, but Wails will not compile and update after modifying files.

Conclusion

The emergence of Wails gives us another choice for developing cross-platform clients. Wails is more suitable for developing relatively simple client programs. If you are not familiar with Golang and do not care about factors such as file size, Electron may be more suitable. In any case, the choice should be based on your own situation and scenario.