Git Product home page Git Product logo

GopherJS - A compiler from Go to JavaScript

GoDoc Sourcegraph Circle CI

GopherJS compiles Go code (go.dev) to pure JavaScript code. Its main purpose is to give you the opportunity to write front-end code in Go which will still run in all browsers.

Help us make GopherJS better!

What's new?

  • 2024-02-24: Go 1.19 support is available!
  • 2022-08-18: Go 1.18 support is available!
  • 2021-09-19: Go 1.17 support is available!
  • 2021-08-23: Go Modules are now fully supported.
  • 2021-06-19: Complete syscall/js package implementation compatible with the upstream Go 1.16.
  • 2021-04-04: Go 1.16 is now officially supported! ๐ŸŽ‰ ๐ŸŽ‰ ๐ŸŽ‰

Playground

Give GopherJS a try on the GopherJS Playground.

What is supported?

Nearly everything, including Goroutines (compatibility documentation). Performance is quite good in most cases, see HTML5 game engine benchmark. Cgo is not supported.

Installation and Usage

GopherJS requires Go 1.19 or newer. If you need an older Go version, you can use an older GopherJS release.

Install GopherJS with go install:

go install github.com/gopherjs/[email protected]  # Or replace 'v1.19.0-beta1' with another version.

If your local Go distribution as reported by go version is newer than Go 1.19, then you need to set the GOPHERJS_GOROOT environment variable to a directory that contains a Go 1.19 distribution. For example:

go install golang.org/dl/go1.19.13@latest
go1.19.13 download
export GOPHERJS_GOROOT="$(go1.19.13 env GOROOT)"  # Also add this line to your .profile or equivalent.

Now you can use gopherjs build [package], gopherjs build [files] or gopherjs install [package] which behave similar to the go tool. For main packages, these commands create a .js file and .js.map source map in the current directory or in $GOPATH/bin. The generated JavaScript file can be used as usual in a website. Use gopherjs help [command] to get a list of possible command line flags, e.g. for minification and automatically watching for changes.

gopherjs uses your platform's default GOOS value when generating code. Supported GOOS values are: linux, darwin. If you're on a different platform (e.g., Windows or FreeBSD), you'll need to set the GOOS environment variable to a supported value. For example, GOOS=linux gopherjs build [package].

Note: GopherJS will try to write compiled object files of the core packages to your $GOROOT/pkg directory. If that fails, it will fall back to $GOPATH/pkg.

gopherjs run, gopherjs test

If you want to use gopherjs run or gopherjs test to run the generated code locally, install Node.js 10.0.0 (or newer), and the source-map-support module:

npm install --global source-map-support

On supported GOOS platforms, it's possible to make system calls (file system access, etc.) available. See doc/syscalls.md for instructions on how to do so.

gopherjs serve

gopherjs serve is a useful command you can use during development. It will start an HTTP server serving on ":8080" by default, then dynamically compile your Go packages with GopherJS and serve them.

For example, navigating to http://localhost:8080/example.com/user/project/ should compile and run the Go package example.com/user/project. The generated JavaScript output will be served at http://localhost:8080/example.com/user/project/project.js (the .js file name will be equal to the base directory name). If the directory contains index.html it will be served, otherwise a minimal index.html that includes <script src="project.js"></script> will be provided, causing the JavaScript to be executed. All other static files will be served too.

Refreshing in the browser will rebuild the served files if needed. Compilation errors will be displayed in terminal, and in browser console. Additionally, it will serve $GOROOT and $GOPATH for sourcemaps.

If you include an argument, it will be the root from which everything is served. For example, if you run gopherjs serve github.com/user/project then the generated JavaScript for the package github.com/user/project/mypkg will be served at http://localhost:8080/mypkg/mypkg.js.

Environment Variables

There are some GopherJS-specific environment variables:

  • GOPHERJS_GOROOT - if set, GopherJS uses this value as the default GOROOT value, instead of using the system GOROOT as the default GOROOT value
  • GOPHERJS_SKIP_VERSION_CHECK - if set to true, GopherJS will not check Go version in the GOROOT for compatibility with the GopherJS release. This is primarily useful for testing GopherJS against unreleased versions of Go.

Performance Tips

Community

Getting started

Interacting with the DOM

The package github.com/gopherjs/gopherjs/js (see documentation) provides functions for interacting with native JavaScript APIs. For example the line

document.write("Hello world!");

would look like this in Go:

js.Global.Get("document").Call("write", "Hello world!")

You may also want use the DOM bindings, the jQuery bindings (see TodoMVC Example) or the AngularJS bindings. Those are some of the bindings to JavaScript APIs and libraries by community members.

Providing library functions for use in other JavaScript code

Set a global variable to a map that contains the functions:

package main

import "github.com/gopherjs/gopherjs/js"

func main() {
	js.Global.Set("pet", map[string]interface{}{
		"New": New,
	})
}

type Pet struct {
	name string
}

func New(name string) *js.Object {
	return js.MakeWrapper(&Pet{name})
}

func (p *Pet) Name() string {
	return p.name
}

func (p *Pet) SetName(name string) {
	p.name = name
}

For more details see Jason Stone's blog post about GopherJS.

Architecture

General

GopherJS emulates a 32-bit environment. This means that int, uint and uintptr have a precision of 32 bits. However, the explicit 64-bit integer types int64 and uint64 are supported.

The GOOS value of this environment is js, and the GOARCH value is ecmascript. You may use these values in build constraints when writing platform-specific code. (GopherJS 1.17 and older used js as the GOARCH value.)

Application Lifecycle

The main function is executed as usual after all init functions have run. JavaScript callbacks can also invoke Go functions, even after the main function has exited. Therefore the end of the main function should not be regarded as the end of the application and does not end the execution of other goroutines.

In the browser, calling os.Exit (e.g. indirectly by log.Fatal) also does not terminate the execution of the program. For convenience, it calls runtime.Goexit to immediately terminate the calling goroutine.

Goroutines

Goroutines are fully supported by GopherJS. The only restriction is that you need to start a new goroutine if you want to use blocking code called from external JavaScript:

js.Global.Get("myButton").Call("addEventListener", "click", func() {
  go func() {
    [...]
    someBlockingFunction()
    [...]
  }()
})

How it works:

JavaScript has no concept of concurrency (except web workers, but those are too strictly separated to be used for goroutines). Because of that, instructions in JavaScript are never blocking. A blocking call would effectively freeze the responsiveness of your web page, so calls with callback arguments are used instead.

GopherJS does some heavy lifting to work around this restriction: Whenever an instruction is blocking (e.g. communicating with a channel that isn't ready), the whole stack will unwind (= all functions return) and the goroutine will be put to sleep. Then another goroutine which is ready to resume gets picked and its stack with all local variables will be restored.

GopherJS Development

If you're looking to make changes to the GopherJS compiler, see Developer Guidelines for additional developer information.

GopherJS's Projects

eventsource icon eventsource

eventsource provides low-level bindings for the browser's EventSource API, which is used to receive server-sent events.

gopherjs icon gopherjs

A compiler from Go to JavaScript for running Go code in a browser

gopherpen icon gopherpen

Project template for getting started with GopherJS for web apps. Edit the HTML, CSS, and Go and see your changes!

gopherwasm icon gopherwasm

This package is deprecated. Use syscall/js of GopherJS instead.

jsbuiltin icon jsbuiltin

GopherJS bindings for built-in JavaScript functions

output-size-action icon output-size-action

GitHub Action that measures GopherJS output size changes for each pull request.

webgl icon webgl

Gopherjs binding to the webgl context

websocket icon websocket

websocket provides high- and low-level bindings for the browser's WebSocket API.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.