Vue vs React vs Angular vs Svelte Part.9

1 名前：デフォルトの名無しさん mailto:sage [2022/01/16(日) 16:06:14.27 ID:Zy2wxIp9.net] Vue https://jp.vuejs.org/ React https://reactjs.org/ Angular https://angular.io/ Svelte https://svelte.dev/ ※前スレ Vue vs React vs Svelte Part.7 https://mevius.5ch.net/test/read.cgi/tech/1610901677/ Vue vs React vs Angular vs Svelte Part.8 https://mevius.5ch.net/test/read.cgi/tech/1621744952/ ★ここではjQuery, Ruby, C#, Blazorの話題は禁止です ★jQuery, Ruby, C#, Blazorｷﾁｶﾞｲが書き込んでも無視してください Next, Nuxt, Sapper, Gatsby, VuePress, RedWoodなどはおｋ。 2 名前：デフォルトの名無しさん mailto:sage [2022/01/16(日) 16:06:33.48 ID:Zy2wxIp9.net] こっちが本スレ 3 名前：デフォルトの名無しさん mailto:sage [2022/01/16(日) 16:09:20.44 ID:2ncO695p.net] 乙 4 名前：デフォルトの名無しさん mailto:sage [2022/01/16(日) 16:10:01.28 ID:cE2VUlW8.net] ざまぁあぁｗｗｗ 5 名前：デフォルトの名無しさん mailto:sage [2022/01/16(日) 16:19:39.28 ID:5VPVirLB.net] どういう連鎖アボン正規表現入れたら快適になるかな？ 6 名前：デフォルトの名無しさん mailto:sage [2022/01/16(日) 19:21:09.12 ID:2ncO695p.net] Next.jsはええぞ。SSRもSSGもISRもSPAも行ける 7 名前：デフォルトの名無しさん mailto:sage [2022/01/16(日) 21:32:04.77 ID:5Ebj9BVr.net] SPAでいるか？ 8 名前：デフォルトの名無しさん mailto:sage [2022/01/16(日) 22:25:50.12 ID:9GirADkp.net] そもそもvsだから変なの湧くんじゃね 普通にタイトル4つの総合でいいやん 9 名前：デフォルトの名無しさん mailto:sage [2022/01/16(日) 23:18:41.06 ID:RG8YDX1E.net] このスレが、いつもの荒らしが立てたもの！ いつもテンプレに、自分が有利なように追加してる >1 >★ここではjQuery, Ruby, C#, Blazorの話題は禁止です >★jQuery, Ruby, C#, Blazorｷﾁｶﾞｲが書き込んでも無視してください >Next, Nuxt, Sapper, Gatsby, VuePress, RedWoodなどはおｋ。 多くのPython のスレでも、いつもテンプレを変えている。 >・当スレにRubyのソースコード類を書くことを禁ず >・Ruby等、Pythonではないプログラミング言語での回答類・質問を書くのも禁止 >・「Ruby では」「Rubyでは」「Rails」 10 名前：正規表現→「^クソチョンw$」をNGワード登録推奨 多くのJavaScript のスレでも、 jQuery, Lodash を禁止とか書いている いつも、この荒らしがスレを立てて、テンプレを変えてくるので、 漏れらは荒らしの立てたスレから、正規のスレへ誘導してきた [] [ここ壊れてます] 11 名前：9 mailto:sage [2022/01/16(日) 23:21:41.36 ID:RG8YDX1E.net] このスレの削除依頼を出して、下の正規のスレへ移ってください！ Vue vs React vs Angular vs Svelte Part.9 https://mevius.5ch.net/test/read.cgi/tech/1642316327/l50 12 名前：デフォルトの名無しさん mailto:sage [2022/01/16(日) 23:50:47.88 ID:Ww+icYU/.net] ここで良い 向こうのスレは無関係なjQueryが唐突に入れられている 13 名前：デフォルトの名無しさん mailto:sage [2022/01/17(月) 00:11:09.64 ID:tcFWlbRO.net] 向こうのスレは荒らしが立てた事を証明する捨て台詞がご丁寧にも書いてあるしね 14 名前：デフォルトの名無しさん mailto:sage [2022/01/17(月) 12:41:22.76 ID:nV7XcMJz.net] Reactはいいフレームワークだけどフロントって非同期使いまくるのに非同期の扱いが残念なのがちょっとね 他のSPAフレームワークって使った事ないけど非同期はどうなんだろう 15 名前：デフォルトの名無しさん mailto:sage [2022/01/17(月) 12:48:41.83 ID:piunERDu.net] >>13 まず最初にお前が理想のフレームワークをいえ Reactが残念なんじゃなくて お前が非同期処理を理解できないだけだろ まるでプログラミングを勉強したくないけど なんか凄いものを作りたい、簡単に使える言語ないの？って 言ってるようだ 16 名前：デフォルトの名無しさん mailto:sage [2022/01/17(月) 13:01:07.87 ID:nV7XcMJz.net] >>14 レベル低すぎて相手するのも面倒なレスだけどreactが非同期ニガテなのは常識だよ 今までずっと正解らしい正解がみんなで共有できてなくてuseState、useEffectで分かりにくい処理を地道に書く、それらをラップするオレオレフックを作る、別のサードパーティフレームワークを付け足して使う、などなどそれはもう、迷走しまくってた reactが世に出てもう何年経ったかわからんが、最近になってようやっと公式が重い腰を上げて、Suspenseに取り組み始めたけど、これだって今までよりはマシかもって程度であって、けして非同期が楽だとは言えない代物 そんで楽してすごいものを作りたい、というのはフレームワークの存在意義そのものであって、それを否定するのは何も理解してない車輪の再発明マニアだけだ 17 名前：デフォルトの名無しさん mailto:sage [2022/01/17(月) 13:01:29.47 ID:OoRE99LP.net] >>13 そうかなぁ、useEffectで非同期拾ってstate変えたら全部スパッと変わるんだから、やりやすいと思う。useEffectは非同期関数食ってくれないけども 18 名前：デフォルトの名無しさん mailto:sage [2022/01/17(月) 13:09:21.87 ID:OoRE99LP.net] と思ったけどそういうレベルの話ではなさそうだな 19 名前：デフォルトの名無しさん mailto:sage [2022/01/17(月) 13:13:12.62 ID:nV7XcMJz.net] >>16 いや、あれはわかりにくい 依存関係とか諸々含めて、誰でもすんなり理解して間違いなく使える仕様とは思えん 必ずどこかでハマるように出来てる つうか、完全に理解したとしても冗長な記述が多すぎる reactの仕様を大きく変えてasync JSXタグをサポートするべきだと思うんだよな 例えばこういうの↓ const FooView = async () => { try { const foo = await fetchFoo(); return <View> <Text>{foo.name}</Text> <Text>{foo.age}</Text> <View> } catch (e) { return <ErrorView error={e} /> } } もし仮にここまで出来れば俺は「reactは非同期が楽」と言っていいと思うぞ つーかこんなんreactの開発者レベルならとっくに気付いてる筈なんだが 怠慢なのかわからんが、非同期をずっと放置し続けてきた 20 名前：デフォルトの名無しさん mailto:sage [2022/01/17(月) 14:23:54.47 ID:OoRE99LP.net] >>18 あーなるほど。確かにそこまでサポートされてれば楽かもな〜。 待ってる間はFragmentが入るようになってれば（多少柔軟性は落ちても）同期部分とも連携は取れると。 俺はそこまでは要らないかな。でもなるほどね 21 名前：デフォルトの名無しさん mailto:sage [2022/01/17(月) 14:33:09.18 ID:OoRE99LP.net] >>18 いや待て、そこでfetchしたら駄目じゃね？ 22 名前：デフォルトの名無しさん mailto:sage [2022/01/17(月) 15:31:40.92 ID:mFMlok3x.net] >>20 機能を提供するのはよいぞ どう使うかは宗教のもんだい 23 名前：デフォルトの名無しさん mailto:sage [2022/01/17(月) 18:31:36.68 ID:srH4p//H.net] fetchFooが何度も走るからその場所はマズくね？ 24 名前：デフォルトの名無しさん mailto:sage [2022/01/17(月) 18:44:23.62 ID:8GhjbW2b.net] useSWRを使ってみるとか (まだ使ったことないけど) 見た感じそれなりに使いやすそう? import useSWR from 'swr' function Profile() { const { data, error } = useSWR('/api/user', fetcher) if (error) return <div>failed to load</div> if (!data) return <div>loading...</div> return <div>hello {data.name}!</div> } 25 名前：デフォルトの名無しさん mailto:sage [2022/01/17(月) 19:25:32.08 ID:05fLKY0G.net] >>23 単純なケースでしか通用しない気がするけどいけるんかな？ 26 名前：デフォルトの名無しさん mailto:sage [2022/01/17(月) 19:25:53.20 ID:dRyGD2/c.net] >>18 コンポーネントにガッツリ副作用入れてどうすんだよw 27 名前：デフォルトの名無しさん mailto:sage [2022/01/17(月) 23:06:59.06 ID:piunERDu.net] はっはっは、だから言ったろ お前が非同期処理を理解してないって 想像した通りに動いてくれるわけじゃないのだよ 不可能なことは、不可能 28 名前：デフォルトの名無しさん mailto:sage [2022/01/17(月) 23:11:50.20 ID:ZqR63tdH.net] >>18 そんなバグの温床になりそうなコード書くくらいなら、 componentDidMountでfetchして、素直にsetStateしとけ それで済む話だろ 29 名前：9 mailto:sage [2022/01/17(月) 23:50:21.01 ID:fRpijKvH.net] このスレは、荒らしが立てたスレです。 まともな人は、移動してください！ >>9-10 を参照 30 名前：デフォルトの名無しさん mailto:sage [2022/01/18(火) 00:00:44.87 ID:EicAqYVv.net] >>26 具体的な事言わずに批判だけするとか……老害かな？ 31 名前：デフォルトの名無しさん mailto:sage [2022/01/18(火) 00:30:02.59 ID:lZlxHH3x.net] >>22 パラメータが変わらなければ同じpromiseが再利用されるので問題ない 32 名前：デフォルトの名無しさん mailto:sage [2022/01/18(火) 15:39:09.53 ID:WUNUlNdf.net] >>30 fetchFooは（シングルトンみたく）何度呼び出しても同じPromiseを返すって事か。それなら確かに問題ない。 そう云うPromiseを作るhookと待ってる間はFragment（か何かをDOMに接続）、あとエラー時用のインターフェイス（Promise関連だからcatchメソッドで良いか）が必要、と。 う〜ん、俺はuseEffectでいいやw 33 名前：デフォルトの名無しさん mailto:sage [2022/01/18(火) 19:50:02.62 ID:TcbXe2vG.net] >>31 そうじゃない react側で不要な再実行を避けてpromiseを再利用するように作るだけ 34 名前：デフォルトの名無しさん mailto:sage [2022/01/18(火) 20:36:42.52 ID:WUNUlNdf.net] FooViewが発行したPromiseインスタンスを再利用するという事？ 35 名前：デフォルトの名無しさん mailto:sage [2022/01/19(水) 19:07:29.30 ID:3/Lr3xp/.net] lazyとSuspense、ErrorBoundaryを使う データ単位で制御したいならRecoilを組み合わせる（Atomのdefaultやselectorで非同期処理） >>13はRecoilとConcurrentModeがまさにそれ あと>>16の"非同期関数食ってくれない"という表現が良く分からないのだが、即時関数を使えば良いという話ではないのだろうか 36 名前：デフォルトの名無しさん mailto:sage [2022/01/19(水) 19:25:26.21 ID:uMoGEeK3.net] >>34 useEffectの引数に直接async function入れられなくて少し不便ってだけの話で特に特に問題無いから無視してええよ 37 名前：デフォルトの名無しさん mailto:sage [2022/01/19(水) 20:05:38.12 ID:raxSHl5s.net] <ErrorBoundary onErrorComponent={ErrorView} > <Suspence fallback={<Loading />}> <Text>{props.foo.read().name}</Text> </Suspence> </ErrorBoundary> 一見すると良さそうだけど間違ってる Textをラップするコンポーネントを作ってやらんとダメ なんか書くものが多くてめんどくさい 後は純粋に醜い 処理フローの制御をタグで書きたくない recoilって正直なとこContext APIやReduxより多少スマートだけど根本的なとこはあんま変わってないと思う というかrecoilって基本は状態管理ライブラリだし非同期のめんどくささとはまた別の話では？ 38 名前：デフォルトの名無しさん mailto:sage [2022/01/19(水) 21:22:56.22 ID:26VsIy03.net] ラッパー高階関数なりhookでも書けばええんちゃうか……。 目的を最小のコードて書けるライブラリは用途特化ライブラリであって、汎用たり得ないと思うんだ。 39 名前：デフォルトの名無しさん mailto:sage [2022/01/19(水) 22:03:34.62 ID:3/Lr3xp/.net] Suspenseでラップされたコンポーネントで使われているAtomで 非同期処理を実行している間はfallbackが呼ばれるため、loading stateが不要であったりと RecoilはConcurrent Modeを意識した作りになっている というのを踏まえた上で、Reactはv18から非同期でコンポーネントを扱う場合は Suspenseでラップする形を押していくようなので その手法が嫌なら何とも言えない（あなたの提案が悪いというわけではなく、Reactの方針的に） 40 名前：デフォルトの名無しさん mailto:sage [2022/01/20(木) 02:46:03.95 ID:Rxl97YaC.net] そうやって過剰な設計をするならReactとかの フレームワークは重くなるんですよね 41 名前：デフォルトの名無しさん mailto:sage [2022/01/20(木) 07:10:36.24 ID:Vj5JRmmF.net] 重いってのは色んな要素や意味があるし、かなり曖昧表現だな。 スピードテストベンチマークも増えて、一時期に比べればみんな速度を意識しだして、Webって早くなってきたよ。 42 名前：デフォルトの名無しさん mailto:sage [2022/01/20(木) 12:12:04.67 ID:Rxl97YaC.net] >>40 帯域制限中の格安スマホ 43 名前：デフォルトの名無しさん mailto:sage [2022/01/20(木) 12:21:04.70 ID:GD2M/Dj6.net] ここ数ヶ月で重すぎてブラウザバックした記憶はqiitaだけだな あれは何のフレームワーク使ってるんだろ 44 名前：デフォルトの名無しさん mailto:sage [2022/01/20(木) 12:25:07.74 ID:iZmEL3fQ.net] qiitaはスマホが発熱するレベルで熱くなる 45 名前：デフォルトの名無しさん mailto:sage [2022/01/20(木) 12:47:36.33 ID:Vj5JRmmF.net] >>41 なる程。となると容量だな。 帯域制限状態を256kbpsとするとminify+gzipなReact(ReactDOM含む)で36KBなら1.125秒か。時間かかるっちゃかかるけど、この速度域だと画像すら重すぎてそれ以前の問題だなw 46 名前：デフォルトの名無しさん mailto:sage [2022/01/20(木) 12:52:08.95 ID:1yX1mPXr.net] 結局のところ単純で速い方がいい reactでゴテゴテに装飾したSNSより伍ちゃん戦ブラが良いんだな 47 名前：デフォルトの名無しさん mailto:sage [2022/01/20(木) 12:58:52.80 ID:tc4dpKA2.net] 今のSNS大抵レスポンス良いぞ 48 名前：デフォルトの名無しさん mailto:sage [2022/01/20(木) 13:02:02.17 ID:wSqfSwGe.net] そもそも目的や規模感、場合によってはチームの習熟度で不足にも過剰にもなる 結局は毛嫌いせず、状況に応じて使い分ければ良いだけの話 49 名前：デフォルトの名無しさん [2022/01/20(木) 16:56:37.93 ID:EFa2BF3Y.net] >>42 あれフレームワークっていうより遅延ローディングの問題な気がしてる バックエンドが詰まってる印象 50 名前：デフォルトの名無しさん mailto:sage [2022/01/20(木) 20:33:47.49 ID:+j6gWOWK.net] >>42 > ここ数ヶ月で重すぎてブラウザバックした記憶はqiitaだけだな 普通にネット見ていてもReactのような 重量系フレームワークを使ってるところなんて殆どないからね QiitaはReact使ってるみたいだけど、一体あれのどこに必要なんだろうか 51 名前：デフォルトの名無しさん mailto:sage [2022/01/20(木) 20:53:35.92 ID:iZmEL3fQ.net] とりあえずSSG使ってCDNにpushすれば解決するのだがそういう改良する人材もいないんだろうな 元々優秀な技術者集団がいたはずだけど 技術のコモディティ化でその人たちも凡人になったのか 人がいなくなったのか 52 名前：デフォルトの名無しさん mailto:sage [2022/01/20(木) 20:54:50.03 ID:Vj5JRmmF.net] 何をもって『重量系』？ 53 名前：デフォルトの名無しさん mailto:sage [2022/01/20(木) 21:04:59.02 ID:bXKXm3eN.net] >>50 Qiitaの親会社の偉い人に合った事あるけど、技術や技術者の事なんてどうとも思ってなさそうな人だったよ。それからしばらくしてあの炎上騒ぎが起きて、さもありなんと思った。 54 名前：デフォルトの名無しさん mailto:sage [2022/01/20(木) 23:08:25.65 ID:wSqfSwGe.net] >>49 Zenn、Twitter、Instagram、Facebook、LINE、Yahoo、ZOZO、はてなブログ、AmazonのAWSの管理画面などなど これらはフロント全体もしくは部分的にReactだけど？ Googleは多くのサービスでAngularだし 普段ネットで見てんの？ 55 名前：デフォルトの名無しさん [2022/01/20(木) 23:31:12.23 ID:0xN8W4D9.net] 掲示板のレスの1つ1つに開閉式のメニューをつけるのってどうやるんだ？ 下はyahooニュースだが、レス一覧の「非表示・報告」ってとこ押したら出てくるような奴 https://news.yahoo.co.jp/articles/5d52fe0f406f1aa3e9f2263f58966858786bf8a0/comments vue だったらレス一個一個にコンポーネントマウントしないといかんのか？？ 56 名前：デフォルトの名無しさん mailto:sage [2022/01/20(木) 23:36:53.55 ID:ZmHYiWHP.net] >>54 VueでもReactでもAngularでもそう 57 名前：デフォルトの名無しさん [2022/01/20(木) 23:43:22.25 ID:0xN8W4D9.net] >>55 なるほど。内部的には各ボタンにイベントリスナーつけるわけだから当然と言えば当然ではあるか。 サーバ側ではレスをPHPでforeach で回して出力するけど、そのタイミングでvueがマウントするためのコードを生成する必要があるってことなのか？ 58 名前：デフォルトの名無しさん mailto:sage [2022/01/20(木) 23:44:48.93 ID:ZmHYiWHP.net] >>53 noteなんかはVue使ってるしな 59 名前：デフォルトの名無しさん mailto:sage [2022/01/20(木) 23:46:19.28 ID:iZmEL3fQ.net] vue選んだ会社はどうするんだろうか オワコンまっしぐらなのに 60 名前：デフォルトの名無しさん [2022/01/20(木) 23:56:11.92 ID:xZtQwvJ+.net] 生田勇人(39) 高知市朝倉中学校卒業 恐喝と暴行、偽証、傷害容疑で逮捕、起訴。 ://togetter.com/li/1227954 ://pbs.twimg.com/media/DbUOGw1VQAAqJcx.jpg:large ://i.imgur.com/tuUldwv.jpg ://www.youtube.com/watch?v=UyNXI8usCrM 取り調べで「事実無根」と容疑を否認。 卓球所に松岡学(39)と出入りし賭け試合を被害者に強要、一回ミスったら1000円払えと発言。 2万円を取ろうとした。親にチクったらただじゃ済まんぞと被害者の胸倉をつかみ壁に叩き付け2000円を脅し取り、後日腹を複数回殴った疑い。 生田勇人の両親も被害者の親にたかっていた。 61 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 00:01:35.86 ID:wLYahSWr.net] >>56 一例だけど、ページが読み込まれてCommentListコンポーネントがマウントされたタイミングでサーバからコメントを取得して メニューを持ったCommentコンポーネントをcomments.mapで回す この時のcommentひとつひとつをCommentコンポーネントのpropsに渡して描画していく 62 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 00:48:10.29 ID:KdwPKAAI.net] Vueはそもそもの背景にAngularがあるのに Composition登場以降、React寄りになったのが何とも 今のVueはどこに向かっているのか分からん 63 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 00:54:42.07 ID:HxiXQYKt.net] >>54 https://codesandbox.io/embed/dark-dawn-0sk8t?fontsize=14&hidenavigation=1&theme=dark ↑ でけたで！！！ VueじゃなくてReactやけども みんなもよかったらコードレビューしてや！ これ思たんやが、メニューの中身共通やんか ヤフコメの仕様に合わせて同時に複数開けるようにしたからこうしたけど、同時に複数開かなくてもいいっていう仕様やったらばよ 各コメントのカードの中にメニュー含めず、メニューは外に出して1個だけ記述する方が無駄なさげな気するんやがどないなん コード的には同じもんが複数あるってイメージが湧いてしまうわけやが、基本マウントされてないから別にええんか 意味わからんかったらすまんやで 64 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 02:20:49.29 ID:sORVJkOm.net] その考え方で良いと思う 表示非表示といっても、仮想DOMのおかげで差分が更新されるだけなので ひとつのメニューを座標などを保持してまで使い回すメリットがほとんどない 表示されているメニューをひとつだけとするなら メニューを透明なBackdropと共に描画して、メニュー外がクリックされた場合はメニューを閉じるようにする これはMUIのBackdropやMenuコンポーネントを参考にすると分かりやすいと思う 他にはグローバルステートにして、ひとつが表示状態となった場合、他が非表示となるようにする これはReduxで複数のダイアログの状態を扱う場合なんかに使われたりする 規模感にもよるが、今だとRecoilで管理するのがシンプルでおすすめ 他にはonMouseLeaveで非表示にするのもアリかもしれない 65 名前：デフォルトの名無しさん [2022/01/21(金) 02:28:51.97 ID:mtDqJL7w.net] >>60 やっぱりコメント自体を非同期で取得してくるしかないのかあ・・・。 現在の仕様やと、サーバ側でコメントをhtml生成してからレスポンス返しているから、作り直すの大変やなあ。 開閉メニューだけをvueでコンポーネント作ってってことをできんかと思ってたけど厳しいかもなあ。 ちなみに生JSで開閉メニューを作成済みなのだが、それをvue に書き換えたかった。 >>62 うおおおおおおおおすげええええ でもreactわからん・・・・・・vueでも同様のことができるんやろなあ。 メニューの中身は共通やけど、yahooの例で言えば非表示と報告やからそのコメントを特定できるIDみたいなものをサーバに送るために仕込んどかんといかんのや。。。 66 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 05:23:06.12 ID:2Ya+eSMz.net] >>42 Railsは、GitHub, Airbnb, Disney, Hulu, SoundCloud, Shopify といった世界的に有名な企業や、 日本国内でも、note、クックパッド、freee、マネーフォワード、Progate、Qiita などで使われている 2021年10月には、Railsを使い続ける宣言をしている、GitLab が上場し、時価総額は約1.9兆円！ 時価総額1兆円ぐらいまでは、Railsで行ける。 その後、Go へ移行する ここで、URL を入力して、サイト分析できる https://builtwith.com/ 67 名前：65 mailto:sage [2022/01/21(金) 05:34:51.10 ID:2Ya+eSMz.net] 女の娘が1人で起業した、食べチョクは、Rails, React 食べチョクは、生産者と消費者を結ぶ、農林水産物の直販サイトだけど、 コロナで取引量が30倍になったとか 海外のRailsでは、ほとんどReactが多い ただ日本は特殊で、YouTube で有名な、雑食系エンジニア・KENTA のサロンでも、 未経験者の転職用にはReactよりも、Vue.js を使うように指示している 68 名前：65 mailto:sage [2022/01/21(金) 06:17:34.93 ID:2Ya+eSMz.net] Rails では、命名規約だけのフレームワーク・Stimulus もある。 イベントの書き方だけを決めている Railsの作者・DHH が、デモなどでよく使う 1つのDOM に、コントローラーを複数設定できる <div data-controller="hello goodbye"></div> また、同じコントローラーを複数のDOMに設定できる <div data-controller="hello"></div> <div data-controller="hello"></div> つまり、多対多 アクションはクリックで、helloコントローラーのgreet メソッドを呼ぶ <button data-action="click->hello#greet"></button> ターゲットを設定すると、this.nameTarget, this.outputTarget で、 ターゲットとなるDOMを取得できる static targets = [ "name", "output" ] greet() { this.outputTarget.textContent = `Hello, ${this.nameTarget.value}!` } ターゲットとなるDOM。helloコントローラーのname・outputターゲット <input data-hello-target="name" type="text"> <span data-hello-target="output"></span> 69 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 07:05:45.77 ID:cMXeDUr/.net] >>62 ややこしいstate管理してるな、コメントカードをコンポーネントにしてstate持たせりゃコード半分で済むやんけ、と思ったらメニュー使いまわそうとか考えてたのね。なるほど。 細かい所言うとfetchはPromiseな方がそれっぽい雰囲気になってええんちゃう、くらいかな。 >>64 html生成をjson生成に変えるだけだから楽なもんよ（悪魔のささやき） Vue使う使わない以前に、コメントにはID付けた方が良いし、コメントは生htmlじゃなくてjsonあたりから都度生成の方が良いと思う。 70 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 08:28:34.38 ID:kufT2haj.net] プライベートなシステムの管理画面で複雑なReact使ってるけど重くもなくむしろ速い どちらかというとサーバーにアクセスするAPIのほうが遅くてローディングアイコンくるくるしてる 閉鎖的なシステムだから業務ロジックはバックエンドではなくほぼtsで書いてるから処理は速い 71 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 11:11:34.46 ID:SfEYbUH3.net] >>53 お前のインターネットの世界には それだけしかないのか？ 72 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 11:15:00.08 ID:SfEYbUH3.net] コンピュータ用語と関係ない用語で検索してTOP10のサイトが どのフレームワークを使っているか確認してみればいい 例えば「ネコ」で検索するとかな 73 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 11:46:13.84 ID:QNQeLsep.net] 殆どない、に対してのレスだから 適当に列挙してもこれだけあるよ？って話でしょ 74 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 11:54:33.96 ID:SfEYbUH3.net] 適当に列挙したと言う割に 有名なコンピュータ関連の会社に偏ってるから ダメだって話をしてる 適当に列挙させるために コンピュータ用語と関係ない用語で 検索したサイトで調べろと言ってる 75 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 12:09:01.10 ID:k2s5ThwE.net] ま〜たあんたか。今日もご苦労さん 76 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 12:16:03.07 ID:u8ucGGY4.net] そんな謎調べ物させる前に重いサイト列挙すりゃ済む話やろ 77 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 12:45:58.84 ID:943Xrj0f.net] ループ内でuseState使えるようにはできないのかなー これ完全にフレームワーク設計の欠陥だよね 自分も>>62みたいな書き方をよく書くけど配列から子コンポーネントに渡すpropsに変換する手間がかかって面倒くさい しかも配列の1要素を変更しただけで配列全体が変更されたとみなされてイベントハンドラが更新されて子コンポーネントも更新されるのが気になる 純粋な子コンポーネントをラップしてstateを持たせたコンポーネントをプライベートスコープに書いて そのラップコンポーネントを使うって手も有るけどこれはこれでめんどくさい かと言って子コンポーネント自体に副作用を持たせるとテストがめんどくさくなって再利用性も下がる 78 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 12:54:15.65 ID:Mn4SUGG+.net] >>73 “殆どない”に対して”あるけど？”ってことなんだが大丈夫か？ 79 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 13:00:10.73 ID:cMXeDUr/.net] >>76 いや、仕組みを考えればなぜそういう仕様なのかはわかるよ 80 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 13:00:46.06 ID:Mn4SUGG+.net] ListやListItemなら再利用前提だけど CommentListやCommentListItemとかになる固有だったりするから内部に状態を持たせたらいい テストが大変、ってことならカスタムフックでロジックを分離すればいい 81 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 13:10:35.79 ID:943Xrj0f.net] >>78 仕組みの問題なのはわかるけど 利用者の立場を考えたインターフェースデザインになってないのはフレームワークとしては残念ポイントだね 本当に良いフレームワークはまず使いやすいインターフェースがあってそこに実装を合わせていく 「実装の都合のせいで関数トップレベルにしかフックかけません」ってのはそう言う意味では怠慢かな 「どこでも書けるように実装の方で勉強しました」こういう姿勢が必要 82 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 13:12:23.42 ID:943Xrj0f.net] >>79 固有になるかどうかは場合によるよね 83 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 13:16:50.88 ID:6I3Of8sH.net] >>76 状態を呼び出されたインデックスで管理してるんだからむしろわかりやすいと思うが 「副作用の内容」は全く意識しなくて良いのよ そこはreactに丸投げできる これこそHooksの素晴らしさ わかりにくいと感じるのは副作用を意識してなさすぎるから react難しいと言ってる人は関数型言語などの副作用、参照透過性、冪等性、(できればモナド)などその辺りを勉強し直した方が良い 84 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 13:20:29.63 ID:cMXeDUr/.net] >>80 そういう意見もわからんでもない。 ただ、俺はそういう制約はあえてやってると感じるな。一見不便な制約だけど、それがある事によってコードが統制される。React的に正しい書き方に矯正される。 85 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 13:46:47.17 ID:sORVJkOm.net] ドキュメントにフックがトップレベルでしか呼び出せない理由って説明されてるけどな 86 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 13:58:56.69 ID:JF8FJvk5.net] CommentListも再利用前提ならプレフィックスを付けてArticleCommentListにしたらいい ファイル数は増えていくが、コンポーネントをシンプルに保つ恩恵の方が圧倒的にでかい 87 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 14:04:37.79 ID:sORVJkOm.net] 結局はチームで統一されてれば良いって話ではあるけどね 88 名前：デフォルトの名無しさん [2022/01/21(金) 20:32:48.44 ID:mtDqJL7w.net] >>68 axios で投稿一覧取得して vue で表示する処理を書いたけど、 サーバ側でphpのforeachで回してた時htmlspecialcharsでエスケープしたり文字列操作したりしてたことをvue側でせないかんってことだよな？ なかなかめんどくさい気がしてきたがこのあたりどうしてるんだろうか 89 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 21:17:44.47 ID:x9mhjTMm.net] マスタッシュ構文ならふつうにエスケープしてくれるはずだが 90 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 21:24:06.47 ID:6I3Of8sH.net] >>87 逆に今時それを自動でやらないフレームワークなんてあるのか？ 91 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 21:57:20.08 ID:cMXeDUr/.net] dangerouslySetInnerHTMLとかいう長くて物騒なパラメータ名大好き 92 名前：デフォルトの名無しさん mailto:sage [2022/01/21(金) 23:16:24.74 ID:2Ya+eSMz.net] >>69 >サーバーにアクセスするAPIのほうが遅くて そりゃ、データベースの外部キーとか、インデックスの張り方による。 N + 1 問題とか Ruby on Rails の単一テーブル継承とか、多対多・1対多・1対1 とか、 高度資格のdatabase specialist みたいな国家資格とか >>76 >配列の1要素を変更しただけで配列全体が変更されたとみなされて Vue.js では、key を付ければ、他の要素に影響がないけど、 React には、そういう機能が無いの？ 93 名前：デフォルトの名無しさん mailto:sage [2022/01/22(土) 01:22:23.25 ID:ug6tBrwm.net] >>77 まったくないじゃなくて 殆どないって言ってるんだから あるのは最初からわかってるだろ お前ゆとり蚊？ 94 名前：デフォルトの名無しさん mailto:sage [2022/01/22(土) 06:18:54.77 ID:pRWoUPFR.net] はいはい、そうだね。がんばってね 95 名前：デフォルトの名無しさん mailto:sage [2022/01/22(土) 07:19:40.45 ID:SSulEqfs.net] NextAuth.jsって使ってる人いる？ 96 名前：デフォルトの名無しさん mailto:sage [2022/01/22(土) 09:02:27.22 ID:ug6tBrwm.net] >>93 もう終わったよｗ ほんと有名な事例だけ上げて それが全てだと思ってるからアホやで 97 名前：デフォルトの名無しさん mailto:sage [2022/01/22(土) 09:08:30.48 ID:f0z1Aqc4.net] 日本語でおk 98 名前：デフォルトの名無しさん mailto:sage [2022/01/22(土) 17:28:48.01 ID:nygG3ujp.net] 最近はReact優勢らしいけど個人での小規模開発でもVueオワコンなの？ 転職用のポートフォリオの為にGoとVueでウェブアプリケーション作ってるんだけど今からでも変えた方がいいのかしら 99 名前：デフォルトの名無しさん mailto:sage [2022/01/22(土) 17:30:01.75 ID:yOBcCnZH.net] >>97 優勢というかほぼ決着はついた Reactにしとけ vueは未来がない 100 名前：デフォルトの名無しさん mailto:sage [2022/01/22(土) 20:09:13.48 ID:63g4vstf.net] Vueは結局一回も触らんでオワコンなった 我ながら良い選択をしたね 今後メンテナンスしなきゃならん人はご愁傷様

---

---

[ 続きを読む ] / [ 携帯版 ]

read.cgi ver5.27 [feat.BBS2 +1.6] / e.0.2 (02/09/03) / eucaly.net products.
担当:undef