[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-10832":3},{"id":4,"name":5,"fullName":6,"owner":5,"repo":5,"description":7,"homepage":8,"htmlUrl":9,"language":10,"languages":9,"totalLinesOfCode":9,"stars":11,"forks":12,"watchers":13,"openIssues":14,"contributorsCount":15,"subscribersCount":15,"size":15,"stars1d":15,"stars7d":16,"stars30d":17,"stars90d":15,"forks30d":15,"starsTrendScore":15,"compositeScore":18,"rankGlobal":9,"rankLanguage":9,"license":19,"archived":20,"fork":20,"defaultBranch":21,"hasWiki":22,"hasPages":20,"topics":23,"createdAt":9,"pushedAt":9,"updatedAt":31,"readmeContent":32,"aiSummary":33,"trendingCount":15,"starSnapshotCount":15,"syncStatus":34,"lastSyncTime":35,"discoverSource":36},10832,"vugu","vugu\u002Fvugu","Vugu: A modern UI library for Go+WebAssembly (experimental)","https:\u002F\u002Fwww.vugu.org",null,"Go",5000,174,97,104,0,1,5,63.73,"MIT License",false,"master",true,[24,25,26,27,28,5,29,30],"framework","go","gui","library","ui","web","webassembly","2026-06-12 04:00:52","# Vugu\n\n[![Travis CI](https:\u002F\u002Ftravis-ci.org\u002Fvugu\u002Fvugu.svg?branch=master)](https:\u002F\u002Ftravis-ci.org\u002Fvugu\u002Fvugu)\n[![GoDoc](https:\u002F\u002Fgodoc.org\u002Fgithub.com\u002Fvugu\u002Fvugu?status.svg)](https:\u002F\u002Fgodoc.org\u002Fgithub.com\u002Fvugu\u002Fvugu)\n[![stability-experimental](https:\u002F\u002Fimg.shields.io\u002Fbadge\u002Fstability-experimental-orange.svg)](https:\u002F\u002Fgithub.com\u002Femersion\u002Fstability-badges#experimental)\n\u003C!-- [![Go Report Card](https:\u002F\u002Fgoreportcard.com\u002Fbadge\u002Fgithub.com\u002Fvugu\u002Fvugu)](https:\u002F\u002Fgoreportcard.com\u002Freport\u002Fgithub.com\u002Fvugu\u002Fvugu) -->\n\nVugu is an experimental library for web UIs written in Go and targeting webassembly.  Guide and docs at https:\u002F\u002Fwww.vugu.org.\nGodoc at https:\u002F\u002Fgodoc.org\u002Fgithub.com\u002Fvugu\u002Fvugu.\n\nIf you've ever wanted to write a UI not in JS but pure Go... and run it in your browser, right now... That (experimental;) future is here!\n\nIntroducing Vugu (pronounced \u002Fˈvuː.ɡuː\u002F), a VueJS-inspired library in Go targeting wasm.\n\nNo node. No JS. No npm. No node_modules folder competing with your music library for disk space.\n\n## Updates ♨\n\n* 2024-05-25 Move to a [mage](https:\u002F\u002Fmagefile.org\u002F) based build process\n\u003Cimg src=\"https:\u002F\u002Fcdnjs.cloudflare.com\u002Fajax\u002Flibs\u002Fionicons\u002F4.5.6\u002Fcollection\u002Fbuild\u002Fionicons\u002Fsvg\u002Flogo-slack.svg\" width=\"17\" height=\"17\"> Join the conversation: [Gophers on Slack](https:\u002F\u002Finvite.slack.golangbridge.org\u002F), channel #vugu\n\n## Highlights\n\n* Runs in-browser using WebAssembly\n* Single-file components\n* Vue-like markup syntax\n* Write idiomatic Go code\n* Rapid prototyping\n* ~3 minute setup\n* Standard Go build tools\n\n\n## Start\n\nGet started: http:\u002F\u002Fwww.vugu.org\u002Fdoc\u002Fstart\n\nStill a work in progress, but a lot of things are already functional. Some work really well.\n\n**You must have Go v1.22.3 as a minimum to use `vugu`. We require the for loop changes that were introduced in Go v1.22, and v1.22.3 was the lastest at the time writing.**\n\n\n## Building `vugu` for Contributors\n\n`vugu` now uses [mage](https:\u002F\u002Fmagefile.org\u002F) to manage the build of the `vugu` tools - `vugugen`, `vugufmt` and `vgfrom`.\n[Mage](https:\u002F\u002Fmagefile.org\u002F) is also used to manage the testing process.\n\nPlease see the updated build instruction in the [Contributors Guide](https:\u002F\u002Fgithub.com\u002Fvugu\u002Fvugu\u002Fblob\u002Fmaster\u002FCONTRIBUTING.md)\n\n\n## Running the examples\n\nTo run the examples you must have the [`mage`](https:\u002F\u002Fmagefile.org\u002F) tool, `docker` and `goimports` installed. `vugu` uses `mage` to manage the build process.\n\nThe simplest way to install `mage` is:\n\n```\ngit clone https:\u002F\u002Fgithub.com\u002Fmagefile\u002Fmage\ncd mage\ngo run bootstrap.go\n```\n\nYou must run `mage` from the module root of `vugu`, this is the directory where the top level `go.mod` exists.\n\nYou will also need the [`goimports`](https:\u002F\u002Fpkg.go.dev\u002Fgolang.org\u002Fx\u002Ftools\u002Fcmd\u002Fgoimports) tool installed. It is very likely that you have this installed already, normally as part of an editor plugin. If not then the it can be installed with:\n\n```\ngo install golang.org\u002Fx\u002Ftools\u002Fcmd\u002Fgoimports@latest\n```\n\nIn order to run the examples you will also need `docker` installed. If you don't have `docker` installed then follow the [docker install instructions](https:\u002F\u002Fdocs.docker.com\u002Fengine\u002Finstall\u002F#licensing). Each example will be served by a local `nginx` container.\n\nAll of the examples are in the `examples` directory. Each sub-directory of `examples` contains a single example. Each example is it own Go module.\n\nBuilding and serving all of the examples is a simple as:\n\n```\ncd path\u002Fto\u002Fvugu\nmage examples\n```\n\nor\n\n```\ncd path\u002Fto\u002Fvugu\nmage -v examples\n```\n\nEach example will be served at a URL of the form\n\n```\nhttp:\u002F\u002Flocalhost:8888\u002F\u003Cname-of-example-directory>\n```\n\nFor example to see the `fetch-and-display` example the URL would be:\n\n```\nhttp:\u002F\u002Flocalhost:8888\u002Ffetch-and-display\n```\n\nOr if you only want to run a single example use:\n\n```\ncd path\u002Fto\u002Fvugu\nmage singleExample \u003Cname-of-example-module>\n```\n\nFor example to serve just the `fetch-and-display` example the command would be:\n\n```\ncd path\u002Fto\u002Fvugu\nmage singleExample github.com\u002Fvugu\u002Fvugu\u002Fexample\u002Ffetch-and-display\n```\n\n### Creating a new example\n\nIf you need to create a new example the process is fairly straight forward. The critical point is to base it on a working example.\n\nFor example\n\n```\ncd \u002Fpath\u002Fto\u002Fvugu\ncp -r .\u002Fexamples\u002Ffetch-and-display\u002F .\u002Fexamples\u002Fmy-new-example\n\n```\n\nThe `cp` will copy everything in the directory including the critical local `.gitignore` file to the new example directory. Please make sire the `.gitignore` is present to ensure that vugu generated files are not submitted to the repository.\n\nYou then need to edit the `.\u002Fexamples\u002Fmy-new-example\u002Fgo.mod` to change the module name. ***This step is critical.***\n\nThe module name must be changed to match the example, so in this case the module name would be changed to `github.com\u002Fvugu\u002Fvugu\u002Fexamples\u002Fmy-new-example`\n\nYou can then edit the `root.vugu`, `root.go` as needed to support the example, or add more `*.vugu` and `*.go` files as necessary.\n\nThe files `main_wasm.go` and `wasm_exec.js` should not be edited.\n\nThe examples `index.html` file will need to edited in two distinct places. The first is circa line 11\n\n```\n\u003Cscript src=\"\u002Ffetch-and-display\u002Fwasm_exec.js\">\u003C\u002Fscript>\n```\n\nTo change the path to reflect the name of the example. In this case:\n\n```\n\u003Cscript src=\"\u002Fmy-new-example\u002Fwasm_exec.js\">\u003C\u002Fscript>\n```\n\n\nThe second change is similar but reflects the path of the `main.wasm` binary. This is circa line 29\n\n```\nWebAssembly.instantiateStreaming(fetch(\"\u002Ffetch-and-display\u002Fmain.wasm\"), go.importObject).then((result) => {\n```\n\nwhich in this case would be changed to:\n\n```\nWebAssembly.instantiateStreaming(fetch(\"\u002Fmy-new-example\u002Fmain.wasm\"), go.importObject).then((result) => {\n```\n\nThe new example can then be built and served with:\n\n```\ncd \u002Fpath\u002Fto\u002Fvugu\nmage examples\n```\n\nOr individually like this:\n\n```\ncd \u002Fpath\u002Fto\u002Fvugu\nmage singleExample github.com\u002Fvugu\u002Fvugu\u002Fexample\u002Fmy-new-example\n```\n\n\n## Abbreviated Roadmap\n\n- [x] Move to a Mage based build\n- [x] Single-file components (looks similar to .vue); .vugu -> .go code generation.\n- [x] Includes CSS in components.\n- [x] Basic flow control with vg-if, vg-for and output with vg-content.\n- [x] Dynamic attributes with `\u003Ctag :prop='expr'>`.\n- [x] Nested components with dynamic properties\n- [x] Efficiently syncs to browser DOM.\n- [x] Static HTML output (great for tests).\n- [x] DOM Events, click, etc.\n- [x] Modification tracking to avoid unnecessary computation where possible.\n- [x] Basic dev and prod server tooling, easy to get started\n- [x] Rewrite everything so it is not so terrible internally\n- [x] URL Router (in-progress)\n- [x] Tinygo compilation support\n- [x] Server-side rendering (works, needs more documentation and examples)\n- [x] Go-only component events\n- [x] Slots\n- [ ] Component library(s) (wip!)\n- [ ] Performance optimizations\n- And much more...\n\n## Notes\n\nIt's built **more like a library than a framework**.  While Vugu does do code generation for your .vugu component\nfiles, (and will even output a default main_wasm.go for a new project and build your program automatically upon page refresh), \nfundamentally you are still in control.  Overall program flow, application wiring and initialization, the render loop\nthat keeps the page in sync with your components - you have control over all of that.\nFrameworks call your code.  Vugu is a library, your code calls it (even if Vugu generates a bit of that for you in\nthe beginning to make things easier). One of the primary goals for Vugu, when it comes to developers first encountering it, \nwas to make it very fast and easy to get started, but without imposing unnecessary limitations on how a project is structured.\nGo build tooling (and now the module system) is awesome.  The idea is to leverage that to the furthest extent possible,\nrather than reprogramming the wheel.\n\nSo you won't find a vugu command line tool that runs a development server, instead\nyou'll find in the docs an appropriate snippet of code you can paste in a file and `go run` yourself.  For the code\ngeneration while there is an http.Handler that can do this upon page refresh, you also can (and should!) run `vugugen`\nvia `go generate`. There are many small decisions in Vugu which follow this philosophy: wherever reasonably possible,\njust use the existing mechanism instead of inventing anew.  And keep doing that until there's proof that something\nelse is really needed.  So far it's been working well.  And it allows Vugu to focus on the specific things it \nbrings to the table.\n\n## Examples\n\nExamples of implementations can be found into [examples repositories](https:\u002F\u002Fgithub.com\u002Forgs\u002Fvugu-examples\u002Frepositories)\n\n## VSCode plugin\n\nAs most of your code will be in `.vugu` files, you will need to install [vscode-vugu](https:\u002F\u002Fmarketplace.visualstudio.com\u002Fitems?itemName=binhonglee.vscode-vugu)\nCredits goes to @binhonglee.","Vugu 是一个实验性的 Go 语言 UI 库，用于构建基于 WebAssembly 的网页用户界面。它允许开发者使用纯 Go 代码编写前端应用，并在浏览器中运行。Vugu 采用类似 VueJS 的标记语法，支持单文件组件和标准的 Go 构建工具，使得快速原型开发成为可能。此外，该库不依赖 Node.js、npm 或 JavaScript，简化了开发环境。适用于希望用 Go 语言进行前端开发的场景，特别适合对性能有较高要求且偏好 Go 语言特性的项目。",2,"2026-06-11 03:30:24","top_topic"]