7 ms·

Building a web application with Rust and WebAssembly

ozzythecat 4y ago
I was writing web applications back in 1999. If I needed to write a web page or a proper “app” (whatever that means) today, why would I use Rust and Web Assembly? Don’t mean to sound arrogant, but is starting with the highest level of complexity a good idea? > The goal of our application is simple: It's a portal where the victim will enter their credentials (thinking that it's a legitimate form), the credentials are going to be saved in an SQLite database, and then we redirect the victims to an error page to let them think that the service is temporarily unavailable and they should try again later. Again, why do we need Rust for this? And the code example puts mark up directly inside Rust files… why?
- theplumber 4y ago
  Why Rust? Why not Rust? WASM finally gives you the option to use the language you like. Once WASM gets GC support GC languages(i.e Go) will become viable too.
  - ducharmdev 4y ago
    I feel like I've been hearing about WASM GC support for years, but do we have any idea when it will become a reality?
- spicyusername 4y ago
  Because it's fun. Because you can. To see what the limitations are. To see how it compares to other methods of writing web apps. To learn Rust. To learn web assembly. Etc. Not everything needs to be immediately useful or monetizable to be interesting or worth doing.
  - lumost 4y ago
    There are people who will write webassembly apps in Rust because it’s not JS. Given the crates community, there are surely some special purpose apps that are easier to write in rust than JS. Heck for fun I even got pola-rs to run in the browser!
    - dhzhzjsbevs 4y ago
      I've yet to see a good reason for webassembly in the wild. Is anyone using it in production for anything substantial? We have a couple of uses of it but I'm still not convinced it was worth the trade offs and felt mor like someone was having fun with a hammer.
      - Klonoar 4y ago
        WASM is honestly fantastic but it took me awhile to see the benefits. Figma is the usual example. Another good example I learned about recently is StackBlitz, which uses it to run Node in the browser for localhost-less dev environments.
        yesimahuman 4y ago
        One thing about wasm I’m trying to understand: isn’t the bottleneck accessing DOM, WebGL, etc through JS? You’d have to have a workload that stayed away from those operations as much as possible to truly matter performance wise, no?
        FridgeSeal 4y ago
        A couple of years ago now, Mozilla had a blog post where they demonstrated that they could stream the DOM to a WASM blob and they could parse the stream, perform the diffs and updates to the DOM and stream it back, faster than the same operations could be completed in the JS runtime.
        yesimahuman 4y ago
        Interesting, but round trip is that still the case (i.e. performing the diffs and then applying them on the JS/DOM side)? Either way unlocking access to Web APIs from wasm will be transformational if it ever happens.
- paulgb 4y ago
  As someone who uses Rust as my main language, part of the appeal of Rust+yew is “no webpack”. Rust’s build system isn’t necessarily less complex, but it doesn’t drive me batty the way JS compilation does.
  - ducharmdev 4y ago
    I'd recommend you give Vite a try, imo it's a painless replacement for webpack.
  - torstenvl 4y ago
    Webpack? JS compilation? I don't know what either of those things are and I don't know why you'd use them instead of plain HTML and CGI (maybe FastCGI or mod_php if you really want to get fancy). I think what GP is asking is: for those of us who don't follow the latest web development trends, what's the inherent value to this? it isn't clear to an outsider what distinguishes this from just the latest fad? EDIT: I see that webpack is a tool to simplify bundling of JS modules and dependencies in large scale JS projects
    - e63f67dd-065b 4y ago
      - Transpilers: sometimes you need to support old browser versions but want to use newer features - Typescript: one but lesson we’ve learnt over the years is that vanilla JS sucks and when your codebase grows into the >10k loc range it becomes a nightmare without engineering and tools like the typescript compiler - minification: minify your JS, HTML, and CSS - state synchronisation: a big problem with the jquery days was desync, modern web frameworks make it very easy for state and ui to stay in sync - one codebase for web, electron (desktop), mobile (react native). Whether this is a good or bad thing is left as an exercise to the reader - lots more I’m forgetting. For better or for worse, that’s the modern JS toolchain, plain HTML with some JS sprinkled on top just doesn’t cut it for modern webapps anymore
      - torstenvl 4y ago
        I don't follow. Which older browsers? If they're new enough to support WASM, but this development method is so brittle that they already need transpiling to support them, that's a red flag. On the other hand, if you're talking about pre-WASM browsers, I don't understand how Rust + WASM is going to help support them.
- mcdonje 4y ago
  It's a nice little tutorial for getting a couple of basic pieces in place using these technologies. It saves a little legwork for someone who wants to do something that makes better use of the value prop.
- jimmydoreornot 4y ago
  I was a security researcher since 1992. I don't mean to sound arrogant, but why continue to use languages that lead to security holes when we now have a language that it strongly resistant to most of those failings? Rust isn't just type safe or memory safe - eliminating foot-guns was a guiding principle throughout. People hate the borrow checker, but that concept of ownership eliminated broad classes of concurrency bugs. Rust was a godsend for computer security.
  - neya 4y ago
    Security is just one aspect of web application development. Writing in rust doesn’t guarantee an application free of security issues like how writing in another language doesn’t necessarily guarantee an app full of security issues.
    - jimmydoreornot 4y ago
      The odds of correct operation are higher with Rust, and for some people that matters a lot to them. There are plenty of good reasons not to use rust. If your use case doesn't care about security, fine use whatever. Or if time-to-market is critical, use go or whatever. Or if your organization can't handle the risk that when you leave they can't find another good rust developer, then don't use it.
  - closeparen 4y ago
    Memory safety is the main thing though, and people were not normally practicing web development in C. For concurrency safety, there are a number of approaches from functional programming/immutability, to the actor model, to even PHP's shared-nothing architecture. And then there's the whole area of type safety, fancy type systems, dependent types, etc. Rust doesn't seem to be a particular standout for web application correctness in the same way that it is for systems code (where memory safety issues are indeed a huge deal), although you could certainly do worse.
    - dhzhzjsbevs 4y ago
      Wasn't most of Google and eBay written in C/C++? Most of the webs applications were written in C/C++ pre PHP days.
- codegangsta 4y ago
  I generally agree with this. I think the rust community is one of the first to wholly embrace wasm as a compile target, hence what you are seeing. But Wasm does for sure go beyond rust and has some very interesting implications for for future of development IMO
- texodus 4y ago
  I wrote a medium-sized Rust web component with Yew, https://github.com/finos/perspective https://github.com/finos/perspective . I chose Rust/Yew for circumstances unique to my use case (a core data engine already in WASM/C++), and with some prior experience in both web and Rust. It's more complex than Typescript/React development for sure, but I also found it surprisingly capable/comprehensive once you've learned Rust itself, there's very little consolation in the Yew web app development experience outside of the complexity of Rust, and the application model is quite similar to React (wrt to markup in Rust source). It's also quite helpful (in my case) that contributors can work on data-engine and user experience features in the same language, If traditional JavaScript web app development fits your needs, I don't think Rust/Yew makes a compelling case - but in the presence of other performance-abusive requirements, it's a viable web app platform as well.
- root_axis 4y ago
  > why would I use Rust and Web Assembly Why not? It's a fast, general purpose programming language with a solid type system. The article is a programming tutorial, it's not trying to persuade you to rewrite your employer's web stack in rust. > but is starting with the highest level of complexity a good idea Complexity is in the mind of the beholder, if you work with rust often, this is a couple steps above a "hello world" in terms of complexity. Besides, anything that goes beyond string templates and jquery is too complex according to the zeitgeist. > And the code example puts mark up directly inside Rust files… why This is a pretty common approach to "component" style web development, there are quite a few motivations for this but the primary advantage is that it causes markup elements to become first-class entities within your code, allowing your view composition to be checked by the compiler as well as allowing you to design your own reusable markup elements that fold up application level concerns. It's also nice when your views have lexical access to your application state variables so you don't have to pre-render a big string template and interlace it with an explicit map of serialized parameters - it's very nice when the compiler lets you know a view simply cannot display the type of data you're trying to shove into it rather than rendering a broken looking page.
- deleted 4y ago
  [deleted]
- kettlecorn 4y ago
  I wrote a bunch of thoughts on that topic exactly: https://ianjk.com/webassembly-vs-javascript/ https://ianjk.com/webassembly-vs-javascript/ In short: I think Rust / Wasm is great for certain categories of web apps that can benefit from Wasm's portability and performance consistency. But for more traditional web apps and pages there's little advantage.
andsoitis 4y ago
buyer beware: pick the right tool for the job.
- deeptote 4y ago
  Yeah I agree. There's no reason why a front end using TypeScript + React can't use WASM for it's backend connections, but building the entire thing in rust with Yew just seems like a hammer in search of a nail. GopherJS exists but nobody uses it for a reason.
  - gxt 4y ago
    Rust wasm frameworks are red herrings. Wasm-bindgen is the real deal here when used in an immediate-ish way, ie render your page and leave handlers hooked up only for what you need and clear whatever div affected before updating them.
- ilrwbwrkhv 4y ago
  A better tool is imba.io/
tcfhgj 4y ago
Can someone explain how much more or less sense Sycamore makes conceptually in Rust for webapps?
rr808 4y ago
I really expected WASM to support higher level languages like Java, Python or even Visual Basic by now. I dont like JS front ends but Rust/C++ seems worse for front end work.
- IggleSniggle 4y ago
  WASM is still really not appropriate for frontend work. It’s for backend work that happens to run on a client. All the traditional browser stuff is still done on the js side.
- chrismorgan 4y ago
  That was never the intention for WASM—frontend WASM, at least—since all of those languages have heavy runtimes that would need to be shipped, quite apart from the difficulty of arranging their garbage collection techniques. It’s all stuff that can be done (and has been done), but it’s very inefficient by comparison. The situations may improve somewhat in the future with lighter, more WASM-attuned runtimes for the languages in question (especially as WASM gets some degree of GC integration), but they’ll never be as suitable as straight JavaScript or the likes of Rust via WASM.
- lordnacho 4y ago
  For rudimentary GUIs I like rust, specifically the immediate mode lib called egui. It won't be super fancy but you can do enough with it, it feels responsive, and I can show my basic controls without too much effort. Mind you, what I use it for is not sexy at all, really just something one might use a spreadsheet for.
revskill 4y ago
With Rust, we could have new role: System Frontend Engineer ?
- spartanatreyu 4y ago
  We used to call that a Webmaster
orev 4y ago
Very cool to see things like this. It reminds me of the early web when people were experimenting more. Wasm seems to have the potential to open it back up to more possibilities than the moribund JS situation we have now.
winrid 4y ago
If you're gonna do web stuff, a GC is usually worth it... With Nim you can have the same codebase on frontend (compiles to js) and backend, and have it be type checked, and have a potentially very well performing backend.
- drBonkers 4y ago
  Are there any libraries to do real-time collaborative editing (multiplayer mode) in a text form? Implemented via CRDT or transform operations, either or.
  - winrid 4y ago
    Not that I know of. Probably the easiest solution would be to port ShareDB, ShareDB-postgres, and Racer.
- Zababa 4y ago
  You can also have that with Dart, F#, Go, Haskell, Haxe, Java, OCaml, Scala and probably some other languages.

I was writing web applications back in 1999. If I needed to write a web page or a proper “app” (whatever that means) today, why would I use Rust and Web Assembly? Don’t mean to sound arrogant, but is starting with the highest level of complexity a good idea? > The goal of our application is simple: It's a portal where the victim will enter their credentials (thinking that it's a legitimate form), the credentials are going to be saved in an SQLite database, and then we redirect the victims to an error page to let them think that the service is temporarily unavailable and they should try again later. Again, why do we need Rust for this? And the code example puts mark up directly inside Rust files… why?

theplumber 4y ago
Why Rust? Why not Rust? WASM finally gives you the option to use the language you like. Once WASM gets GC support GC languages(i.e Go) will become viable too.
- ducharmdev 4y ago
  I feel like I've been hearing about WASM GC support for years, but do we have any idea when it will become a reality?
spicyusername 4y ago
Because it's fun. Because you can. To see what the limitations are. To see how it compares to other methods of writing web apps. To learn Rust. To learn web assembly. Etc. Not everything needs to be immediately useful or monetizable to be interesting or worth doing.
- lumost 4y ago
  There are people who will write webassembly apps in Rust because it’s not JS. Given the crates community, there are surely some special purpose apps that are easier to write in rust than JS. Heck for fun I even got pola-rs to run in the browser!
  - dhzhzjsbevs 4y ago
    I've yet to see a good reason for webassembly in the wild. Is anyone using it in production for anything substantial? We have a couple of uses of it but I'm still not convinced it was worth the trade offs and felt mor like someone was having fun with a hammer.
    - Klonoar 4y ago
      WASM is honestly fantastic but it took me awhile to see the benefits. Figma is the usual example. Another good example I learned about recently is StackBlitz, which uses it to run Node in the browser for localhost-less dev environments.
      - yesimahuman 4y ago
        One thing about wasm I’m trying to understand: isn’t the bottleneck accessing DOM, WebGL, etc through JS? You’d have to have a workload that stayed away from those operations as much as possible to truly matter performance wise, no?
        FridgeSeal 4y ago
        A couple of years ago now, Mozilla had a blog post where they demonstrated that they could stream the DOM to a WASM blob and they could parse the stream, perform the diffs and updates to the DOM and stream it back, faster than the same operations could be completed in the JS runtime.
        yesimahuman 4y ago
        Interesting, but round trip is that still the case (i.e. performing the diffs and then applying them on the JS/DOM side)? Either way unlocking access to Web APIs from wasm will be transformational if it ever happens.
paulgb 4y ago
As someone who uses Rust as my main language, part of the appeal of Rust+yew is “no webpack”. Rust’s build system isn’t necessarily less complex, but it doesn’t drive me batty the way JS compilation does.
- ducharmdev 4y ago
  I'd recommend you give Vite a try, imo it's a painless replacement for webpack.
- torstenvl 4y ago
  Webpack? JS compilation? I don't know what either of those things are and I don't know why you'd use them instead of plain HTML and CGI (maybe FastCGI or mod_php if you really want to get fancy). I think what GP is asking is: for those of us who don't follow the latest web development trends, what's the inherent value to this? it isn't clear to an outsider what distinguishes this from just the latest fad? EDIT: I see that webpack is a tool to simplify bundling of JS modules and dependencies in large scale JS projects
  - e63f67dd-065b 4y ago
    - Transpilers: sometimes you need to support old browser versions but want to use newer features - Typescript: one but lesson we’ve learnt over the years is that vanilla JS sucks and when your codebase grows into the >10k loc range it becomes a nightmare without engineering and tools like the typescript compiler - minification: minify your JS, HTML, and CSS - state synchronisation: a big problem with the jquery days was desync, modern web frameworks make it very easy for state and ui to stay in sync - one codebase for web, electron (desktop), mobile (react native). Whether this is a good or bad thing is left as an exercise to the reader - lots more I’m forgetting. For better or for worse, that’s the modern JS toolchain, plain HTML with some JS sprinkled on top just doesn’t cut it for modern webapps anymore
    - torstenvl 4y ago
      I don't follow. Which older browsers? If they're new enough to support WASM, but this development method is so brittle that they already need transpiling to support them, that's a red flag. On the other hand, if you're talking about pre-WASM browsers, I don't understand how Rust + WASM is going to help support them.
mcdonje 4y ago
It's a nice little tutorial for getting a couple of basic pieces in place using these technologies. It saves a little legwork for someone who wants to do something that makes better use of the value prop.
jimmydoreornot 4y ago
I was a security researcher since 1992. I don't mean to sound arrogant, but why continue to use languages that lead to security holes when we now have a language that it strongly resistant to most of those failings? Rust isn't just type safe or memory safe - eliminating foot-guns was a guiding principle throughout. People hate the borrow checker, but that concept of ownership eliminated broad classes of concurrency bugs. Rust was a godsend for computer security.
- neya 4y ago
  Security is just one aspect of web application development. Writing in rust doesn’t guarantee an application free of security issues like how writing in another language doesn’t necessarily guarantee an app full of security issues.
  - jimmydoreornot 4y ago
    The odds of correct operation are higher with Rust, and for some people that matters a lot to them. There are plenty of good reasons not to use rust. If your use case doesn't care about security, fine use whatever. Or if time-to-market is critical, use go or whatever. Or if your organization can't handle the risk that when you leave they can't find another good rust developer, then don't use it.
- closeparen 4y ago
  Memory safety is the main thing though, and people were not normally practicing web development in C. For concurrency safety, there are a number of approaches from functional programming/immutability, to the actor model, to even PHP's shared-nothing architecture. And then there's the whole area of type safety, fancy type systems, dependent types, etc. Rust doesn't seem to be a particular standout for web application correctness in the same way that it is for systems code (where memory safety issues are indeed a huge deal), although you could certainly do worse.
  - dhzhzjsbevs 4y ago
    Wasn't most of Google and eBay written in C/C++? Most of the webs applications were written in C/C++ pre PHP days.
codegangsta 4y ago
I generally agree with this. I think the rust community is one of the first to wholly embrace wasm as a compile target, hence what you are seeing. But Wasm does for sure go beyond rust and has some very interesting implications for for future of development IMO
texodus 4y ago
I wrote a medium-sized Rust web component with Yew, https://github.com/finos/perspective https://github.com/finos/perspective . I chose Rust/Yew for circumstances unique to my use case (a core data engine already in WASM/C++), and with some prior experience in both web and Rust. It's more complex than Typescript/React development for sure, but I also found it surprisingly capable/comprehensive once you've learned Rust itself, there's very little consolation in the Yew web app development experience outside of the complexity of Rust, and the application model is quite similar to React (wrt to markup in Rust source). It's also quite helpful (in my case) that contributors can work on data-engine and user experience features in the same language, If traditional JavaScript web app development fits your needs, I don't think Rust/Yew makes a compelling case - but in the presence of other performance-abusive requirements, it's a viable web app platform as well.
root_axis 4y ago
> why would I use Rust and Web Assembly Why not? It's a fast, general purpose programming language with a solid type system. The article is a programming tutorial, it's not trying to persuade you to rewrite your employer's web stack in rust. > but is starting with the highest level of complexity a good idea Complexity is in the mind of the beholder, if you work with rust often, this is a couple steps above a "hello world" in terms of complexity. Besides, anything that goes beyond string templates and jquery is too complex according to the zeitgeist. > And the code example puts mark up directly inside Rust files… why This is a pretty common approach to "component" style web development, there are quite a few motivations for this but the primary advantage is that it causes markup elements to become first-class entities within your code, allowing your view composition to be checked by the compiler as well as allowing you to design your own reusable markup elements that fold up application level concerns. It's also nice when your views have lexical access to your application state variables so you don't have to pre-render a big string template and interlace it with an explicit map of serialized parameters - it's very nice when the compiler lets you know a view simply cannot display the type of data you're trying to shove into it rather than rendering a broken looking page.
deleted 4y ago
[deleted]
kettlecorn 4y ago
I wrote a bunch of thoughts on that topic exactly: https://ianjk.com/webassembly-vs-javascript/ https://ianjk.com/webassembly-vs-javascript/ In short: I think Rust / Wasm is great for certain categories of web apps that can benefit from Wasm's portability and performance consistency. But for more traditional web apps and pages there's little advantage.

andsoitis 4y ago

buyer beware: pick the right tool for the job.

deeptote 4y ago
Yeah I agree. There's no reason why a front end using TypeScript + React can't use WASM for it's backend connections, but building the entire thing in rust with Yew just seems like a hammer in search of a nail. GopherJS exists but nobody uses it for a reason.
- gxt 4y ago
  Rust wasm frameworks are red herrings. Wasm-bindgen is the real deal here when used in an immediate-ish way, ie render your page and leave handlers hooked up only for what you need and clear whatever div affected before updating them.
ilrwbwrkhv 4y ago
A better tool is imba.io/

tcfhgj 4y ago

Can someone explain how much more or less sense Sycamore makes conceptually in Rust for webapps?

rr808 4y ago

I really expected WASM to support higher level languages like Java, Python or even Visual Basic by now. I dont like JS front ends but Rust/C++ seems worse for front end work.

IggleSniggle 4y ago
WASM is still really not appropriate for frontend work. It’s for backend work that happens to run on a client. All the traditional browser stuff is still done on the js side.
chrismorgan 4y ago
That was never the intention for WASM—frontend WASM, at least—since all of those languages have heavy runtimes that would need to be shipped, quite apart from the difficulty of arranging their garbage collection techniques. It’s all stuff that can be done (and has been done), but it’s very inefficient by comparison. The situations may improve somewhat in the future with lighter, more WASM-attuned runtimes for the languages in question (especially as WASM gets some degree of GC integration), but they’ll never be as suitable as straight JavaScript or the likes of Rust via WASM.
lordnacho 4y ago
For rudimentary GUIs I like rust, specifically the immediate mode lib called egui. It won't be super fancy but you can do enough with it, it feels responsive, and I can show my basic controls without too much effort. Mind you, what I use it for is not sexy at all, really just something one might use a spreadsheet for.

revskill 4y ago

With Rust, we could have new role: System Frontend Engineer ?

spartanatreyu 4y ago
We used to call that a Webmaster

orev 4y ago

Very cool to see things like this. It reminds me of the early web when people were experimenting more. Wasm seems to have the potential to open it back up to more possibilities than the moribund JS situation we have now.

winrid 4y ago

If you're gonna do web stuff, a GC is usually worth it... With Nim you can have the same codebase on frontend (compiles to js) and backend, and have it be type checked, and have a potentially very well performing backend.

drBonkers 4y ago
Are there any libraries to do real-time collaborative editing (multiplayer mode) in a text form? Implemented via CRDT or transform operations, either or.
- winrid 4y ago
  Not that I know of. Probably the easiest solution would be to port ShareDB, ShareDB-postgres, and Racer.
Zababa 4y ago
You can also have that with Dart, F#, Go, Haskell, Haxe, Java, OCaml, Scala and probably some other languages.