GoでReactをSSRする

概要

GoでReactをSSRできそうだったので試してみました。
下記が動作の様子と実施のコードです。

https://github.com/K-Sato1995/go-ssr-poc

やっている間に良い感じに実現されている下記のプロジェクトも見つけました。
私の現状のPOCだと実現できないことが色々実現されててすごいなと思いました。

https://github.com/natewong1313/go-react-ssr

やりたい事

• Go環境でReactのrenderToStringでSSRを行う
• 実行結果をブラウザに渡す
• ブラウザでReactのhydrateRootでHydrationを行う

使用したもの

まず、Go環境でJSを実行するためにrogchap/v8goを使っています。他にも色々ありましたが、ES6が完全にサポートされていなかったりそれぞれ制約はありそうでした。
また、Reactの方で使われていたWeb APIsはこちらのコード内で適宜置き換えています。

• dop251/goja
• robertkrimen/otto
• rogchap/v8go
• quickjs-go/quickjs-go
• elsaland/quickjs

そして、React側コードのtranspile/bundleを行うためにesbuild(esbuild自体がGo製なので普通にGo環境で動きます)を使用しています。

流れ

あくまでも私が実行した流れです。

1. esbuildでReact側のコードを実行可能な形にbuildする(Sever/Client側両方)
2. rogchap/v8goでServer側のコードをSSR(renderToString)する
3. Goの標準ライブラリであるhtml/templateで定義しておいたtemplateの中にSSRで生成されたもの＋Hydrationを行うClientコードを突っ込む
4. Goの標準ライブラリであるnet/httpで上記のHTMLをアクセス可能にする