
Vugu: Experimental library for web UIs written in Go and targeting WebAssembly - bradpeabody
https://github.com/vugu/vugu
======
bradpeabody
I put this together as a prototype of what it would look like if we had
something like .vue files that were converted to Go, built to WebAssembly. So
far I don't hate it.

It's basically a go-generate-time tool that parses a .vugu file similar to a
vue file but the expressions in it are Go code. It spits out a big function
that, when run, produces the resulting virtual DOM - with conditionals, loops,
etc.

Some tooling helps with this so you can rebuild automatically on page load and
so forth, but the above is the basic idea. Curious what people think.

~~~
kej
This is cool, it's kind of like Blazor [0] in the .Net world although I bet
the resulting code is a lot smaller.

If I can make a suggestion, though, the "root.vugu" code snippet from step 3
on the Getting Started page should be one of the first things in README.md and
on the vugu.org page. It gets the core idea across right away, just like the
code editor at the top of golang.org quickly shows what the language is like.

[0] [https://blazor.net/](https://blazor.net/)

~~~
bradpeabody
Thanks for the tip, I agree. I'm thinking of making a "playground" also, which
would help with quickly showing how it works and allowing people to fiddle
with it easily.

------
nepeckman
I think WebAssembly frameworks are the next step in the evolution of web ui. I
don't think React / Vue / Angular are likely to be unseated by another
JavaScript framework, as everyone is mostly satisfied with at least one of the
3. A new framework needs to offer significant advantages to justify the
switch, and WebAssembly can do this with better performance and better
languages. It's exciting to watch the first experimental releases of these new
frameworks!

------
loudmax
Not just web. There are a lot of efforts getting WebAssembly to run outside
the browser. This could be an alternative to Electron for cross platform
desktop applications.

Depending on use case, WebAssembly might even be an alternative to Java on
servers. Go already supports cross platform compilations, so the use case for
Go on WebAssembly on a server isn't as obvious. At least, not for those of us
who value simplicity or performance. On the other hand, most of us didn't see
Javascript on servers coming either, so I wouldn't rule it out.

------
Gys
> No node_modules folder competing with your music library for disk space.

Love it already

------
abhinai
This is absolutely fascinating. I think the world has come a full circle!
While HTML5 and Javascript are great tools, I remember how back in the day you
had a wide choice of which language you wanted to use to build an app. The
world would be a much better place if that kind of choice were to become
available again and this project gives me hope that we are headed in that
direction.

------
52-6F-62
I'm intrigued by this as I've been teaching myself some Go recently (to see if
I could get over my initial distaste for it).

I've been enjoying the process, so this subject interests me but I'm running
into a long series of errors when starting the tutorial dev server.

    
    
        github.com/vugu/vugu@v0.0.0-20190329041623-36c2913f3f3c/env-js.go:23:16: undefined: js.Func
        github.com/vugu/vugu@v0.0.0-20190329041623-36c2913f3f3c/env-js.go:28:15: undefined: js.FuncOf
        github.com/vugu/vugu@v0.0.0-20190329041623-36c2913f3f3c/env-js.go:107:34: js.Global().Get("document").Truthy undefined (type js.Value has no field or method Truthy)
        github.com/vugu/vugu@v0.0.0-20190329041623-36c2913f3f3c/env-js.go:152:19: mountParentEl.Truthy undefined (type js.Value has no field or method Truthy)
        github.com/vugu/vugu@v0.0.0-20190329041623-36c2913f3f3c/env-js.go:165:16: mountChild1.Truthy undefined (type js.Value has no field or method Truthy)
        github.com/vugu/vugu@v0.0.0-20190329041623-36c2913f3f3c/env-js.go:309:8: n.Truthy undefined (type js.Value has no field or method Truthy)
        github.com/vugu/vugu@v0.0.0-20190329041623-36c2913f3f3c/env-js.go:680:8: el.Truthy undefined (type js.Value has no field or method Truthy)
        github.com/vugu/vugu@v0.0.0-20190329041623-36c2913f3f3c/env-js.go:759:19: oldKeyJSVal.Truthy undefined (type js.Value has no field or method Truthy)
        github.com/vugu/vugu@v0.0.0-20190329041623-36c2913f3f3c/env-js.go:810:7: v.Truthy undefined (type js.Value has no field or method Truthy)
        github.com/vugu/vugu@v0.0.0-20190329041623-36c2913f3f3c/env-js.go:813:51: firstChild.Truthy undefined (type js.Value has no field or method Truthy)
        github.com/vugu/vugu@v0.0.0-20190329041623-36c2913f3f3c/env-js.go:813:51: too many errors
    
    

Have any insight?

~~~
shurcooL
What version of Go are you using? It sounds like an older one. Try the latest
(1.12.x).

The syscall/js API is still in development and undergoing API changes. It’s
not stable like the rest of Go’s standard library.

~~~
52-6F-62
I'm on Go 1.11.5. I'll try updating and see if it will work then.

edit: Updatd to 1.12—no dice. Many of the errors did go the way of the
buffalo, but a couple remain:

    
    
        2019/03/29 11:08:37 Error from compile: exit status 2 (out path="/var/folders/lp/d1rds9q57wqdmgchmzjjrh3hfsm71q/T/main_wasm_237110380"); Output:
        # example.com/test/testapp
        ./root.go:11:13: undefined: RotData
        ./root.go:37:30: data.Toggle undefined (type *RootData has no field or method Toggle)
        ./root.go:47:8: data.Toggle undefined (type *RootData has no field or method Toggle)

~~~
seankimdesign
I'll take a wild guess and say there might be a typo on the word _RotData_

~~~
52-6F-62
Appears that way. `root.go` is a file generated by the framework. Thought
passing the errors along would be of some value...

------
hansflying
Another option to consider is Blazor:

[https://blazor.net/](https://blazor.net/)

[https://www.youtube.com/watch?v=0RfUPr0KrSM&t=836s](https://www.youtube.com/watch?v=0RfUPr0KrSM&t=836s)

I didn't try it yet, but it looks very promising and I hope I will be able to
use C# or F# for client side programming, because it's hard to master a new JS
framework every 3 months or so and I already have JS fatigue.

~~~
akmittal
JS framework battle has been settled from a while. React has won and I dont
see that changing soon. Vue and Angular are fighting for second place.

~~~
pjmlp
That is regional. Here on the office battle takes place between Angular, Vue
and vanilla JS.

------
revskill
Webassembly seems like the solution that could bring all communities together.
Imagine i could use a C++ library, to use with a Rust UI library. All in the
same runtime environments. This could be the dream.

~~~
pjmlp
Just like I use a C++ library with a C#, VB, F#, JS, Python, Component Pascal,
Eiffel.... UI library....

------
dharma1
Some demos would be great

~~~
snicky
It seems their website at [http://www.vugu.org](http://www.vugu.org) is a demo
as it contains some of those vg attributes in the source code.

~~~
bradpeabody
Yeah, I still need to write a lot more docs and examples (not to mention
implement a lot more feature), but the site does have some useful stuff. I'm
also making a "playground" and will link to it prominently from the github
readme when it's avail.

------
writepub
13MB [1] for a static site (vugu.org)?

[1]: [http://www.vugu.org/main.wasm](http://www.vugu.org/main.wasm)

~~~
bradpeabody
Yup. That's part of the "experimental" experience. :) (Although that wasm file
should be gzipped, will double check what's up with that). More info on the
size of Go's wasm binaries here:
[https://github.com/golang/go/wiki/WebAssembly#reducing-
the-s...](https://github.com/golang/go/wiki/WebAssembly#reducing-the-size-of-
wasm-files)

The doc site is a prototype and proof-of-concept using Vugu. First attempt,
just wrote it last week. Lots of optimizations still needed for sure.

