Remix with Cloudflare and Vite

Vite について。

Cloudflare で動くようになったので試す。2023年1月29日現在は unstable¹

Remix を Vite で Cloudflare に deploy する。

Why Vite

Well, we did some quick testing on the Indie Stack with a M1 Max MacBook Pro and here’s what we found:
10x faster HMR² 🔥
5x faster HDR³ 🔥

さて、M1 Max MacBook Proを使ってIndie Stackで簡単なテストをしてみた
HMRが10倍速い 🔥
HDRが5倍速い 🔥

ここでも Rust による高速化の影響を受けている。

Usage

• Vite への migration で code の変更は無し。

npx create-remix@nightly --template https://github.com/remix-run/remix/tree/dev/templates/unstable-vite-cloudflare

npm run dev

node ➜ /workspaces/my-portfolio-remix-vite (main) $ npm run dev

> dev
> remix vite:dev

  ➜  Local:   http://localhost:5173/
  ➜  Network: use --host to expose
  ➜  press h + enter to show help

Remix + Vite + Cloudflare はこちら。

code はこちら。

BTW

Rust に関して FRAIM⁴ さんと話す機会がありました。

FRAIM さんはプロダクト⁵の Backend を Rust で開発しているみたいです。

Engineer の方々も geek な方々でとても魅力的でした。

1. https://github.com/remix-run/remix/tree/dev/templates/unstable-vite-cloudflare ↩

2. 主にアプリケーションの開発中に使用される機能で、特にwebpackのようなツールを使用したWeb開発のコンテキストで使用されます。HMRは、ページ全体をリフレッシュすることなく、実行中のアプリケーションのモジュールを更新する方法を提供し、開発プロセスを大幅に高速化します。 ↩

3. アプリケーションによってフェッチされたデータが定期的にリフレッシュされ、最新であることを確認するプロセスを指す。 ↩

4. https://fraim.co.jp ↩

5. https://lawgue.com ↩