2023年5月、cloudflare-remix で Remix を Cloudflare Workers に載せて、chat interface を試した。フルスタックフレームワークをエッジで動かしたらどうなるか、という実験。Cloudflare Workers 実験記シリーズの第2弾。

構成

  • Remix（wrangler.toml + 自前 server.ts）
  • Cloudflare Workers にデプロイ
  • app/routes/chat.tsx で chat UI
  • app/routes/shops.tsx + app/data/shops.json で別ページも試した

コミットは init → next chat interface の2つだけで、まずは「Workers の上で Remix のルーティングとアクションが普通に動くか」を確かめたかった。

ハマったところ

一番引っかかったのは、やっぱり Node.js API の互換。Workers は Node ランタイムそのものではないので、Node 前提のライブラリや API を呼ぶと普通に落ちる。nodejs_compat フラグや _routes.json まわりの理解が要る、というのがこのとき分かった。

逆に、ルーティングと loader/action みたいな Remix の基本は、エッジでもそのまま動いてくれて拍子抜けするくらいだった。

学び

Remix + Workers は相性が良い。ただ「何が Node 互換で、何がダメか」を最初に把握しておかないと、地味なところで時間を溶かす。エッジで動くフルスタック、という選択肢が現実的になってきた手応えがあった回。

おわり

このあと OpenAI を絡めたり（demo-gpt-202405）、CF 上での実装を何度か繰り返していくことになる。エッジ前提で組む癖は、このへんから付いてきた気がする。