Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Full-stack go with GopherJS

3,487 views

Published on

Going Full-stack with GopherJS

Published in: Technology
  • Dating for everyone is here: ❤❤❤ http://bit.ly/2F4cEJi ❤❤❤
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Follow the link, new dating source: ❤❤❤ http://bit.ly/2F4cEJi ❤❤❤
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Full-stack go with GopherJS

  1. 1. Full-Stack Go with GopherJS Poga KKTIX
  2. 2. Let's talk about JavaScript JavaScript is becoming a platform X compiles to JavaScript, X = almost anything Trend: asm.js, WebAssembly... not designed to be written by human
  3. 3. Full-Stack Go
  4. 4. Why Learn once, Write everywhere Better tooling compares to JavaScript: gofmt, gooracle, gorename... Easy concurrency: channels and goroutines instead of callback.
  5. 5. GopherJS compiles Go into JavaScript sourcemap compatibility is really good. support channels and goroutines can compile itself! GopherJS Playground(http://gopherjs.github.io/playground/) Example: https://github.com/shurcooL/Go-Package-Store(https://github.com/shurcooL/Go-Package-Store)
  6. 6. Goroutine JavaScript is Single-threaded GopherJS provides a goroutine scheduler
  7. 7. Examples
  8. 8. Hello World with stdlibs you already know import"fmt" funcmain(){ fmt.Println("helloworld") }
  9. 9. Export Function funcmain(){ js.Global.Set("pet",map[string]interface{}{ "New":New, }) } typePetstruct{ namestring } funcNew(namestring)*js.Object{ returnjs.MakeWrapper(&Pet{name}) } func(p*Pet)Name()string{ returnp.name } func(p*Pet)SetName(namestring){ p.name=name }
  10. 10. Callback funcmain(){ js.Global.Call("requestAnimationFrame",raf) } funcraf(tfloat64){ js.Global.Call("requestAnimationFrame",raf) dt:=(t-last)/1000 goanimate(dt) last=t }
  11. 11. Performance DEMO
  12. 12. Bindings DOM: honnef.co/go/js/dom(honnef.co/go/js/dom) jQuery: github.com/gopherjs/jquery(github.com/gopherjs/jquery) JS console: honnef.co/go/js/console(honnef.co/go/js/console) WebGL: github.com/gopherjs/webgl(github.com/gopherjs/webgl) WebSocket: github.com/gopherjs/websocket(github.com/gopherjs/websocket) XHR: honnef.co/go/js/xhr(honnef.co/go/js/xhr)
  13. 13. Gotcha
  14. 14. Import Carefully No dead code elimiation yet hello world with fmt //753kb import"fmt" funcmain(){ fmt.Println("helloworld") } hello world with JS API //64kb import"github.com/gopherjs/gopherjs/js" funcmain(){ js.Global.Get("console").Call("log","helloworld") }
  15. 15. Blocking Callbacks should never be blocking //thiswillproduceanerror js.Global.Get("myButton").Call("addEventListener","click",func(){ someBlockingFunction() }) Wrap it into a goroutine to fix it //thisworks! js.Global.Get("myButton").Call("addEventListener","click",func(){ gofunc(){ someBlockingFunction() }() })
  16. 16. Bad Architecture
  17. 17. Good Architecture OP = Custom Byte Code Design as whatever you like {"op":"move","target":"player","params":{"x":100,"y":100}} <xml><enterprise><op>move</op><target>player</target></enterprise></xml> Text-based protocol: Cross-platform, Easy to debug, Easy to parse
  18. 18. Different Render Target Same OP, VM translate it into different API
  19. 19. Different Platform Same OP, VM implemented in different language The Go part never changes
  20. 20. Recap
  21. 21. Recap Write your core logic in Go: Cross-platform, even in browser Provide text-based protocol for "Write once, run anywhere"
  22. 22. Thank you Poga KKTIX @devpoga(http://twitter.com/devpoga)

×