Vue vs React vs Angular Part.3

■ このスレッドは過去ログ倉庫に格納されています
1デフォルトの名無しさん
垢版 |
2019/06/12(水) 19:04:55.46ID:x67noP4p
実際どうなん？
Vue
https://jp.vuejs.org/
React
https://reactjs.org/
Angular
https://angular.io/
※前スレ
Vue vs React vs Angular Part.2
https://mevius.5ch.net/test/read.cgi/tech/1552136553/
※前前スレ
Vue vs React vs Angular
http://mevius.5ch.net/test/read.cgi/tech/1545395856/

★ここではjQueryの話題は禁止です
★jQuery房が書き込んでも無視してください
2020/06/01(月) 20:52:59.65ID:M7ivFsPk
>>437
隠してるだけじゃんｗ
データが刻々変化するWebアプリみたいなものは全然念頭に無いんだろうな。
2020/06/01(月) 21:31:57.98ID:0Y4JhCWi
>>455
底辺組み込みをそこまで自慢しなくてもw
2020/06/01(月) 21:33:22.10ID:0Y4JhCWi
>>456
そう
それは俺が前からここで言ってる
いまWebComponentを策定中だからあくまでもそれまでの繋ぎでしかない
2020/06/01(月) 21:33:28.89ID:xlNGyQiU
>>457
だから具体例を言えと言ってる
データが刻々変化する？だからなんだ？
CSSでグラフでも作ってwidthの%で表現すればいいんか？

って簡単に俺に反論されるやろ？
だからできないような具体的な例を考えてこいと言ってる
2020/06/01(月) 21:35:46.98ID:xlNGyQiU
>>459
WebComponent登場でVue、React、Angularの設計が大きく変わって
また覚え直しになるのが目に見えてるんだよなｗ

WebComponentだと配布の容易性からフレームワークを
使わないで実装するのが流行るだろう

jQueryはそのコンポーネント同士を繋ぐ役目をするものだから
WebComponentの時代でも生き残る
2020/06/01(月) 21:42:45.19ID:M7ivFsPk
>>460
具体例って、

<ul>
<li>A</li>
<li>B</li>
<li>C</li>
</ul>

を

<ul>
<li>A</li>
<li>B</li>
<li>C</li>
<li>D</li>
</ul>

にするとかそういうレベルで言わないと理解できないんだろうか。
2020/06/01(月) 21:48:41.87ID:xlNGyQiU
>>462
そうそう。そんなんでいい。それをVueとか好きなフレームワークで書いてみ
2020/06/01(月) 21:49:22.79ID:xlNGyQiU
っていうか、最初の例じゃねーかｗ
それ要素を非表示にするだけでいいだろ
なんでそんな事しねぇといけなんだ。
そこからちゃんと説明しろって
2020/06/01(月) 22:14:07.76ID:M7ivFsPk
スタイルで非表示にすればいいじゃんてのは結局直接DOM操作するのが大変だからだよなぁ。
UNIXのtopコマンドみたいなのはただ隠すだけじゃ無理があるし。
2020/06/01(月) 22:23:29.85ID:lf51+gry
>>406
寧ろコンソールへの表示の有無で解凍速度変わるって知らんの？
画面表示って結構オーバーヘッドなんやけど
2020/06/01(月) 22:39:38.12ID:80Xi+K8a
場末のスナック＝コボル＝jQuery
2020/06/01(月) 22:41:03.24ID:0Y4JhCWi
>>461
覚え直しなわけねーじゃん
jqueryごときで脳みそ固定されてっからお前には苦痛だろうが新しく出たって1日で覚えられるわい
2020/06/01(月) 23:11:58.91ID:betc8EO5
jquery先生マジでwebアプリ知らんのなｗ
2020/06/01(月) 23:15:49.58ID:xZL8Ap71
>>466
いや、だからjavascriptでそれにあたるものはなんなんでしょうか？という質問なんですけど…
2020/06/01(月) 23:23:52.92ID:xZL8Ap71
正直なところリアルDOMと仮想DOMの関係をtarコマンドに例えられたのが理解できず混乱してしまったんですが、この例えって適切なんでしょうか？
2020/06/01(月) 23:33:51.15ID:mCx+eQal
このスレの内容読んでも正しい理解から遠ざかるだけだよ
2020/06/01(月) 23:43:52.04ID:QvRK6jc/
>>404、>>466
この2つの書き込みのわかってる感はすごい。
きっと明快な説明をしてくれるはず。
2020/06/02(火) 06:14:17.57ID:YnHhgZXY
>>465
だから自分で無駄なアルゴリズム（つまり仮想DOM）考えて
無駄なアルゴリズム効率化したよ！っていうのはやめろと
最初から軽量なアルゴリズムを使えばいい
隠すだけでいいなら隠すだけでいい

> UNIXのtopコマンドみたいなのはただ隠すだけじゃ無理があるし。
一つのテキストエリアに代入すればいいだけでは？ｗ
2020/06/02(火) 06:15:58.34ID:YnHhgZXY
>>468
> 覚え直しなわけねーじゃん

ん？捨てるだけっていいたいんですかね？ｗ
今までフレームワークで作っていたものが
ブラウザネイティブでできるようになったから
フレームワークは不要になると

どこかで聞いた話ですなぁｗ
2020/06/02(火) 07:48:36.94ID:PNH+YxIC
>>474
>一つのテキストエリアに代入すればいいだけでは？ｗ

結局、リストやテーブルで>>436のような更新を効率よくやるのはあきらめたと。
2020/06/02(火) 08:25:02.26ID:YnHhgZXY
>>476
効率（？）よりも素早く表示できることが重要じゃね？
2020/06/02(火) 10:35:55.98ID:aF6gXvXJ
Webアプリ作れないのにわざわざjqueryサイコーしに来るなゴミ
2020/06/02(火) 13:42:07.54ID:EzV2+lxf
>>478
嫌なら見るな
2020/06/02(火) 14:44:07.39ID:Jz8TBM1T
フレームワークを使った場合とそうでない場合の比較をこのスレでしても本題が進まないしな。俺はjqueryをNGにすることにしたよ。
2020/06/02(火) 14:47:06.27ID:Jz8TBM1T
jqueryおじはフレームワークの普及などで、プログラミングが簡単なものになっていくのが我慢できないタイプの人なんだと思う。(よくいる)
彼らの楽してプログラムする人への嫌がらせは絶対に止めさせられないと思うのでNGするしかないよ。
2020/06/02(火) 14:49:13.98ID:Jz8TBM1T
気持ちはわかるけどね。
プログラムの敷居が下がることは自分自身の価値の低下に繋がるし、自分が技術習得のために費やした時間が無駄になるように感じてしまう。この感覚は本当に怖いもんだ。
2020/06/02(火) 14:55:08.02ID:EzV2+lxf
>>481
逆だな。シンプルでいいものを古いってだけで複雑化させるなと
手段が目的になってることに警告している
2020/06/02(火) 16:14:12.52ID:Jz8TBM1T
>>483
いやだからその話はスレチなのよ。ここはフレームワークを使うことを前提に話すところだからね。
あなたの指摘について話してると本題が進まないから皆迷惑してる。
2020/06/02(火) 16:19:26.38ID:XUL0AfH0
このスレは統合失調症に住み着かれてしまったんだ、あきらめろ。
統失は自分の頭の中と人の頭の中の区別がついてないらしいから、自分が迷惑してなければまさか他人が迷惑しているなんて想像もつかないらしいぞ。オワタ
2020/06/02(火) 20:51:59.38ID:PNH+YxIC
>>477
結局>>420の指摘の通りなんだろ？
生DOMで最適な操作がすぐわかるならやるけどそうでなけりゃDOM操作以外でお茶を濁すと。
2020/06/02(火) 21:20:05.39ID:y2pssUuQ
ここからUIコンポーネントのライブラリについての話
2020/06/02(火) 22:53:42.91ID:22TYrFrm
emotion と styled-component ってどっちがおススメ？
2020/06/02(火) 23:36:43.83ID:HsElvnUb
>>486
生DOMで最適な操作がわからないことを
今までやったことがあるか？
2020/06/03(水) 00:49:20.55ID:IabKp2q1
フレームワーク使わないとサーバーとの通信回線が大分増えそう
2020/06/03(水) 02:37:33.67ID:8UYALONQ
増えそう（予想ｗ）
2020/06/03(水) 07:20:24.72ID:XM98eiL0
ReactはJSXが慣れなかった
Blazorは生HTMLそのまま書けてとても良い
ただ速度は遅いのか・・・容量重い見たいだし
2020/06/03(水) 08:18:46.73ID:PFUYBSjI
>>489
>>436のように状況によって判断する必要があって最適操作というものが多岐にわたる場合はあるよな。
実際jQuery君は逃げたし。
494デフォルトの名無しさん
垢版 |
2020/06/03(水) 12:19:20.95ID:acb2GgKY
>>493
おい、勝手に逃げたことにするなよｗ
仕事しろよｗ
495デフォルトの名無しさん
垢版 |
2020/06/03(水) 12:20:40.45ID:acb2GgKY
っていうか逃げたって言うほどレス進んでねーじゃんｗ

> >>436のように状況によって判断する必要があって最適操作というものが多岐にわたる場合はあるよな。

だからやったことがあるのかと
2020/06/03(水) 12:44:29.95ID:JLhL0PQJ
アーナル
497デフォルトの名無しさん
垢版 |
2020/06/03(水) 12:49:02.20ID:acb2GgKY
あとフレームワークなら最適だっていうけど、
本当に最適になってるのかという問題がある

A
B
C

を

C
B
A

に書き換える場合、一体何回のDOM操作を行うのか？
そこがはっきりしないといかんよな
2020/06/03(水) 13:02:55.71ID:Y4Wo8X9c
頼むからその話もうやめてくれ…
499デフォルトの名無しさん
垢版 |
2020/06/03(水) 13:03:48.50ID:acb2GgKY
嫌なら見るなｗ
2020/06/03(水) 13:09:37.28ID:iKVvtebg
荒らしにかまうな。このスレには荒らしが住み着いている。その事実を受け入れろ。
2020/06/03(水) 14:17:44.99ID:llXSixd1
Angular派ってどこにいるの
2020/06/03(水) 22:58:56.19ID:7+I+fFTj
angular派ってめんどくさいけど覚えたコスト無駄にしたくないから使ってるってだけでしょ
2020/06/03(水) 23:30:27.85ID:IabKp2q1
ソートこそ最後の最終結果だけを描画する仮想DOMで早くできる分野なんじゃない？
2020/06/04(木) 01:22:45.15ID:LYOI3JL5
俺はReact使ったことない、Vueは超簡単な入門書一冊やっただけ、でangular使ってる。用途は自社サーバーの管理ツールとして使用するwebサイト開発。
もともとWPFでデスクトップアプリの開発の経験があったんだが、それと似てるからかすっと馴染んで凄く使いやすいと思ってる。
まあそもそもフロントエンドは一般教養レベルの技術しか持ってないところから始めたから感覚が全然違うだけなんかな。
2020/06/04(木) 01:33:13.27ID:LYOI3JL5
Angularでありがたいのは、公式サイトのドキュメント一通り勉強して身に付けた定石に従えばOKなところかな。
ReactとVueはあまり詳しくないのでわからないけど、フロントエンド開発は何が正攻法なのかわからなくて悩んでしまうイメージがある。もちろん経験が浅い故の悩みなんだろうけど。
2020/06/04(木) 01:49:57.54ID:od5oT+Sf
Webフロントエンドはまだ流行り廃りが激しいから、どれが正解とかは一概には言えない部分がある
が旧来のやり方で作られてるものだろうとなんだろうとWeb標準に従っていれば今後動かなくなるということはまずないので、そこは安心していい（ライブラリやフレームワークが保守されなくなることはあるが）
これから新しくやるならとりあえずそのとき一番流行ってるものを使ってみるといいと思う
トレンドの追い方は色々あるだろうけど、今から把握するならこことかおすすめ
https://2019.stateofjs.com/front-end-frameworks/
507デフォルトの名無しさん
垢版 |
2020/06/04(木) 06:02:07.69ID:L+E/1jGT
>>503
実際に速いのかどうか。やってみないとわからない。
508デフォルトの名無しさん
垢版 |
2020/06/04(木) 06:03:24.48ID:L+E/1jGT
>>505
> フロントエンド開発は何が正攻法なのかわからなくて悩んでしまうイメージがある。
そうではなく絶賛開発中だからだよ
一年後にはやり方が変わってる
509デフォルトの名無しさん
垢版 |
2020/06/04(木) 06:50:57.10ID:KwTRcPMk
Javascript はweb制作管理板、CGI はWEBプログラミング板へ。
2020/06/04(木) 07:47:14.48ID:Efp7l1XA
>>495
ああ、書き方が悪かったな。DOMを使わない手段で逃げたということ。
仮想DOMの効率を比較するうえで挙げた例なのにな。
511デフォルトの名無しさん
垢版 |
2020/06/04(木) 07:48:59.07ID:q5ejfX+g
>>510
手段が目的になってるね
フレームワークの欠点はCSSベースのよりよい方法
軽くてシンプルな方法が採用できないってのも上げておくか
2020/06/04(木) 08:14:52.94ID:Efp7l1XA
最初に挙がった話がDOM操作の効率比較なんだから当たり前。頭沸いてんのか？
それと、なんでフレームワークだとCSSが使えないと思い込んでいるんだろう。
2020/06/04(木) 09:21:09.23ID:H8bkblOq
どうしてもこのスレでその話を続けないといけないのか？
514デフォルトの名無しさん
垢版 |
2020/06/04(木) 10:59:00.78ID:q5ejfX+g
>>512
フレームワークでDOM操作効率化なんてしてんの？
俺ならHTML文字列を組み立てて代入するだけだなぁ
これならDOM操作は一回じゃね？
2020/06/04(木) 12:41:52.47ID:ph5uM4S6
>>514
DOM構築後は固定かよ
クソじゃん
516デフォルトの名無しさん
垢版 |
2020/06/04(木) 13:30:21.25ID:q5ejfX+g
>>515
フレームワーク使って変えるよりも
jQuery使って変えたほうが効率的ってことだよ
2020/06/04(木) 13:51:39.87ID:cVL0kVhl
こちらに適切なスレがあるからこっちで話してね

Vue vs React vs Angular vs jQuery Part.3
https://mevius.5ch.net/test/read.cgi/tech/1560333177/
518デフォルトの名無しさん
垢版 |
2020/06/04(木) 13:54:38.79ID:q5ejfX+g
向こうのスレでも答えが出てるなｗ

> 文字列でhtml作ってdivにまとめてブチ込むのが簡単だし高速
519デフォルトの名無しさん
垢版 |
2020/06/04(木) 13:59:59.62ID:KwTRcPMk
いまHTML5パーサー書いてて一通りの実装が済んだんだけど、次の部品を製造するとしたら、何が求められるんだろね？
パーサーのテスト実装が途中の状態だけど。
520デフォルトの名無しさん
垢版 |
2020/06/04(木) 14:02:39.64ID:KwTRcPMk
WHATWG Encoding standardとWHATWG HTML Standard の Parsing まで実装した。
Chromeがどうやら属性値のエスケープなどごく一部を除いて改行の移動する位置まで厳格に仕様通りなので、Chromeの出力をテストデータにしてるけど。
521デフォルトの名無しさん
垢版 |
2020/06/04(木) 14:03:39.87ID:KwTRcPMk
というより、Chromeのアルゴリズムをそのまま仕様にしてるのかね。
522デフォルトの名無しさん
垢版 |
2020/06/04(木) 14:10:11.05ID:KwTRcPMk
Chromeがなぜ属性値のエスケープを仕様通りにしないのかも気になる。
パーシングと直列化を繰り返すと危険なHTMLに変化させることが出来るのだろか？
もしそうなら仕様の方を修正してほしい。
2020/06/04(木) 14:17:30.84ID:S0nAIzUJ
もしかしてVueってLaravelがサポートしてるからぺちぱーがなだれ込んだだけのうんち？
524デフォルトの名無しさん
垢版 |
2020/06/04(木) 14:19:12.71ID:KwTRcPMk
トークン化ステージ（字句解析に相当）が3000行、木構築ステージ（構文解析に相当）が5000行程度だった。
横にいくらでも伸ばすスタイルなので、80行縛りとかある人なら倍に膨らむだろうけど。
個人で書けない分量ではなかった。

これ、木であるという縛りがあるので、アルゴリズムが不必要に複雑化してるよね。
自分が一から設計するなら別の方法を使うだろな。
2020/06/04(木) 14:20:17.32ID:7GmwQE7C
Vueはうんちだよ。敷居の低さだけが売りさ。
2020/06/04(木) 14:20:32.13ID:uCxAA6/g
CRAは「使えない」みたいな意見たまにあるけどそうなの
527デフォルトの名無しさん
垢版 |
2020/06/04(木) 14:21:08.20ID:q5ejfX+g
jQueryと関係ない話はやめてください！
528デフォルトの名無しさん
垢版 |
2020/06/04(木) 14:21:56.21ID:KwTRcPMk
板違いスレだし何でもありなんじゃないの？
2020/06/04(木) 14:23:57.86ID:7GmwQE7C
このスレは荒らしの割合が多すぎてダメだな。さらば。
530デフォルトの名無しさん
垢版 |
2020/06/04(木) 14:24:26.76ID:KwTRcPMk
しかしこれだけ複雑怪奇なアルゴリズムだと、すべてのパスを通すようにテストを書くとしても、テストにはならないよね。
こんなのはどうしたら良いのか。
まあ全部で2万行台のソースに対して、テストが100万行とかなりそうだし、すべてのパスを通すってのがもう無理だけど。
531デフォルトの名無しさん
垢版 |
2020/06/04(木) 14:25:22.67ID:KwTRcPMk
>>529
俺はHTMLの専門家がいると聞いて質問してるだけで、荒らしてるわけじゃないぞ。
532デフォルトの名無しさん
垢版 |
2020/06/04(木) 14:27:42.88ID:KwTRcPMk
ちなみに使った言語はC++17ですハイ。
トークンの型をテンプレートで受け取ってconstexprで判定の一部をコンパイル時に移動することで、高速化を図りました。
これはイイ！やりかた。
533デフォルトの名無しさん
垢版 |
2020/06/04(木) 14:30:04.63ID:KwTRcPMk
一番聞きたいのは、次何作れば良いかなってことだけども。
URL Standardだろか？

二番目が、こんなわけわからん仕様の場合、テストはどうするべきか？ってことだけども。
2020/06/04(木) 21:48:18.48ID:yu2YMObw
>>517
そっちはjqueryおじさん隔離スレとして使って下さい
2020/06/04(木) 21:49:22.38ID:wotyavku
vue.jsのどこが敷居低いんだよ。
再帰とデータ構造が判ってないと本を読んでも
ネタ化するだけじゃん。
536デフォルトの名無しさん
垢版 |
2020/06/04(木) 22:11:46.48ID:hC0MsN2x
Ruby on Rails でも、Bootstrap を使うには、jQuery が必要

他には、React。Vue.js は少ない。
Angular はいない

HTML の部分木を作るのは、JavaScript のDocumentFragment
2020/06/04(木) 22:51:34.74ID:xU6gLBpw
>>535
導入の敷居は低いけど習得の敷居は…って感じだね
2020/06/04(木) 22:52:41.77ID:xU6gLBpw
動画サイトなんかはReact使ってるとこ結構多いよね
2020/06/04(木) 23:00:32.29ID:LYOI3JL5
敷居が低い・高いってのはある場所に入ることに対する難度を示す言葉だからな。
「習得の敷居が高い」とは言わないでしょ。
2020/06/04(木) 23:01:35.09ID:LYOI3JL5
個人的にはangularも十分敷居が低いと感じたけどね。
541デフォルトの名無しさん
垢版 |
2020/06/05(金) 03:58:41.39ID:/s+vLyih
Vue.jsでページ離脱時に「このサイトを離れますか？」を表示する
https://qiita.com/kimuchan/items/7d9de3adb95bcdc0a662

なんでこんなに複雑なんですか？
普通ならたったの4行でできることなのに

window.onbeforeunload = function(e) {
e.preventDefault();
return '';
};
2020/06/05(金) 04:52:54.91ID:n135C4CO
SPAのルーター使ったページ遷移は特殊でページ遷移したように見えても
スクリプトとかDOMツリーを丸ごと破棄するわけじゃないから
543デフォルトの名無しさん
垢版 |
2020/06/05(金) 12:55:00.26ID:EqTjbYji
インタラクティブなサイトを作る場合reactやvueなどのライブラリを使うと幸せになれます。

静的なサイトにはreactは必要ないです。もっと言うとjQueryも必要なくてvanillajsで事足ります。

そういう意味でもjQueryを使う必要はどんどんなくなっていきます。
544デフォルトの名無しさん
垢版 |
2020/06/05(金) 13:12:24.80ID:/s+vLyih
vanillajsよりもjQueryの方が簡単に書けるってことを
否定した記事は見たことないんだけど？
545デフォルトの名無しさん
垢版 |
2020/06/05(金) 13:39:10.21ID:EqTjbYji
記事もあくまでも個人の感想だから、記事があるからと言って簡単ということにはならないと思うが。

それはさておき、jQueryなら、こうかけるのに〜と嘆きたくなるなら、そういう風にvanillaで実装すればいいだけでは？
546デフォルトの名無しさん
垢版 |
2020/06/05(金) 14:00:50.79ID:/s+vLyih
>>545
オレオレライブラリを作れっていう話なら、技術ノウハウが共有できないので却下します。
547デフォルトの名無しさん
垢版 |
2020/06/05(金) 14:21:45.83ID:EqTjbYji
>>546
数が多ければそうなんだけど、今はjQueryにしかない関数って少なくないよね？
548デフォルトの名無しさん
垢版 |
2020/06/05(金) 14:22:45.02ID:/s+vLyih
>>547
jQueryの方が簡単にかける関数は多いです。
簡単にかける＝テストすべきコードも少ない
549デフォルトの名無しさん
垢版 |
2020/06/05(金) 14:27:37.54ID:EqTjbYji
>>548
例えば？？

jQuery側がテストしてる前提だからその、イコールは成り立つけど全てに当てはまるものではないね
550デフォルトの名無しさん
垢版 |
2020/06/05(金) 14:33:13.16ID:/s+vLyih
>>549
例えば動的にA要素が増減する場合に対応した
イベントハンドラの定義

$(document).on('click', 'a', function() {
・・・
});
2020/06/05(金) 14:59:35.78ID:p4hV8+at
また荒らしがわいてる
2020/06/05(金) 15:05:24.13ID:KA6Po/JQ
フレームワークの存在意義すら理解できないようなら参加しないでほしい
553デフォルトの名無しさん
垢版 |
2020/06/05(金) 15:20:16.53ID:EqTjbYji
react、vueなどのフレームワークの存在意義は理解しているが
多くのサイトはwebcomponentsでいいじゃんと思ってしまう。
554デフォルトの名無しさん
垢版 |
2020/06/05(金) 16:09:30.64ID:Uv2w5eYU
Webcomponentsがゴミに見えてしまうのは僕の頭が悪いからでしょうか。
2020/06/05(金) 16:14:52.09ID:nTqC6OPt
フレームワークの存在意義なんて楽して書ける、低水準な話を理解してなくても書ける、の2点に尽きるんじゃないの？
556デフォルトの名無しさん
垢版 |
2020/06/05(金) 16:15:49.92ID:EqTjbYji
>>554
どこがゴミなのか教えてほしい
557デフォルトの名無しさん
垢版 |
2020/06/05(金) 16:35:48.12ID:Uv2w5eYU
逆にどこが良いんでしょうか？
■ このスレッドは過去ログ倉庫に格納されています
5ちゃんねるの広告が気に入らない場合は、こちらをクリックしてください。
ニューススポーツなんでも実況