I'd been planning to do this one for a while. It's a proof of concept for a
front-end web framework in Go that feels like Vue.js and uses WebAssembly. My intention here is not that I just HAVE to write code in Go, but because I just want to skip all the bullshit involved in a modern JavaScript app stack. I want hot reloading, I want components, but I don't want a project that has hundreds of dependencies, the Webpack rat nest, and all that. Plus, then Go projects that need a simple frontend can just be written in Go like the rest of the project.
Now, I've looked into this before thinking about a React-like framework. It turns out one exists for Gopherjs, and Gopherjs is built around an API that can nearly be replaced for the syscall/js API that you get when you compile to WebAssembly. However, swapping out that API doesn't Just Work yet, and it turns out I don't really like what React looks like in Go. You don't have JSX, so they do these nested function calls to generate bits of HTML. If we can't get inline JSX, I'd rather it just be a template.
Vue.js is another modern framework that gives you the same React style components, but built on top of a powerful Vue instance primitive. The way you create Vue instances felt a lot like how you'd create a new struct in Go, so it already seemed like it would feel better.
Last week I put together a simple proof of concept that implements the Vue.js template syntax in Go. Unlike Vue, it renders out HTML instead of building out a DOM, but that could be swapped out later if we need to go that way. I've always been a fan of template engines that embed directives in the HTML elements, so, if nothing else, it might be nice to just have this Vue.js template engine in Go.
I also did some WebAssembly prototypes, making sure I could compile a simple Go program to WebAssembly and playing around with the syscall/js API. The server to serve this up I turned into a watcher that will recompile the WASM code and then tell the page to refresh via WebSocket. It takes a while for the webassembly binary to load, but otherwise it's pretty fast.
Then, I organized these pieces into a Vue instance so I could do a struct in Go and call Mount on it. Data is not reactive, and methods are a work in progress, but I did get them to be used as an event handler; changing state in the Vue instance and re-rendering.
There are a lot of shortcuts here, I'm just trying to see how far I can get
to see how it feels. At some point I'll start over and build the thing right if it makes sense to actually build this thing. I feel like it might.
So that's it, let me know what you think or if you have any questions. Subscribe if you'd like to keep following along, or follow me on Twitch. thanks for watching
Top comments (8)
It makes sense to actually build this thing!
I love Vue and I love Go, the combination would be awesome :-)
FYI
It made sense to somebody else too ...
github.com/norunners/vue
Also create something similar to the library you are sharing
gitlab.com/AndrusGerman/vuego ,a pretty spartan wrapper since I didn't want to complicate the project but with many climbing facilities. With support of routes, components and custom parameters (Vuetify etc).
Hey Jeff,
couple of month ago I had the exact same idea (go wasm vue) and thought it was good because shrinking the tech stack reduces costs and WASM brings additional potential.
If we had hot reloading, reactivity, virtual rendering/DOM and templating in one web frontend framework written in go that would be pretty nice.
A go web API server could be its companion.
In this scenario a dev could concentrate on improving his/her go skills and only needs DB-querying and CSS skills alongside (and that'd be all needed for a reactive database driven web application)
Nice you've found the time for this POC, keep it up and make the repo public ;)
Hi there,
This would be awsome to get rid of the JS and have golang all over the place ;)
If we would have a vue like framework in GO that would be great !
Looking forward to play with it.
Is there a github, where we can try it ?
Have fun
Really cool experiment!
Thanks!
amazing idea !! keep it live please.