欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

go語言打包的網(wǎng)頁wasm示例詳解

 更新時間:2022年09月02日 15:15:45   作者:飄逸者  
這篇文章主要為大家介紹了go打包網(wǎng)頁wasm示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪<BR>

基本環(huán)境

有時需要做一些前端的數(shù)據(jù)處理,但是又不想把數(shù)據(jù)出來的方式就這么簡單的暴露在js里,然后就用了wasm來包裝這個處理函數(shù),當然,這樣也能提高性能。

新建文件 index.js

const fastify = require('fastify')({ logger: true })
const path = require('path')
// Serve the static assets
fastify.register(require('fastify-static'), {
   root: path.join(__dirname, ''),
   prefix: '/'
})
const start = async () => {
   try {
       await fastify.listen(8080, "0.0.0.0")
       fastify.log.info(`server listening on ${fastify.server.address().port}`)
   } catch (error) {
       fastify.log.error(error)
   }
}
start()

package.json

{
  "scripts": {
    "dev": "node index.js"
  },
  "dependencies": {
    "fastify": "^3.6.0",
    "fastify-static": "^3.2.1"
  }
}

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>hello</title>
</head>
<body>
hello
</body>
</html>

運行 npm run dev 打開http://127.0.0.1:8080

wasm部分

新建 go.mod

module hello-world
go 1.18

main.go

package main
import (
	"syscall/js"
)
func main() {
	message := "?? Hello World ??"
	document := js.Global().Get("document")
	h2 := document.Call("createElement", "h2")
	h2.Set("innerHTML", message)
	document.Get("body").Call("appendChild", h2)
	<-make(chan bool)
}

運行 go env win下

GOOS=windows
GOARCH=amd64

需要配置環(huán)境變量為 win 下設置 cmd運行 set GOOS=js set GOARCH=wasm

生成必要文件(cmd會報錯 powershell可以執(zhí)行) cp "$(go env GOROOT)/misc/wasm/wasm_exec.js" . 會多出一個wasm_exec.js的文件

go打包成wasm 運行go build -o main.wasm 運行結束后會生成一個名為main.wasm的文件

然后修改之前的index.html文件

<html>
<head>
    <meta charset="utf-8"/>
    <script src="wasm_exec.js"></script>
</head>
<body>
<h1>WASM</h1>
<script>
	// 判斷是否支持instantiateStreaming加載
    if (!WebAssembly.instantiateStreaming) {
        WebAssembly.instantiateStreaming = async (resp, importObject) => {
            const source = await (await resp).arrayBuffer()
            return await WebAssembly.instantiate(source, importObject)
        }
    }
    // 異步加載wasm文件
    function loadWasm(path) {
        const go = new Go()
        return new Promise((resolve, reject) => {
            WebAssembly.instantiateStreaming(fetch(path), go.importObject)
                .then(result => {
                    go.run(result.instance)
                    resolve(result.instance)
                })
                .catch(error => {
                    reject(error)
                })
        })
    }
    //加載wasm文件
    loadWasm("main.wasm").then(wasm => {
        console.log("wasm已加載 ??")
    }).catch(error => {
        console.log("加載出錯了", error)
    })
</script>
</body>
</html>

然后刷新瀏覽器就能看到這么一個界面

以上就是go打包網(wǎng)頁wasm示例詳解的詳細內容,更多關于go打包網(wǎng)頁wasm的資料請關注腳本之家其它相關文章!

相關文章

  • gin自定義中間件解決requestBody不可重讀(請求體取值)

    gin自定義中間件解決requestBody不可重讀(請求體取值)

    這篇文章主要介紹了gin自定義中間件解決requestBody不可重讀,確保控制器能夠獲取請求體值,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
    2023-10-10
  • golang生成vcf通訊錄格式文件詳情

    golang生成vcf通訊錄格式文件詳情

    這篇文章主要介紹了golang生成vcf通訊錄格式文件詳情,?VCF是通訊錄格式文件,一般需要用手機通訊錄導入導出的文件格式都是vcf格式。?下面詳細內容介紹需要的小伙伴可以參考一下
    2022-03-03
  • Go實現(xiàn)基于RSA加密算法的接口鑒權

    Go實現(xiàn)基于RSA加密算法的接口鑒權

    這篇文章主要介紹了Go實現(xiàn)基于RSA加密算法的接口鑒權,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2021-06-06
  • Go語言實現(xiàn)順序存儲的線性表實例

    Go語言實現(xiàn)順序存儲的線性表實例

    這篇文章主要介紹了Go語言實現(xiàn)順序存儲的線性表的方法,實例分析了Go語言實現(xiàn)線性表的定義、插入、刪除元素等的使用技巧,具有一定參考借鑒價值,需要的朋友可以參考下
    2015-03-03
  • Go語言計算指定年月天數(shù)的方法

    Go語言計算指定年月天數(shù)的方法

    這篇文章主要介紹了Go語言計算指定年月天數(shù)的方法,實例分析了Go語言操作時間的技巧,具有一定參考借鑒價值,需要的朋友可以參考下
    2015-02-02
  • golang?中?recover()的使用方法

    golang?中?recover()的使用方法

    這篇文章主要介紹了Guam與golang??recover()的使用方法,Recover?是一個Go語言的內建函數(shù),可以讓進入宕機流程中的?goroutine?恢復過來,下文更多相關資料需要的小伙伴可以參考一下
    2022-04-04
  • golang的HTTP基本認證機制實例詳解

    golang的HTTP基本認證機制實例詳解

    這篇文章主要介紹了golang的HTTP基本認證機制,結合實例形式較為詳細的分析了HTTP請求響應的過程及認證機制實現(xiàn)技巧,需要的朋友可以參考下
    2016-07-07
  • go語言用八百行代碼實現(xiàn)一個JSON解析器

    go語言用八百行代碼實現(xiàn)一個JSON解析器

    這篇文章主要為大家介紹了go語言用八百行代碼實現(xiàn)一個JSON解析器實例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
    2022-07-07
  • Go中Gzip與json搭配實現(xiàn)數(shù)據(jù)壓縮demo

    Go中Gzip與json搭配實現(xiàn)數(shù)據(jù)壓縮demo

    這篇文章主要為大家介紹了Go中Gzip與json搭配使用壓縮數(shù)據(jù)的實現(xiàn)demo,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪
    2023-05-05
  • Golang動態(tài)調用方法小結

    Golang動態(tài)調用方法小結

    本文主要介紹了Golang動態(tài)調用方法小結,文中通過示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2021-12-12

最新評論