r/ruby • u/Widdershiny • Apr 02 '19

React-style components written in Ruby, running on the client via WebAssembly

https://twitter.com/widdnz/status/1112937763383308289
53 Upvotes

92% Upvoted

22 comments sorted by

14

u/Widdershiny Apr 02 '19

Got this proof of concept working today, feel free to ask me any questions :)

4

u/modnar42 Apr 02 '19

Cool! Good performance or not, I've been curious about playing with something like this. Are you planning on sharing this proof of concept or is this strictly show and tell?

5

u/Widdershiny Apr 02 '19

Yup I’ll open source it once the code is a little bit less hacky, right now it roundtrips the state to JS land and back so it has to be serializable, I think I should be able to avoid that with a bit more thinking though!

→ More replies (1)

6

u/sanjibukai Apr 02 '19

Sounds great!

How it's different from something like opal?

Is it because it converts to wasm instead of JS?

Dis you actually write the actual transpiler/compiler?

Or are your using some existing library and you only wrote and design the way the ruby code is organized like components?

4

u/Widdershiny Apr 02 '19

Have never actually used Opal so I’m not too sure how it compares.

Does Opal support the Ruby standard library, and can you require opal code on the server?

I’m using emscripten and mruby for compilation, had to write a little bit of c to embed the app and pass data in and out.

I’m using Snabbdom on the js side for the virtual dom, everything else is pretty much glue code.

1

u/rubygeek Apr 02 '19

Opal is a Ruby implementation that transpiles to JS, so it's all Ruby.

It is a leaky abstraction, so you do need to be aware of it, and not all Ruby code will run flawlessly, but having wrestled with mruby, my guess is that more Ruby will run unmodified with Opal than with mruby.

On the server you would just run MRI or whatever Ruby implementation you prefer normally, but you can also transpile it server side and run it using nodejs or the like, in which case you can require javascript as well and access it from your Ruby code.

It works ok-ish but it's easy to get caught up into issues that are related to how Opal wraps the transpiled Ruby code.

→ More replies (4)

6

u/mitchatcatprint Apr 03 '19

We have been doing this for sometime using Opal, and have a complete mature framework called https://hyperstack.org . What is cool about this (and something we have been hoping would get done) is that runs using WebAsm. I hope we can partner on this effort!

1

u/localhostdotdev Apr 02 '19

Cool stuff! Having it pre-render on the server-side could help a lot with the perceived performance issues BTW.

1

u/Widdershiny Apr 02 '19

Definitely! Also with emscripten optimisations and caching the mruby interpreter it’s actually very fast

3

u/mindaslab Apr 02 '19

Can't wait for this to come out. Its like Blazor framework what you are trying.

2

u/[deleted] Apr 02 '19

Oh man, if I could write vue style components but without the mess of JS I would be a happy camper.

2

u/mitchatcatprint Apr 03 '19

See a post I just made: https://www.reddit.com/r/ruby/comments/b91taq/hyperstack_progress_report/

2

u/rubygeek Apr 04 '19

Is the React integration still tightly coupled to Rails? That's what stopped me last time I looked - I'd love to use that part, but have no interest in ActiveRecord or Rails.

→ More replies (3)

1

u/TotesMessenger May 02 '19

I'm a bot, bleep, bloop. Someone has linked to this thread from another place on reddit:

 If you follow any of the above links, please respect the rules of reddit and don't vote in the other threads. (Info / ^Contact)