Vue vs React vs Angular Part.2

**デフォルトの名無しさん** · 2019/03/09(土) 22:02:33.71

実際どうなん？
Vue
https://jp.vuejs.org/
React
https://reactjs.org/
Angular
https://angular.io/
-
VIPQ2_EXTDAT: default:vvvvv:1000:512:----: EXT was configured
※前スレ
Vue vs React vs Angular
http://mevius.5ch.net/test/read.cgi/tech/1545395856/

★ここではjQueryの話題は禁止です
★jQuery房が書き込んでも無視してください

**デフォルトの名無しさん** · 2019/05/06(月) 20:44:38.03

SSRってどれくらい必要なんだろうね
GoogleではSSRなしでも正しく識別されるけどYahooだとダメとかそんな感じかな？

**デフォルトの名無しさん** · 2019/05/06(月) 20:53:31.17

そもそもアプリケーションを検索対象にしたいって時点で
使う技術が間違っていることに気づこう

**デフォルトの名無しさん** · 2019/05/06(月) 22:45:00.75

SSRとかSPAとか用語乱立しすぎだろ

**デフォルトの名無しさん** · 2019/05/06(月) 22:57:06.92

今に始まったことじゃないやろ

**デフォルトの名無しさん** · 2019/05/06(月) 23:19:28.31

RとかSRとかSSRとか

**デフォルトの名無しさん** · 2019/05/07(火) 08:33:38.77

>>635
SPAにするならNuxt要らなくね？
PWAと間違えてないか？

**デフォルトの名無しさん** · 2019/05/07(火) 12:29:25.28

SSRはどうにも眉唾なテクだよな。速度だけが目的で下手に実装するとカオスへの入り口。

**デフォルトの名無しさん** · 2019/05/07(火) 16:17:10.88

nuxtは規約があるのがでかい
最低限の秩序はほしい

**デフォルトの名無しさん** · 2019/05/07(火) 19:40:00.66

SSRとかそもそもやろうとしてることが不自然すぎるだろ。

**デフォルトの名無しさん** · 2019/05/07(火) 19:59:43.27

そのうちGoogleとかがSPAとか仮想DOMの方がSEO点数高くなるとかなればいいのにな

**デフォルトの名無しさん** · 2019/05/08(水) 00:07:46.96

SPAとか仮想DOMが使われていて、
かつ検索したいサイトをお前は思いつくか？

**デフォルトの名無しさん** · 2019/05/08(水) 00:11:28.70

検索したいのはデータなんだからいくらでもあると思うが

**デフォルトの名無しさん** · 2019/05/08(水) 00:18:34.32

だからSPAや仮想DOMを使うようなもので
検索したいデータなんてあるのかって話をしてるんだよ

ログインしなきゃ見れない個人情報を検索されたくあるまい？

**デフォルトの名無しさん** · 2019/05/08(水) 00:53:55.69

SPAや仮想DOMを何だと思っているのか

**デフォルトの名無しさん** · 2019/05/08(水) 01:49:25.54

何に学習コスト払うか迷うなぁー

Vue盛り上がってるけど案件ないだろ

**デフォルトの名無しさん** · 2019/05/08(水) 02:23:35.82

やっぱりがっつり使うならAngularだわ
laravelのbladeと混在して使うならVue
jqueryの置き換えがvueの形かなー

**デフォルトの名無しさん** · 2019/05/08(水) 02:36:56.71

>>651
SPAの略のとおりだろ？
シングルページ "アプリケーション"

アプリケーションの内容を検索したいなんて
思わないだろ

**デフォルトの名無しさん** · 2019/05/08(水) 06:36:04.05

コンテンツ内容と関係ないところだと例えば
HTTP/2 > https > http
みたいなSEO優先順位みたいなのあるわけだし

HTML5 > HTML4
UTF-8 > SJIS/EUC
も確かあったはず

SPA対応が今後加点対象になるのは十分ありえると思うけどな

**デフォルトの名無しさん** · 2019/05/08(水) 09:13:29.35

>>655
君は理解していない
SPAは操作によって遷移しなくてもコンテンツ（表示内容）が変わるものだと思ってる
操作が必須

操作によって同じページに異なるコンテンツが表示されることになる
だから検索しても初期のトップページにしか出会わないので意味ないから逆に真っ先に外されるだろう
それにどうやってクローリングするのか？

**デフォルトの名無しさん** · 2019/05/08(水) 09:23:29.72

Google様の考えが貴様ら庶民の及ぶところにあると思ってんの？

**デフォルトの名無しさん** · 2019/05/08(水) 10:52:24.84

スマホネイティブアプリとかいう売上3割もっていくヤクザより
SPAがんばっていこー

**デフォルトの名無しさん** · 2019/05/08(水) 11:03:39.50

SPAがクロールされる最低条件の一つとして
URLとコンテンツ内容が一意に結びついている必要がある。
わかりやすく言えば、F5を押したときに表示されるものだけがクロールされる。

で、たいていのやつはそこまで考えて作ってないｗ

クロールのことは抜きにしても、他の人からねぇ、このサイト見てみてよって
URLを送られてきて見れるようにURLを設計にしないといけない

で、たいていのやつはそこまで考えて作ってないｗ

SPAの時代になってから、"閲覧" するのが面倒なページが増えた。
無限スクロールさせるのは良いが、ページ移動したら位置がリセットされたりな。

SPAサイトはSPAだからという理由でSEO的に減点されることはないが（加点もない）
ページの作りが悪くなりやすいから結果として減点されるページが増える。

**デフォルトの名無しさん** · 2019/05/08(水) 11:09:11.39

あ、もちろん。JavaScriptをうまく取り扱えなくて、
クロールされないとか、JavaScriptで遅いから
減点されるってこはありえる。

結局の所クロールが重要なページはHTMLで作ったほうが良いい。

**デフォルトの名無しさん** · 2019/05/08(水) 16:57:46.59

SPAってVueRouterやReactRouter使ってもSPAだよね？

**デフォルトの名無しさん** · 2019/05/08(水) 19:15:28.81

今はSPAでもurlとコンテンツが一致するのは当たり前だと思うが。

**デフォルトの名無しさん** · 2019/05/08(水) 21:07:08.36

ちゃんと作ってればね。
Vueとかで、変数に値入れればそれがビューに反映される。簡単！って
言ってるレベルじゃ無理。変数に値を入れたところでURLには反映されないから

**デフォルトの名無しさん** · 2019/05/08(水) 21:43:03.66

>>357の件の発表が来ましたよっと

「Flutter for Web」のテクニカルプレビューリリースを発表
https://www.publickey1.jp/blog/19/googleflutter_for_webflutterwebfluttergoogle_io_2019.html

Flutter for web
https://github.com/flutter/flutter_web
https://flutter.dev/web

**デフォルトの名無しさん** · 2019/05/08(水) 21:46:18.86

名前がダサい…

**デフォルトの名無しさん** · 2019/05/08(水) 23:08:40.83

次から次へとええかげんにせいよ…

**デフォルトの名無しさん** · 2019/05/08(水) 23:12:44.98

フラッパーみたいだよね

月刊コミックフラッパーオフィシャルサイト
https://comic-flapper.com
フラッパーとは - コトバンク
https://kotobank.jp/word/%E3%83%95%E3%83%A9%E3%83%83%E3%83%91%E3%83%BC-620981

**デフォルトの名無しさん** · 2019/05/08(水) 23:21:34.90

>>666
よく考えてみよう。

何もしないことが正解ではないか？

**デフォルトの名無しさん** · 2019/05/09(木) 00:10:23.60

韓国の友達とトンカツ食べながら話した（韓国ではトンカツが人気）けど、日本のWebサイトはとても遅れてるそうだ
SPAのサイトが少なくてレガシーだと驚いてたよ
日本っぽいよねと言われて思わずそうだと笑ってしまったよ
この国大丈夫なのかね
まぁ俺は愛着ないから良いけどさ

**デフォルトの名無しさん** · 2019/05/09(木) 01:34:10.79

知らんがな

**デフォルトの名無しさん** · 2019/05/09(木) 01:42:02.41

韓国のアプリが優れてるのはガチ
日本が遅れてるだけかもしれんが

**デフォルトの名無しさん** · 2019/05/09(木) 02:35:48.23

うん。だから韓国にも韓国人にも韓国人が言うことにも興味はない
ここは日本だし、韓国はアメリカですら無い

**デフォルトの名無しさん** · 2019/05/09(木) 06:48:51.12

>>663
付け焼き刃でVuexもVueRouterも使ってない様ななんちゃってVueなんてそもそもこのスレの対象じゃない

**デフォルトの名無しさん** · 2019/05/09(木) 06:55:58.86

>>669
阿部寛さんのホームページディスってんの？

**デフォルトの名無しさん** · 2019/05/09(木) 10:30:33.47

てるまえ

**デフォルトの名無しさん** · 2019/05/09(木) 14:53:26.63

阿部寛のサイトを高速化する - Qiita
https://qiita.com/Morix1500/items/0eac072a027d478a6b83

阿部寛のサイトを超える高速化は
結構むずい

**デフォルトの名無しさん** · 2019/05/09(木) 15:21:50.90

AngularのTS固定は先見てたね

結局ReactもVue(Nuxt)も
規模大きくなれば堅牢化を求めてTSのニーズ高い

**デフォルトの名無しさん** · 2019/05/09(木) 19:18:59.10

AureriaもTSですよっと

**デフォルトの名無しさん** · 2019/05/09(木) 19:35:21.72

tsでreduxとかやりとうない

**デフォルトの名無しさん** · 2019/05/09(木) 19:48:44.53

>>679
なんで？

**デフォルトの名無しさん** · 2019/05/09(木) 23:09:24.89

確かにnuxtでtsやとうとするとサンプルが不十分で躊躇するな。とりあえず公式はTSで記述して欲しい。

**デフォルトの名無しさん** · 2019/05/09(木) 23:14:08.08

TSって何の略？女から男でもTS？

**デフォルトの名無しさん** · 2019/05/09(木) 23:16:14.37

転性（TenSei）物の略じゃなかったのか・・・
転生にかけて転性

**デフォルトの名無しさん** · 2019/05/10(金) 07:11:07.75

trans sexualだろ

**デフォルトの名無しさん** · 2019/05/10(金) 11:28:53.17

https://www.packtpub.com/packt/offers/free-learning
今日の無料教材はAngular Fundamentals with TypeScript [Video]ですよっと

**デフォルトの名無しさん** · 2019/05/10(金) 20:38:35.89

Dart TypeScript どっちかにせい

**デフォルトの名無しさん** · 2019/05/10(金) 21:53:18.09

Dartは2度死ぬ

**デフォルトの名無しさん** · 2019/05/10(金) 22:55:18.75

TA固定は微妙なとこだと思うけどな。
型を軽んじる方も無駄に型信者になる方もどっちも間違ってる印象。

**デフォルトの名無しさん** · 2019/05/10(金) 23:01:59.52

元々サーバーサイドで出力した値をグローバル変数で渡してた部分で変数未定義のエラーがどうしても消えなくてイライラした（ちゃんと動作はしてる）
黙認のエラーは非表示とかできんもんかって思った

**デフォルトの名無しさん** · 2019/05/10(金) 23:04:44.67

ts なら declare 使えば

**デフォルトの名無しさん** · 2019/05/10(金) 23:21:40.79

>>690
ちなAngularだったんだけどそれ書いても上手く行かなかったんよねもしかしたら利用箇所じゃなくapp-module側で書くとかルールがあるのかも知れんけど
その時ググって出たのは大体試したけどダメだったから仕方なくDOM経由で渡す事にした

…っていうよりやっぱReactでいいやって結論に至った

**デフォルトの名無しさん** · 2019/05/10(金) 23:44:17.71

ReactはVueに食われると予測する
堅牢で全部入りのAngularは一定層に
需要あると見るから安定して存在し続ける

**デフォルトの名無しさん** · 2019/05/10(金) 23:56:24.24

実際問題VueからReactに移るって人は居ても逆はないと思うんだよね
両方それなりに触ったけど

**デフォルトの名無しさん** · 2019/05/11(土) 00:01:37.61

実態は>>349

**デフォルトの名無しさん** · 2019/05/11(土) 00:16:31.79

まず*.vueってテンプレート書式がjsxに比べて煩雑というか冗長なんだよね
あとタグの中にv-if、v-forって書くよりもJavaScriptとして制御文を書く方が柔軟だし明快なんだよね

**デフォルトの名無しさん** · 2019/05/11(土) 12:07:13.98

Web　　　/ Native　　　　　　　　/ WebView型
-----
React　　/ React Native　　　　/ Cordova
Vue　　　/ Weex, NativeScript / Cordova
Angular　/ NativeScript　　　　/ Cordova
(Flutter for Web) / Flutter　　 / -

開発
-----
React　　　　　： Facebook
React Native ： Facebook
Vue　　　　　　： (コミュニティ + スポンサー)
Weex　　　　　： Apache Foundation (Alibabaから移管)
Angular　　　　： Google
Flutter　　　　： Google
NativeScript　： Progress Telerik
Cordova　　　： Apache Foundation (Adobeから移管)

**デフォルトの名無しさん** · 2019/05/11(土) 12:18:07.62

GoogleがAngularとFlutterをどう考えるか
TelerikがVueをどれくらい支援するつもりかで
将来への安定性が変わってくる

**デフォルトの名無しさん** · 2019/05/11(土) 12:57:08.42

ちなみにAlibabaは、今はReactに似たフレームワークの
Rax(WebとWeexでのネイティブ対応)の開発を行っているので
Vueへの支援は限定的と思われる

**デフォルトの名無しさん** · 2019/05/11(土) 21:29:48.13

>>692
全部入りを好む奴は総じてプログラマとしてクソ

**デフォルトの名無しさん** · 2019/05/11(土) 21:30:45.78

WeexよりもVueNativeの方がまだいいんじゃないかね

**デフォルトの名無しさん** · 2019/05/11(土) 22:12:47.06

全部入りといえばVisual Studio

**デフォルトの名無しさん** · 2019/05/11(土) 22:59:18.42

>>700
出来の良し悪しはともかく
数が多くなるのと、対象の道連れになるのでラッパー類は除いてる
Ionic、Nuxt、Vue Nativeなど

**デフォルトの名無しさん** · 2019/05/12(日) 01:01:51.46

Reactのインポート地獄をみんなどうしてる？？

よく使うのは、protoとかに生やしてたりすんの？

**デフォルトの名無しさん** · 2019/05/12(日) 01:04:29.59

https://cdn-images-1.medium.com/max/1600/1*a6X55OJdZfefGKE2LFUZ1A.png

こういう感じで、さらにstyled componentとかにすると、さらに増えて完全に地獄なんだが。。

**デフォルトの名無しさん** · 2019/05/12(日) 01:12:25.25

>>704
自分はパスのテーブル作ってループでリストにpushしてから配備してるからRouteとimportが一緒のファイルにはならないな

**デフォルトの名無しさん** · 2019/05/13(月) 16:55:44.14

フレームワークごとのお作法を学ぶ作業しんどい

**デフォルトの名無しさん** · 2019/05/13(月) 22:20:51.61

you 造っちゃいなョ

**デフォルトの名無しさん** · 2019/05/13(月) 22:52:30.18

そして同じようなフレームワークがまたできて、同じように文句言われるわけだ。

**デフォルトの名無しさん** · 2019/05/14(火) 00:13:13.60

ホント普遍的だなこの風刺画ｗｗ
https://imgs.xkcd.com/comics/standards.png
https://naglly.com/archives/2011/07/xkcd-standards.php

**デフォルトの名無しさん** · 2019/05/14(火) 00:51:22.05

jsフレームワークの主流インデントって
スペース2つだけど

見にくくない？4つよくない？

**デフォルトの名無しさん** · 2019/05/14(火) 03:04:17.17

俺も4が好きだが何で2が主流になったんだろうな。残念だ

**デフォルトの名無しさん** · 2019/05/14(火) 03:29:16.91

てかなんでスペース使うの？tabでよくない？

**デフォルトの名無しさん** · 2019/05/14(火) 03:41:22.54

tabは使いこなすのが難しい
他人が見てもずれないようにするために
複雑なルールが必要になる

**デフォルトの名無しさん** · 2019/05/14(火) 03:42:16.89

複雑というより奇妙というべきか
一見なんでこんなルールが必要なんだ？と思うようなルール。
理由を聞けばわかるだろうがそのルールを守るのに神経を使う

**デフォルトの名無しさん** · 2019/05/14(火) 04:08:46.60

言ってる意味がよく分からんから実際に問題となる一例でも挙げてみてくれ

**デフォルトの名無しさん** · 2019/05/14(火) 07:50:55.79

pythonみたいに閉じ括弧ないと2はキツイなと思うけど、jsはそうでもない。

**デフォルトの名無しさん** · 2019/05/14(火) 07:52:39.50

1tab = 1インデント、それ以外の箇所にtab使うなで済むと思うけどな
インデントの異なる行同士で揃えようとしてる人は知らんが

**デフォルトの名無しさん** · 2019/05/14(火) 10:15:18.26

折り返した引数の開始位置とか、メソッドチェーンの書き方とか
あと、代入時の開始位置揃えあたりかね

タブの定義をnスペース単位のパディングとかにせず、前後行との関連での自然な位置ということにすれば、いつでも1タブで良くなるのに。

**デフォルトの名無しさん** · 2019/05/14(火) 10:40:59.88

>>715
タブを使うとインデントとはなにか？という概念の話が始まる（笑）

インデントというのは文字列の前にある空白だが
文字列の前にある空白だからといって必ずしもインデントにはならない。

以下の例ではインデントを _、空白を全角空白で表現している。

_____readyState='loading' # loading: 読み込み中
_____　　　　　　　　　　　　　# interactive: 外部ファイル読み込み中
_____　　　　　　　　　　　　　# complete: 読み込み完了

このような使い分けが必要になる。

インデントの幅は人によって違うため、全てをタブで表現してしまうと
以下のようにずれてしまう。

_____readyState='loading' # loading: 読み込み中
_______________# interactive: 外部ファイル読み込み中
_______________# complete: 読み込み完了

つまりインデントというのは、コードを行単位で見るのではなく
矩形的なブロックと見て、そのブロック全体をずらすことを言う。

見やすさのために桁を揃えるという作業ではなく、意味的に前の行とつながっている行なのか？
という判断が必要になりいちいちタブと空白の使い分けという無駄な作業が増える。

もちろん「このようなコメントの書き方は禁止」というルールを作ればいいんだが
「え？なんでこういう書き方禁止なの？他の書き方は大丈夫？」ということになる。

見やすさのためにやる単純な作業をレビューが必要な作業に変えるのはアホ過ぎる

**デフォルトの名無しさん** · 2019/05/14(火) 11:08:05.03

コードに限らず、このパターンだよな

対象一覧　・A
　　　　　　・B
　　　　　　・C

対象一覧
　・A
　・B
　・C

個人的には後者が好みだが

**デフォルトの名無しさん** · 2019/05/14(火) 11:18:50.33

>>719
俺はそういう定義コメントは上に書く派だからそうはならないな

行の後ろにコメント付けるの自体わりと悪習だと思ってる

**デフォルトの名無しさん** · 2019/05/14(火) 11:34:44.51

コメントはケースの一つということだろう
コードで例を書くなら

r = array([[ 1, 2, 3 ],
　　　　　　 [ 4, 5, 6 ],
　　　　　　 [ 7, 8, 9 ]])

r = array([
　　[ 1, 2, 3 ],
　　[ 4, 5, 6 ],
　　[ 7, 8, 9 ]
])

Pythonなどでは前者がデファクトなのでそれに従う
当然tabも使わない
チーム開発でなくJavaScriptの場合は後者+tabでやってる

**デフォルトの名無しさん** · 2019/05/14(火) 12:47:54.21

>>722
Python使ってるヤツとは宗教的に相いれないというのがよく分かった

**デフォルトの名無しさん** · 2019/05/14(火) 14:08:31.57

>>721
だからそういうことだよ。

> 俺はそういう定義コメントは上に書く派だからそうはならないな

「定義コメントは上に書く派になりましょう。」
というルールができる

**デフォルトの名無しさん** · 2019/05/14(火) 15:06:48.19

python字下げで気付く点は色々書かれてるし賛成だけど
jsの特徴とは違うんだよな
ここはどちらかというとjsのスレだからpythonの字下げルール言われても困るだろうな

**デフォルトの名無しさん** · 2019/05/14(火) 16:24:19.06

>725
JavaScriptの字下げルールとして、正しくタブとスペースを使い分けないとずれるから
「Python風にしない」というのができる時点でダメなんだってｗ
ルールは重要だが、くだらないことにまでいちいちルールを作るなって話

**デフォルトの名無しさん** · 2019/05/14(火) 16:32:22.84

いや、array([の後に配列の第一要素だけ繋げるセンスが理解できんて

そんなん見た目汚いだけやん

**デフォルトの名無しさん** · 2019/05/14(火) 16:52:22.49

Haskellはどんな感じ？

**デフォルトの名無しさん** · 2019/05/14(火) 17:24:40.92

>>726
そういう観点だと
「tabでインデントしない」というルールを作るな
とも言えるのでは？

使い分けの判断を無くしたい場合
Python風の字下げと tabでのインデントが排他的な関係なので
どちらを除くかという話だと思うが

**デフォルトの名無しさん** · 2019/05/14(火) 17:44:50.25

てかまさかと思うけど君たちの使ってるエディタが半スペ、全スペ、tabが見た目で区別できないの使ってるとかは流石に言わないよね？

**デフォルトの名無しさん** · 2019/05/14(火) 18:07:34.96

気色悪い色になるよう設定してる

**デフォルトの名無しさん** · 2019/05/14(火) 18:20:38.62

Gatsby使ってる人いる？

**デフォルトの名無しさん** · 2019/05/14(火) 18:56:52.05

なんでこういうしょうもないシンタックスの話って盛り上がるんだろうな。
エディタ論争といいクソとしか思わんのだけれど。

**デフォルトの名無しさん** · 2019/05/14(火) 20:03:19.19

>>729
tabでインデントしないというのは、
入力、または保存時に自動的に変換できる
テキストエディタが大半なのでツールに任せることができる

使い分けっていうのは人間の努力が必要でルールを「人間が守る」するしか無い

**デフォルトの名無しさん** · 2019/05/14(火) 20:05:02.13

>>730
見た目で区別できるから、ずれて表示されたとしても
脳内で補完できるとか言わないよね？

見た目で区別できるから、ずれて表示された原因がタブだとわかったら
タブ使うんじゃねーよって思うだけなんだが（笑）

**デフォルトの名無しさん** · 2019/05/14(火) 20:23:32.97

lintしろよ

**デフォルトの名無しさん** · 2019/05/14(火) 21:46:22.04

そう。lintの対応の話ね。
>>719のようにタブと空白を混ぜるとlintでは対応できない

結局、空白に統一するほうが楽という話。
こんなこと、時間をかけるような所じゃないから

**デフォルトの名無しさん** · 2019/05/14(火) 23:05:58.95

インデント以外の空白文字は一律1spaceに置き換えるくらいの方が良いと思うがな。
複数人開発なら特に。
空白並べて隣の行と桁合わせするとかあほくさ。