Tauri + Svelte = cross-platform native GUI apps compiled to WASM

Tauri is a framework for building tiny, blazing fast binaries for all major desktop platforms. Developers can integrate any front-end framework that compiles to HTML, JS and CSS for building their user interface. The backend of the application is a rust-sourced binary with an API that the front-end can interact with - github

Tauri looks interesting, one to follow and it works with any web framework not just Svelte, but you know me :wink: and Iā€™m not the only one - see this post from the Rust forum:

Tauri aims to be a lightweight alternative to electron. WASM is not there yet, but coming up on the roadmap, see:

https://tauri.studio/en/

I made a template with the basics for a Tauri + Svelte app ready to go:

Convert any web app in five minutes without changing a line of your code. Or build a solid, compact, secure Rust based app and give it a web style front end. It just works! I tried it out with visualisation-lab and could now create a desktop version of any web app in five minutes. See:

4 Likes

Yeh tauri looks super interesting!

Looking forward to seeing more stuff there and eventually getting to dive in :surfing_man:

1 Like

Documentation on Tauri Patterns.

Have a quick browse, they provide several example structures with varying levels of functionality and security for different kinds of cross-platform application. Really nicely explained.

https://tauri.studio/en/docs/usage/patterns/about-patterns

1 Like

I made a template with the basics for a Tauri + Svelte app ready to go:

3 Likes

Update: I took a Svelte web app, my visualisation-lab workbench, which is quite complex, does a lot of web querying using SPARQL, parses and transforms that data and then creates different kinds of visualisation that you can interact with. The result was and a 6MB AppImage. Iā€™m not sure how big it would be in electron but the visualisation-lab bundle is at least half of that.

This required zero modifications to my app code, just putting two pretty separate projects together and a minute rationalising the dependencies in package.json and boom, it just works!!! Doing this with a second app would take me less than five minutes.

4 Likes

Not sure how i missed all this. But very nice @happybeing. I can tell you itā€™d be Ā±60-100MB w/ electron. Hell of a difference.

Super good stuff, great to see. Iā€™ll be digging in here as/when I get back to the fronter end of things!

2 Likes

I think youā€™ve been busy! Wow, 60MB-100MB in electron versus 6MB here is a heck of a difference. Good to know :smile:

1 Like

It is interesting. I believe itā€™s an elaboration of the webview library, which first inspired Tauri. The small executable size is no doubt attractive, but I think it is still a trade-off: from my understanding, itā€™s small only because it uses the browser engine built into each OS, instead of bundling one, and that means it more or less loses some cross-platform consistency, in comparison to the Electron approach. I personally have no experience with either Tauri or Electron, but this kind of trade-off is not uncommon, e.g. the Homebrew vs MacPorts case, where the formerā€™s philosophy is also to take advantage of OS built-in components, which makes it more ā€œeconomicalā€, but comparatively less consistent. Of course different browsers seem to be converging nowadays, including Edge on Windows (used by Tauri). But thereā€™s also Windows 7, on which Edge isnā€™t available, instead itā€™s MSHTML, probably not as modern and standardized. Win7 is no longer officially supported, but I doubt its user base is vanishing anytime soon, so there would have to be a decision for SN Browser to make, whether to give up on those users in terms of consistency.

Iā€™m not making arguments for or against either approach, plus Tauri is still in alpha, so lots can change, this rambling just shows that Iā€™m interested.

I also asked a few questions in Tauriā€™s Discord chat room the other day trying to get something clarified. Well, I havenā€™t got the chance to try things out myself to be sure, but from the discussion (in particular about using IndexedDB in Tauri), it seems that, because a Tauri app doesnā€™t have a standalone browser of its own that is dedicated to hosting the web app, trying to customize IDB or other browser-native data storage (to make it behave like a standalone desktop app that has its own config/profile directory) will likely be tricky, if possible: a Tauri app relying on IDB for data persistence will be essentially like a web app running in the systemā€™s built-in browser, so its data will be stored in that browserā€™s own data directory.

So for SN Browser, which I suppose also makes use of various browser-native storage APIs, how can it customize its own data directory to make it feel like a standalone browser if taking the Tauri approach?

Now I havenā€™t looked into potential workarounds, maybe there are command-line flags for the browser engine to specify where exactly to store the data per web app? Indeed Iā€™m mostly speculating here. Do you guys have experience with this sort of things?

2 Likes

As of May 2021 Tauri has reached 1.0 beta

I havenā€™t played with Tauri since early alpha, but this new release looks really exciting.

Major new features:

WRY (Webview Rendering librarY)

Tauri Alpha used bindings to webview, a C++ library. While these got the job done, they were quite buggy on Windows and were lacking a lot of features we wanted. Weā€™ve replaced these with WRY, a new, pure Rust Webview library we developed for Tauri.

TAO

For the first part of its existence, WRY depended on winit, the amazing Windowing provider for many operating systems. As time went on, however, we also need some advanced features like menubar and system tray which contradicted with their vision, and thus we made the hard decision to fork winit and republish it under a different name: TAO.

This means that the TAuri Organisation controls all first-order dependencies.

Thereā€™s a comment (below the post) discussing storage:

nothingismagick ā€¢ May 14

If you have a rust interface to your NeDB, you can send a message from the WebView and CRUD to your heartā€™s content. Otherwise, we allow you to ship sidecar binaries that you can communicate with using the RPC channels.

PS. Multiple links removed to please forum bot. (New Users may only post two links). See original for details.

3 Likes

I built a very basic safe browser in tauri today using sn_api crate. Never used tauri before but got it up and working in about an hour, super impressive. The binary is small (about 6 MB like @happybeing had). Tauri seems like itā€™ll be a really great basis for a lot of SN stuff.

Nothing published yet, the app is still way too basic, but I hope to experiment with a few things, especially persisting the connection to the network which cli doesnā€™t do, and hopefully get to know the sn_api crate a bit better.

3 Likes

Cool stuff @mav!

I am curious, did you use register_uri_scheme_protocol to load safe:// URLs?

No I havenā€™t tried register_uri_scheme_protocol, but Iā€™ll have a try.

At the moment Iā€™m looking at

  • trying to find a way to make unresolved nrs fail faster, eg safe://not-a-registered-nrs-name fails after about 2 minutes of hanging. Did a lot of digging into safe_network repo yesterday trying to understand why it happens and whether to try fixing it a) at the app b) at the client/api c) at the nodes. The fault tolerance of distributed systems makes it hard to know what is an error vs out-of-sync or temporary state. Anyway thatā€™s for a different topic :sweat_smile:

  • connecting to different networks, or at least showing network info

  • using sn_client vs sn_api vs sn_interface, trying to keep the abstraction consistent

  • designing with future changes in mind (eg fees, authenticator)

3 Likes

Tauri 2.0 is coming, OMG OMG OMGā€¦

Cross platform Safe Apps for desktop and mobile: Windows, MacOS, Linux, Android and iOS.

You can write in Rust, build a web front end in Svelte and be the coolest dev on the planet (for 15 minutes)ā€¦ Who is going to be first? :astonished:

@bzee
@mav I would love to see even a very crude demo of a Safe browser working on those performs, even a SN hello world tbh. Time not permitting me these days :frowning_face:

2 Likes

With the payment-only network on the way Iā€™m really keen to see a wallet app in Tauri be developed. The apis for dbcs and nrs seem pretty stable now (even though the underlying code is changing a lot) so itā€™s probably possible to start making something useful and fairly future-proof for wallets.

2 Likes