I built a REAL Desktop App with both Tauri and Electron

Summary

In this video, the creator compares Tauri and Electron for building cross-platform desktop applications using web technologies. While Electron is widely used, its large resource consumption and app size are significant drawbacks. Tauri, on the other hand, promises a smaller, faster, and more secure alternative, but faces challenges like inconsistent browser engine support and a smaller community. Through the development of the SolidTime time-tracking app, the creator evaluates both frameworks, ultimately concluding that while Tauri has great potential, Electron remains the more reliable choice for now due to its established ecosystem and cross-platform consistency.

Takeaways

• 😀 Electron is the most popular framework for building cross-platform desktop apps with web technologies, but it has issues like high resource usage and large app sizes.
• 💡 Tauri is a newer alternative to Electron, promising smaller, faster, and more secure apps by using Rust for the backend instead of JavaScript.
• 🛠️ Setting up a Tauri project is easier than Electron, thanks to its built-in support for modern frontend frameworks like Next.js, SvelteKit, and Vite.
• 🔑 Deep Linking is easier to implement with Tauri, as it provides a first-party plugin to handle it, whereas Electron requires more manual work and custom configurations.
• 🚀 Event handling in Tauri is much simpler than Electron, which relies on complex inter-process communication (IPC) involving multiple scripts to pass events.
• 🖥️ Window management in both frameworks is relatively straightforward, but Tauri simplifies it with a configuration file, while Electron requires JavaScript for configuration.
• 💥 Tauri’s builds are significantly smaller than Electron’s because it does not bundle a browser engine (using the system’s default instead), while Electron bundles Chromium, leading to larger app sizes.
• 🔄 Tauri supports using WebKit on macOS and Linux and Blink on Windows, but this can lead to inconsistencies in user experience due to differences in browser engines across platforms.
• ⚠️ Tauri’s smaller community and less mature tooling make troubleshooting more challenging compared to Electron’s large ecosystem, which has extensive resources and community support.
• 💻 Tauri’s build system is limited by the platform it's compiled on and lacks cross-platform building locally, whereas Electron allows for building apps for different operating systems with more ease, provided there are no native dependencies.

Q & A

What are the main reasons people dislike Electron apps?

Electron apps are often disliked due to their heavy resource usage and large app sizes, which can lead to slower performance and increased memory consumption.

Why is Electron still popular despite its drawbacks?

Electron remains popular because it allows developers to use web technologies (HTML, CSS, JavaScript) to build cross-platform desktop apps. This simplifies development and enables code reuse across multiple platforms.

What is Tauri and how does it compare to Electron?

Tauri is a newer framework for building desktop applications with web technologies. Unlike Electron, which bundles Chromium, Tauri uses the system’s native web view, making it smaller, faster, and more secure. Tauri also uses Rust for backend functionality, whereas Electron uses JavaScript.

What were the challenges the developer faced when switching from Electron to Tauri?

The developer faced challenges related to learning Rust (since Tauri uses it for the backend) and dealing with platform-specific behaviors, such as issues with deep linking and window drag areas, which required more troubleshooting in Tauri than in Electron.

How does Tauri handle deep linking compared to Electron?

Tauri offers a built-in plugin for handling deep linking, simplifying the setup process with minimal configuration. In contrast, Electron requires more manual setup with platform-specific handling and uses a preload script to communicate between the backend and frontend.

What is the primary advantage of Tauri's window management system over Electron?

Tauri allows for window configuration through a simple config file without needing to write backend code, offering a more straightforward setup compared to Electron's more complex JavaScript-based window management.

Why is the bundle size of Tauri applications smaller than Electron apps?

Tauri apps have smaller bundle sizes because they don’t bundle a Chromium binary. Instead, Tauri uses the default browser engine installed on the system (like WebKit on macOS, Safari on iOS, and Edge on Windows), whereas Electron includes the entire Chromium engine, making it larger.

What are some of the limitations of using Tauri on different platforms?

Tauri's reliance on the system's default web engine can lead to inconsistencies across platforms, such as different performance and feature support. For example, Tauri uses WebKit on macOS and Linux, which may not support modern web standards as well as Chromium does.

How does the developer handle the issue of cross-platform compatibility in Tauri?

The developer faced issues with platform-specific engines, like WebKit GTK on Linux, and the fact that Safari's WebKit engine on macOS only updates when the OS is updated. This led to potential compatibility problems, especially with newer web features.

What is Tauri's approach to using browser extensions, and how does it compare to Electron?

Tauri does not support browser extensions at all, whereas Electron offers limited support for Chrome extensions. This is a significant disadvantage for developers who rely on extensions for their development workflow.