ascii图像生成器
TL;DR This blog illustrates how you can import your existing go code to Wasm, and run it in the browser. In this blog, I will show you how I made a tool to convert Image to Ascii characters on the browser that was written in Go. Link to the Github repo: wasm-go-image-to-ascii. Here is the Demo: Image to Ascii
TL; DR该博客说明了如何将现有的go代码导入Wasm,并在浏览器中运行它。 在此博客中,我将向您展示如何制作工具,以在用Go语言编写的浏览器上将Image转换为Ascii字符。 链接到Github 仓库 : wasm-go-image-to-ascii 。 这是演示: Ascii的图像
什么是WebAssembly? (What is WebAssembly?)
Before moving on to writing the code, let’s first understand what WebAssembly is. WebAssembly or WASM is an assembly-like language that can run in near-native performance in the browser. It is not to be written manually but to be treated as a compilation target for languages such as C/C++, Golang, Rust, .Net, etc. This means first we write a program in a language, then convert it to WASM and then run it in the browser. This will allow the program to run in near-native speed and give the ability to run a program written in any language to run on the browser. You can create web applications in the language you are familiar with. It doesn’t mean it will remove javascript but exist hand in hand with JavaScript. The list of languages that support WASM compilation is in awesome-wasm-langs and more info on WebAssembly Webpage and WebAssembly Concepts.
在继续编写代码之前,让我们首先了解什么是WebAssembly。 WebAssembly或WASM是一种类似于汇编的语言,可以在浏览器中以接近本机的性能运行。 它不是手动编写的,而是被视为C / C ++,Golang,Rust,.Net等语言的编译目标。这意味着首先我们用某种语言编写程序,然后将其转换为WASM,然后再将其转换为WASM在浏览器中运行它。 这将使程序能够以接近本机的速度运行,并能够运行以任何语言编写的程序以在浏览器上运行。 您可以使用您熟悉的语言创建Web应用程序。 这并不意味着它将删除javascript,而是与JavaScript并存。 支持WASM编译的语言列表在awesome-wasm-langs中,以及有关WebAssembly网页和WebAssembly概念的更多信息。
在浏览器上运行 (Running go on the browser)
Now, let’s get our hands dirty with some basic WASM and Golang.
现在,让我们动手使用一些基本的WASM和Golang。
编写Go代码 (Writing Go Code)
Let’s write our first hello world program.
让我们编写第一个hello world程序。
// go
package mainimport "fmt"func main() {
fmt.Println("Hi from the browser console!!")
}
编译为WebAssembly (Compiling to WebAssembly)
Let’s compile it to Wasm.
让我们将其编译为Wasm。
#sh
GOOS=js GOARCH=wasm go build -o main.wasm main.go
This will create a main.wasm
WebAssembly file that we can import and run on the browser.
这将创建一个main.wasm
WebAssembly文件,我们可以将其导入并在浏览器上运行。
与javascript集成 (Integrating with javascript)
After we write our Go code and compile it to WASM we can then start integrating it on the browser.
编写Go代码并将其编译为WASM之后,我们可以开始将其集成到浏览器中。
We will need a Go runtime wrapper written in javascript to interact with Go through wasm. The code is shipped with Go 1.11+ and can be copied using the following command:
我们将需要一个用JavaScript编写的Go运行时包装程序,以通过wasm与Go进行交互。 该代码随Go 1.11+一起提供,可以使用以下命令进行复制:
#sh
cp "$(go env GOROOT)/misc/wasm/wasm_exec.js" .
Now, let’s integrate it into the browser.
现在,让我们将其集成到浏览器中。
<!-- html -->
<html>
<head>
<meta charset="utf-8" />
<script src="wasm_exec.js"></script>
<scrip