記事「Things you forgot (or never knew) because of React」を読んで

要約

筆者の意図
- 自分でも気づかないうちに、素晴らしいものから遠ざかっているのかもしれないという考えをそっと分かち合うこと
- 慣れ親しんだ境界線を越えてより良いものを見つける
- あなたの現在の満足感は、少なくとも少しは、単に何が足りないのかを知らないことから来ているのかも
主張
- Reactが新しいデフォルトのフロントエンド・フレームワークであるが、多くの人がどれほど遅れをとっているかを理解していない
- 純粋に自分自身のために何かを作るのでない限り、ユーザの体験が最も重要
Reactが時代遅れである理由
- Webコンポーネントをサポートしていない(ロードマップにあるが、実装・リリース日も未確定)
- 2008年の制約に合わせて設計された2013年の技術
Reactのせいで忘れてしまった（あるいは知らなかった）こと
- エコシステムはもう巨大である必要はない(共有できる)
- 理由: FWの消失・メンテされなくなることへの恐れは妥当。代替手段には実績・サポートがある
- 仮説: パッケージは使用するフレームワークのために特別に作られる必要があると訓練されたため?
- Reactは互換性が低い
  - JSだけなら、JSであればなんでも動くはず
  - FWの不足分は、プラットフォームで備えていることが多い or 作るにしても簡単にできる
- Hooksは時代遅れ
- ほぼ全てのFWで状態を管理するためのフックのようなモデルを採用
- より速く、より賢く、より書きやすい
- レンダリングを細かく管理する必要はない
- 他のFWでは微調整は何年も前から不要
- FWの版のuseEffectを恐れる人はいない
- コンポーネントがDOMに入ったときに何か処理をさせたい、動的な再計算したいときにuseEffectよりも効果的に方法がある
- スケーリングはもはやフロントエンドの問題ではない
- ベンチマークで比較すると、Reactと同等以上
- スケーリングの意味: アプリのサイズが大きくなっても、複雑さが最小限のままで、直線的に大きくならないようにすること
- サーバーサイド・レンダリングはもう特別ではない
- SvelteKitはデフォルトで何もしなくとも細かく制御できる、VueのメタフレームワークNustも初期から参加
- 多くのFWでデフォルト・多くのオプションがある
- PHPの復活とも言える
- 双方向データバインディングは難しくないし、悪いアイデアでもない
- 対策が取られており、多くのは場合は便利
  - データとDOMの同期を保てる
- Reactでフォームを操作するのは、ユーザーのキー入力がすべて2段階のプロセスになるため、面倒なことで有名
- スタイリングは簡単
- .cssファイルをJSXコンポーネントにインポート、CSSモジュール、Styled Components、Tailwindは、最も一般的なオプションにすぎない
- 他のFWで解決された問題であることに気がついていない
  - 任意のFWを選べる
  - スコープ付きCSS
- フレームワークを学ぶのはもう難しくない
- Reactほど学ぶのが難しいツールはない
- 一つのFWを知っていれば、他のFWに対して大きなスタート切れる (= 2つ目の楽器を学ぶことに似ている)
- 概念は一般的に良いと合意 + 実装の仕方が異なるだけ
他にも試してほしいものがある
- ひとつを選ばなければならないなら、Svelteか、あるいはVueを選ぶといい
- 他の選択肢もある
筆者のオススメ
- Svelte / SvelteKit
- とてもシンプルで使いやすく
- 学習も比較的簡単
  - 可能な限りウェブ・プラットフォームに忠実
  - パワフルだがコンセプトはほとんどなじみのあるもの
- パフォーマンスが高い
- バンドルサイズも小さい
- 本質的には、HTMLの小さくてエレガントなスーパーセットであり、楽しくシンプルなシンタックスを持ち、高速で最小限のバンドルにコンパイルされる
- SvelteKit: メタFW
  - 本番環境にも対応可能 (Next.jsを作っているVercelもサポート)
  - 非常に多機能でパワフルであり、静的、サーバーレンダリング、エッジへのデプロイ、さらにはルートごとのミキシングが可能
- Reactの代替、Next.jsのサブ（全部同時に）

疑問点

Q: SvelteKitのデメリットは?
Q: Webコンポーネントとは?どんなメリット・デメリットがある?
Q: Signalsとは?
- A: 再レンダリングが必要なノードだけを再レンダリングするようにしたもの

感想

常に学び続ける必要がある
- フロントエンドの変化は特にはやい
ある時期にデファクトスタンダートであっても、それ以降の時期になると時代遅れの産物・解決したい課題が解決できなくなることも
- 技術そのものに対して敬意は払いつつも、新しいツールに乗り換えた方が良い場合もある
身近なもの(音楽)を用いた比喩が使われるている
妄信的にReactやNext.jsを選んでいるところがある
ReactがかつてのjQueryになりつつあるのかも
この記事から得られた視点として、デファクトスタンダードとされるものを盲信的に選ぼうとしていないか?
- より良い技術に触れる機会を自らもうける必要性がある

Keep

Problem

Try

Svelteのチュートリアルを試す

出典

https://joshcollinsworth.com/blog/antiquated-react#finding-richness-beyond-the-defaults

KATO-Hiro / Daily-hit

記事「Things you forgot (or never knew) because of React」を読んで #1281

要約

疑問点

感想

Keep

Problem

Try

出典