Phoenix LiveView が『サーバ駆動Webの本命』として支持
Phoenix LiveViewはElixir/PhoenixチームがOSSで開発するリアルタイムWebフレームワークで、『サーバ側で UI状態を管理し、変更差分をWebSocketで配信する』というアプローチを採ります。React/Vue/Svelte等のJSフレームワークが不要で、フォーム・モーダル・無限スクロール・チャット等の対話的UIをサーバ側で完結できる点が革新的。Heroku・Fly.io等の本番採用例豊富、HTMX的な思想の本命選択肢として2026年定着しました。
採用すべき5つのシグナル
- React/Vueの複雑性に疲れた
- サーバ駆動UIで生産性を上げたい
- リアルタイム機能（チャット・通知）が必須
- BEAM/Erlang仮想マシンの堅牢性が魅力
- 大規模WebSocketコネクションを扱う
主要機能
- LiveView: サーバ側UI状態管理
- WebSocket Streaming: 差分のみ配信
- Phoenix Channels: マルチユーザーチャット・Pub/Sub
- Presence: ユーザーオンライン状態管理
- LiveComponent: 再利用可能コンポーネント
- JS Hooks: JS統合が必要な場合の橋渡し
React/HTMX/LiveView比較
React: クライアントUI・複雑な状態管理・豊富エコシステム。
HTMX: HTMLベース・任意サーバ言語・軽量。
Phoenix LiveView: Elixir限定・差分配信・リアルタイム・堅牢。
使い分け: ReactエコシステムはReact継続・サーバ駆動軽量はHTMX・リアルタイム堅牢はLiveView。
実装パターン
(1) LiveView module: マウント・イベントハンドリング
(2) render関数: HEEx（HTML+Embedded Elixir）でUI記述
(3) handle_event: クライアントイベント処理
(4) handle_info: サーバプッシュ処理
(5) JS Hooks: JSライブラリ統合（地図・グラフ等）
本番採用の判断基準
- 本番実績: Discord・Heroku・各種スタートアップ
- Elixir経験: チームにElixir経験者必要
- BEAM特性: 数百万コネクション同時処理可能
- 運用負荷: BEAM運用にやや特殊な知識
- エコシステム: ElixirエコシステムはJSより小さい
採用しない方が良いケース
- チームがElixir未経験で学習投資余裕なし
- React/Vue大規模UI資産がある
- クライアントサイド処理が重い（複雑なグラフ等）
- SEO最適化が極限まで必要
- サーバレス前提（BEAMはサーバ常駐前提）
実装で詰まる3つの落とし穴
- Elixir学習: 関数型言語の習得
- BEAM運用: Erlang/OTPの理解
- WebSocket制限: コネクション数の運用設計
30日学習プラン
- 1週目: Elixir基礎・パターンマッチ・パイプライン
- 2週目: Phoenix基本・LiveView入門
- 3週目: Phoenix Channels・リアルタイム機能
- 4週目: 本番デプロイ（Fly.io・Gigalixir）
関連リンク
HTMXは HTMX 2深掘り、リアルタイム実装は リアルタイムツール選び方、サーバ駆動全般は サーバサイド実践 を参照してください。WebSocketは WebSocket実践 もどうぞ。