Vue vs React vs Angular vs Svelte Part.11

!extend:on:vvvvv:1000:512

Vue
https://jp.vuejs.org/
React
https://reactjs.org/
Angular
https://angular.io/
Svelte
https://svelte.dev/
solid.js
https://www.solidjs.com/


※前スレ
Vue vs React vs Angular vs Svelte Part.8
https://mevius.5ch.net/test/read.cgi/tech/1621744952/
Vue vs React vs Angular vs Svelte Part.9
https://mevius.5ch.net/test/read.cgi/tech/1642316774/
Vue vs React vs Angular vs Svelte Part.10
https://mevius.5ch.net/test/read.cgi/tech/1646747836/

★ここではjQuery, Ruby, C#, Blazorの話題は禁止です
★jQuery, Ruby, C#, Blazorｷﾁｶﾞｲが書き込んでも無視してください
Next, Nuxt, Sapper, Gatsby, VuePress, RedWoodなどはおｋ。

---

VIPQ2_EXTDAT: default:vvvvv:1000:512:: EXT was configured

>>410
どこ情報？

>>411
何言ってるんだ？
Solid RouterはReact Routerにインスパイアされて作られたって公式のドキュメントに書いてあるのに

>>411
React Router Domが6からSolid Router（旧solid-app-router）の記法をまんま真似してるんだよ
パクったというより連携だけど

>>407だけどreactで作ったchrome拡張の審査通った。
苦労して作ったから使ってみて欲しい。
適当なブログ開いて拡張のアイコンクリックすると画像一覧表示するから
欲しいの選択してダウンロードボタンでzipにできる。
スライダーで拡大縮小できるのがreactっぽい。
ttps://chromewebstore.google.com/detail/kakeaonncmnkigiijohfhlnondeaanii?utm_source=item-share-cp

気が向いたらソースコード公開して

なんでこんなところで宣伝してるんだよ…

reactらしいアプリ作ったから見て欲しかった。

作ったのほとんどAIなんだけどね・・・

誰が作ったのかもわからん怪しいextensionなんかインストールしてはいかんよ
簡単に情報抜かれる

公式でもザルだから入れない

みんなReactでフォーム作るときってinputタグ単位でコンポーネント作るの？

>>422
いや

コンポーネントって再利用しやすいように作るのであって
無駄に細分化すると面倒なことになる
必要になったら後からでもコンポーネント分けられるし

>>422
reRenderの単位かな

描画のタイミング自由に制御できるようになると、react楽しいねぇ。
それまでは糞だけど。

Reactのranderを封じて、
自前のタイミングで再描画する楽しさよ

Reactはmillion.js使えばsvelteやsolidよりレンダリングのパフォーマンスが良くなるよ

randerて

>>422
コンポーネントというより、質問のニュアンスだとフォーム部品ごとの出力オブジェクトか
制御フックのこと言ってるっぽいが

Reactはフォーム処理に関してSvelte、Vueにくらべたら糞性能というか、もともとが
深層ステート管理のためのライブラリだしな。複数のフォームを一発制御できる
useStateフックの書き方ググるかカスタムフックで作る

それかReact捨てて、簡単にリアルタイム制御できるVueかSvelteで作るかだな
どっちもストアライブラリ使わないとスパゲッティまっしぐらだがな

>>386
商用サイトじゃないけど、学研グループの勉強サイトはAstroで書かれてるね
https://manabitimes.jp

芳根京子の公式サイトはNextだった

SvelteKitとても好きです。

Astro触ってみたけどすごいなこりゃ
こんなのできるならよほど大規模なサービスでも無ければNext.jsは要らないのでは

Astroまだちゃんと触ったことないけど
Reactコンポーネントを将来、全く別のフレームワークのコンポーネント、例えば引数とレンダリング結果が同等の動きをする、コンパイルされたバイナリなんかに差し替えたりとか出来たら面白いな

どうせAI任せになるから関係ない
近いうちにAIが直接SSGしたりWeb Assemblyを直接生成するようになるからフレームワークなんか消滅する

>>436
おまえの方が早く消滅しそう...

Remix v3が大改造するみたいだな
従来のRemixはReact Router v7になってRemix v3はpreactベースになるということか

スレチだったらごめん

オンライン麻雀ゲームを作成しようと構想(妄想)してるんだけど、
いまから新規に作るならフロント側にはReactかVue.jsか、あるいは他のライブラリのどれを使えばいい?

先駆者 (書籍も出してる) は

> jQueryでないと美しく実装できない
https://blog.kobalab.net/entry/2021/03/25/205151

って言ってるけど、Webゲームのクライアントは特殊ってこと?

その記事の人はReact使ったことがないから知識ゼロなんだろ
そもそも状態管理をして宣言的にUIを構築するんだからむしろReactのほうがスッキリ書ける
jQueryおじさんという化石思考に惑わされてはいけない

> 宣言的アプローチでは「打牌中」の状態を描画できない
いや、Reactでは描画のための状態はUIコンポーネント内部に保持することでコアロジックを汚染することなく打牌中のような中間状態を美しく描画することができる

Reactは宣言的UIは最終的な状態だけを表現するということではない
アニメーションやユーザー操作に伴う一時的な状態、ここでは打牌中もコンポーネントの内部状態やコンテキストAPIとかで管理できる
isPlayingAnimationのようなブーリアン型の状態を用意し、アニメーション中はtrueに設定し、アニメーションが終了したらfalseに戻す
打牌中の牌の位置や動きに関する情報を状態として持ち、その状態に基づいてCSSアニメーションを適用する

> Majiang.ShoupaiはAIの思考ルーチンでも使用します。ここに描画の都合の「打牌中」などという状態を持ち込むとしたら、それは設計として誤っています
Reactでも描画に関わる状態とアプリケーションのコアロジックに関わる状態は分離して管理するのが一般的
コアロジックの麻雀の牌姿やルール進行を司る部分は、Reactコンポーネントからは独立した純粋なJavaScriptクラスや関数として実装するのが普通

> イベントハンドラ設定は描画処理と分離すべきである
Reactの設計思想はコンポーネントが自身の描画とそれに関連するイベントハンドリングをカプセル化すること
「対戦相手の手牌にイベントハンドラは不要だし、牌譜再生にも打牌のためのイベントハンドラは不要」という点についてはReactのコンポーネント設計で柔軟に対応できるからまったく問題なし
isInteractive: booleanなどを渡すことでイベントハンドラの有無を制御できる
牌譜再生時にはイベントハンドラが不要なモードでコンポーネントを描画すればいいだけだし

> JSXを使う局面がない
> HTML に雛形として埋め込まれた「牌を表現するDOMノード」をコピーし差し込むことで実現しています。
Reactをまったく知らないからこんな恥ずかしことを堂々と言えるんだろう
こいつのもっとも無知なところだな
Reactは宣言型だからコピーするというコードを書くことすら不要なわけ

牌なんてCanvasに直接描画すりゃエフェクトも自在だし変にエレメントにデータ持って
重くなることもなくていいんじゃね？って思うのは俺だけなのか

>>446
俺もこう思う
そもそも牌をhtml要素とCSSで描画すること自体が微妙だよね
そういう意味だとjQueryでもReactでもなくてCanvas系のフレームワーク使ったほうが良いんじゃないかな

宣言的UIに慣れるとCanvas全体を命令的に描画するのがあまりにもダル過ぎる

Canvas上の各表示オブジェクトを
Reactやビューで
あたかもHTMLの要素の様に操作できる（CSSプロパティ設定できる）
ライブラリってあるのかな。

flutterでよくね

実際のゲーム開発で宣言的UIが採用されることってあるの？

設定画面とかチュートリアルなら、まあ宣言的UIを使うもアリ。

Remixが謎方向に進んでいる
Reactを捨てるのか

React捨ててReactもどきを新しく作ったのか
流石にもういらんだろ

Reactは迷走してるって言ってるけど『お前もじゃい！』って感じだな
しかしReact前提のフルスタック全滅したらバックエンドはどうしてくのが良くなるのかねぇ

バックエンドは今でもRailsが大人気だぞ

今さらPugやEJSやThymeleafJSが再流行するとも思えんよなあ

React触ることになった、上達法教えろ

>>458
そのレスをそのままAIに投げろ

ワロw

>>458
やりたいことまとめてAIに投げれば開発環境の構築方法から実際のソースまで全部、書いてくれるよ。

Reactやってる人多いけど重いし環境選ぶしメリットある？
Nuxt4とCapacitorでフロント組んだ方が楽だと思うんだけどトレンドころころ変わるから最近しんどいわ

bunでやってみ
ビルド瞬殺だぞ

特定サービス依存はHerokuみたいなことにならんか心配

生JSでええよな

vueが好きだよ

reactを選ぶ理由はライブラリが揃ってるから
react自体が好きで選んでることはない

信頼できるフレームワークは生き残るが
信頼できるフレームワークに依存する信頼できないライブラリはAIに淘汰されると思う

NextでパフォーマンスチューニングしてもNuxtに適わないな
今後AIである程度フロント技術はAIのルール付けに集約していく気がする。ClaudeOpsもSonnetも単純なアプリならそこまで間違えないし勉強には良いね

reactはすごいよく考えられてると思ったよ
オブジェクト指向で絵に描いた餅だった再利用性が本当に使い物になるし、
圧倒的に他人のコードが読みやすい
Nextは嫌いだけど仕方なく使っている

Reactで原子レベルでコンポーネントを設計みたいな記事を読んだんだけどボタン一つからコンポーネントにするとかそういう意味？

Atomicデザインだろ
そうだよ複数の要素を組み合わせたものがコンポーネント
しかし原子はその中の文字だけとか、border、border-radiusとかpaddingとか細かく共通化を前提に設計していく

>>472
ありがとう、CSSまで設計で決めるんだね
まあFigmaとか使ってたらCSS生成出来るから普通なのか

AIでAtomicデザイン任せられるのは本当に楽。ここ５年ぐらいの苦労が何だったのかわからなくなるぐらい
UI周りだけはClaudeでもまともに動いてくれる

Evan Youがなんか出した
https://void.cloud/

cloudflare専用らしいけど、別にそれでも良いのかもしれん

cloudflare workersをvite+に合わせたやつでしょう

viteとreactとtailwindとshadcnuiの組み合わせが流行りなの？

ReactだとスクラッチのCSSファイルを管理するのが面倒くさいのとAIが組みやすいからtailwindが選択肢に入りやすい

Vueに腹を立てて自分でフロントエンドフレームワーク作ったんだけどだいぶ調子良い
まぁアーキテクチャはVueのパクリなんだけどね

CSS-in-JS かな
CSSで超かっこイイUI作れる
オレとしては

開発も動作も早く実行環境も選ぶ必要がないってことでVueにしてるけど何でReactがシェア取ってるんだろ？

IE対応でReactがシェア握ってそのまま定着した感じか
もうVirtualDOMもいらないしSolidJS気に入ってるけど日本だと全然流行らない

仮想DOMはべつにあってもいいけどな
これのせいでパフォーマンスが悪いと思われがちだけど
ベンチマークでは仮想DOMを採用しているフレームワークが採用していないsvelteとかよりパフォーマンス良いことも普通にあるし
ただreactが重いだけなのを仮想DOMのせいだと勘違いしている人も多い

今は普通に作ればパフォーマンスも開発の効率もNuxt>Next
Reactが強いのは学習コストが高い、上級者向けと言われるからメリットを無視して選ばれてる感じ

それはNextがアレなのであってReactの問題じゃなくね感

弊社はReact+nest

もうReactに慣れちゃった
これ以外で書きたくない
JSXの真ん中がへっこんだ)型のコンポーネントのコード見ると落ち着く