探検
Vue vs React vs Angular
■ このスレッドは過去ログ倉庫に格納されています
1デフォルトの名無しさん (ワッチョイ 5f9f-WCtl)
2018/12/21(金) 21:37:36.86ID:NZqrEm960実際どうなん?
Vue
https://jp.vuejs.org/
React
https://reactjs.org/
Angular
https://angular.io/
VIPQ2_EXTDAT: default:vvvvv:1000:512:----: EXT was configured
672デフォルトの名無しさん (アウアウカー Sa6b-cbQp)
2019/03/04(月) 12:35:52.25ID:yQsTNF7Xa >>671
詳細なデザインがないと出来ないこと以外の全部
詳細なデザインがないと出来ないこと以外の全部
673デフォルトの名無しさん (アメ MM3b-Z6MB)
2019/03/04(月) 13:01:07.29ID:enTqHBl5M ハハハ
674デフォルトの名無しさん (ワッチョイ d714-W5e4)
2019/03/04(月) 14:17:57.52ID:fPP1emsu0675デフォルトの名無しさん (ワッチョイ 9f11-Z6MB)
2019/03/04(月) 14:49:51.44ID:vM9NvnRR0 見た目のない動きか
文字列かな
文字列かな
676デフォルトの名無しさん (ワッチョイ d714-W5e4)
2019/03/04(月) 15:18:45.40ID:fPP1emsu0 かっこいい見た目といったのに
全く何も表示がないものと解釈するのか
馬鹿なのかな
全く何も表示がないものと解釈するのか
馬鹿なのかな
677デフォルトの名無しさん (ワッチョイ f7f9-nqcu)
2019/03/04(月) 15:36:50.66ID:ldzpTYWZ0 僕のおちんちんも激しく動きます
678デフォルトの名無しさん (ワッチョイ 9701-86aK)
2019/03/04(月) 16:46:58.11ID:gIkfSPyQ0 >>672 >>674
例えばこんな感じを想定して作り始めて
https://i.imgur.com/kwOSd6U.jpg
デザイナからこれが来たら割と手戻ったりしない?
https://i.imgur.com/Q9xaols.png
他の例
https://i.imgur.com/gb8zhRE.jpg
https://i.imgur.com/EDbn41B.png
https://i.imgur.com/H1gSLxX.jpg
例えばこんな感じを想定して作り始めて
https://i.imgur.com/kwOSd6U.jpg
デザイナからこれが来たら割と手戻ったりしない?
https://i.imgur.com/Q9xaols.png
他の例
https://i.imgur.com/gb8zhRE.jpg
https://i.imgur.com/EDbn41B.png
https://i.imgur.com/H1gSLxX.jpg
679デフォルトの名無しさん (アウアウカー Sa6b-cbQp)
2019/03/04(月) 17:04:13.55ID:yQsTNF7Xa >>678
そういうのは手戻りではなく設計不足というのですよ
そういうのは手戻りではなく設計不足というのですよ
680デフォルトの名無しさん (ワッチョイ 9701-86aK)
2019/03/04(月) 17:14:40.72ID:gIkfSPyQ0681デフォルトの名無しさん (アウアウウー Sa9b-aIXG)
2019/03/04(月) 19:04:00.56ID:kaSUrRDqa デザインとロジックの分業は分かるが
結局フロントロジックとバックロジックの分業なんてしたって無駄なんだよ
結局フロントロジックとバックロジックの分業なんてしたって無駄なんだよ
682デフォルトの名無しさん (オッペケ Sr0b-5hgX)
2019/03/04(月) 20:44:55.78ID:hdL+Fhbir >>678
おれこのくらい他人のデザインも不要だしモックなくても頭の中でデザインできるからすぐにコーディングできるわ
なんなら数パターンのデザインを一つのソースで作ることもできる
さっきから言ってることだが、フルスタックはデザインもコーディングも「同時進行」で作業するんだよ
デザインしてからコーディングをやるんじゃないから
おれこのくらい他人のデザインも不要だしモックなくても頭の中でデザインできるからすぐにコーディングできるわ
なんなら数パターンのデザインを一つのソースで作ることもできる
さっきから言ってることだが、フルスタックはデザインもコーディングも「同時進行」で作業するんだよ
デザインしてからコーディングをやるんじゃないから
683デフォルトの名無しさん (ワッチョイ 9f02-UbqP)
2019/03/04(月) 21:38:41.81ID:0mKT+E5t0 SPAじゃなくPWAってこれから流行るの?
684デフォルトの名無しさん (ワッチョイ d714-W5e4)
2019/03/04(月) 22:18:18.82ID:fPP1emsu0 >>678
手戻りが出ないように最初のざっくり方針を決めとこうな
手戻りが出ないように最初のざっくり方針を決めとこうな
685デフォルトの名無しさん (ワッチョイ d714-W5e4)
2019/03/04(月) 22:19:37.95ID:fPP1emsu0686デフォルトの名無しさん (ワッチョイ d714-W5e4)
2019/03/04(月) 22:20:44.65ID:fPP1emsu0 どうしてもデザインが完成しないとコーディングが出来ないって言うなら、
相手にデザインさせている間、自分は違う仕事をやればいいだけだし
相手にデザインさせている間、自分は違う仕事をやればいいだけだし
687デフォルトの名無しさん (オッペケ Sr0b-5hgX)
2019/03/04(月) 22:42:20.42ID:hdL+Fhbir688デフォルトの名無しさん (ワッチョイ 9f02-UbqP)
2019/03/04(月) 22:51:08.65ID:0mKT+E5t0 人数増えた分だけ作業が速くなると錯覚してる大企業体質に何言っても無駄だと思うよ
689デフォルトの名無しさん (ワッチョイ ff8f-x13U)
2019/03/04(月) 23:01:25.29ID:VXdcZokm0 なんで極論同士で争うんだ?
開発規模(複数プロジェクトの合計の規模も含む)が大きくなって一人じゃできないから分業が発生するってだけだろ?
みんな一人でやった方が効率がいいとわかってるし、一人じゃ限界があるってわかってるんだよな?
開発規模(複数プロジェクトの合計の規模も含む)が大きくなって一人じゃできないから分業が発生するってだけだろ?
みんな一人でやった方が効率がいいとわかってるし、一人じゃ限界があるってわかってるんだよな?
690デフォルトの名無しさん (ワッチョイ ff2c-Im2K)
2019/03/04(月) 23:05:47.91ID:Gt0dR1DD0 人数が増えるほど、すり合わせコストが掛かるから、単純な掛け算にならない。
意思疎通・教育コストが掛かる
仕事量 = 単位仕事量 * 人数 * (1 - すり合わせコスト)
1 - すり合わせコストが、人数が増えると、
0.8 から、0.5 まで、ドンドン下がっていく
工場で言う、段取りコスト・間接作業。
直接作業をするのに必要な、作業
だから、プログラマーのように難しい仕事は、単純に人数を増やしていけない。
人数効果があるのは、すごく簡単な単純作業の場合だけ
こういうのは、中小企業診断士・MBA のテキストに書いてある
意思疎通・教育コストが掛かる
仕事量 = 単位仕事量 * 人数 * (1 - すり合わせコスト)
1 - すり合わせコストが、人数が増えると、
0.8 から、0.5 まで、ドンドン下がっていく
工場で言う、段取りコスト・間接作業。
直接作業をするのに必要な、作業
だから、プログラマーのように難しい仕事は、単純に人数を増やしていけない。
人数効果があるのは、すごく簡単な単純作業の場合だけ
こういうのは、中小企業診断士・MBA のテキストに書いてある
691デフォルトの名無しさん (ワッチョイ ff8f-x13U)
2019/03/04(月) 23:06:55.42ID:VXdcZokm0 重要なのはいかに効率よく分業するかだろ?
692690 (ワッチョイ ff2c-Im2K)
2019/03/04(月) 23:11:34.47ID:Gt0dR1DD0 でも複数人数の良い点も多い
視野が広くなる。
一人じゃ気付かない事に、気付く
教育にも良い。
ペアプログラミングは、非常に効果的
一見、損に思うけど、
教育効果により品質が向上して、後で十分に取り戻せる
視野が広くなる。
一人じゃ気付かない事に、気付く
教育にも良い。
ペアプログラミングは、非常に効果的
一見、損に思うけど、
教育効果により品質が向上して、後で十分に取り戻せる
693デフォルトの名無しさん (アメ MM3b-Z6MB)
2019/03/04(月) 23:24:38.44ID:56/JbqfwM Web制作板行けやカス
694デフォルトの名無しさん (アウアウカー Sa6b-cbQp)
2019/03/04(月) 23:32:05.12ID:/Cs1xWTia >>692
辞めなければな!
辞めなければな!
695デフォルトの名無しさん (ワッチョイ 9701-lqfU)
2019/03/05(火) 05:46:36.86ID:437fdADv0 >>694
そういう発想だから辞められるんだよ。
そういう発想だから辞められるんだよ。
696デフォルトの名無しさん (ワッチョイ 9701-IHXa)
2019/03/05(火) 07:55:43.10ID:N2s6BYvr0 >>684
「デザイン」の定義が食い違ってるのかもね
それはデザインを先に固めるって言うんだ
同時進行してない
デザインは設計だと考えてるからこそ>>668に疑問を持ったわけ
こういったこと
https://uxdesign.cc/designchallenge-cd7bdb589855
「デザイン」の定義が食い違ってるのかもね
それはデザインを先に固めるって言うんだ
同時進行してない
デザインは設計だと考えてるからこそ>>668に疑問を持ったわけ
こういったこと
https://uxdesign.cc/designchallenge-cd7bdb589855
697デフォルトの名無しさん (ワッチョイ d714-W5e4)
2019/03/05(火) 11:20:44.07ID:YFVILFEb0698デフォルトの名無しさん (アメ MM3b-Z6MB)
2019/03/05(火) 11:43:17.86ID:DIrFqE8lM 「ざっくり方針決める」だけで給料もらえて納期遅れを下流のせいにできるなんて……
……なんていい仕事なんだ!俺がやりたい!
……なんていい仕事なんだ!俺がやりたい!
699デフォルトの名無しさん (アウアウウー Sa9b-zhdC)
2019/03/05(火) 12:25:43.27ID:IGhfqt8ja ウェブ系は楽だよなぁほんと
モダンで便利なエコシステム
ハイスペックな開発機
クラウドへのアクセスもサクサク
厳しい社内統制もなくゆるい現場
シンプルで簡単なドメイン
10年物のレガシーなんて無い
モダンで便利なエコシステム
ハイスペックな開発機
クラウドへのアクセスもサクサク
厳しい社内統制もなくゆるい現場
シンプルで簡単なドメイン
10年物のレガシーなんて無い
700デフォルトの名無しさん (アウアウカー Sa6b-cbQp)
2019/03/05(火) 12:41:39.55ID:4lHVjw0ya >>699
Java6「現役やで」
Java6「現役やで」
701デフォルトの名無しさん (ワッチョイ d714-W5e4)
2019/03/05(火) 14:48:04.00ID:YFVILFEb0702デフォルトの名無しさん (ワッチョイ 9701-3wv8)
2019/03/05(火) 16:44:18.98ID:nrrzzgEL0 >>699
フロントはどんどん楽になるよね。やってて楽しいのがweb系。ただサーバサイドやDB、ネットワークはレガシーも残ってるよ。
フロントはどんどん楽になるよね。やってて楽しいのがweb系。ただサーバサイドやDB、ネットワークはレガシーも残ってるよ。
703デフォルトの名無しさん (ワッチョイ 9f02-UbqP)
2019/03/05(火) 20:46:44.51ID:nwidEdp+0 >>701
その2倍ってのがおかしいって
その2倍ってのがおかしいって
704デフォルトの名無しさん (ワッチョイ 9f6a-SKB1)
2019/03/05(火) 23:25:03.26ID:8a3k8XPA0 たしかサーバーサイドJavaでJSPのテンプレートエンジン廃れたよね?
htmlに<if>とか<for>とか変なタグを入れるなって流れになったはずだけど
最近はJavaScriptで同じようなことしてるよなあ
htmlに<if>とか<for>とか変なタグを入れるなって流れになったはずだけど
最近はJavaScriptで同じようなことしてるよなあ
705デフォルトの名無しさん (ワッチョイ d7f2-W5e4)
2019/03/05(火) 23:42:35.99ID:exrcDGV20 それはJavaが廃れたんであって、Javaの世界じゃあ普通にやってるよ。
706デフォルトの名無しさん (ワッチョイ d72d-rVOz)
2019/03/06(水) 01:11:22.98ID:C3QpaLdU0 >>704
JSPはJAVAソースコードを出力する為のテンプレートであって、HTMLそのものでは無いよ。
JSP→解析→JAVAソースコード→コンパイル→classファイル
このclassファイルが、外部からのリクエストに対してHTMLを出力して、レスポンスで返してるんや。
んで、出力されたHTMLには<%if( 条件式 ){%>なんて文字列も出てこないよ。
そもそもこの<%%>タグはHTMLの為じゃなく、JAVAソースコード生成の為に使われるから出てくるわけ無い。
JSPはJAVAソースコードを出力する為のテンプレートであって、HTMLそのものでは無いよ。
JSP→解析→JAVAソースコード→コンパイル→classファイル
このclassファイルが、外部からのリクエストに対してHTMLを出力して、レスポンスで返してるんや。
んで、出力されたHTMLには<%if( 条件式 ){%>なんて文字列も出てこないよ。
そもそもこの<%%>タグはHTMLの為じゃなく、JAVAソースコード生成の為に使われるから出てくるわけ無い。
707デフォルトの名無しさん (ワッチョイ ff2c-Im2K)
2019/03/06(水) 01:43:49.00ID:Uli2bEJM0 Spring Boot のテンプレートエンジンは、Thymeleaf とかだろ
708デフォルトの名無しさん (スッップ Sdbf-alFK)
2019/03/06(水) 08:55:10.29ID:lkGca0kGd そういう意味ならJSFがある
709デフォルトの名無しさん (ワッチョイ ff3a-NqO3)
2019/03/06(水) 22:12:48.11ID:oR6mPeK70 スレ違いかもしれないけど、たまには気分転換にvueとかreactとかの話題はどうかな?
710デフォルトの名無しさん (ワッチョイ 9f6a-s6K6)
2019/03/06(水) 23:50:49.60ID:1pbO3u+T0 Reactの仮想DOMとかいうのが未だに分からん
HTMLをオブジェクトの木構造にしないで文字列のままで握ってるってことでOK?
HTMLをオブジェクトの木構造にしないで文字列のままで握ってるってことでOK?
711デフォルトの名無しさん (ワッチョイ eb4e-F75Q)
2019/03/07(木) 02:22:49.29ID:/M0SxS0j0 >>710
違う。
メモリ上に持つ実DOMの劣化レプリカ。
そして利用者は実DOMはイジらず、劣化レプリカの方をイジる。
angular react vueなどの仮想dom系のライブラリが劣化レプリカの変化から、最小の実dom操作を計算して適用。
昔は人がやってた仕事がライブラリに委譲された格好。
違う。
メモリ上に持つ実DOMの劣化レプリカ。
そして利用者は実DOMはイジらず、劣化レプリカの方をイジる。
angular react vueなどの仮想dom系のライブラリが劣化レプリカの変化から、最小の実dom操作を計算して適用。
昔は人がやってた仕事がライブラリに委譲された格好。
712デフォルトの名無しさん (アウアウカー Sa6f-P5ld)
2019/03/07(木) 02:44:23.97ID:FkBKY4Sxa HTML のタグを javascript のオブジェクトで単純に表現しただけのもの。react であれば、createElement 関数で生成されるオブジェクトのことになる。で、そのインスタンスの変化に合わせて実際の HTML に反映してくれる。
713デフォルトの名無しさん (ワッチョイ 126a-gi2a)
2019/03/07(木) 03:07:16.07ID:7lOwuU310 >>711
HTMLElementじゃないけど似たようなのをツリーで持ってるのか
HTMLElement.clone(true)でページ全体のクローンを作って、
それをDOM操作してからdocument.documentElementに差し替えるのかと思ってた
単純にFragment使ってDOM操作するより速いのか気になる
HTMLElementじゃないけど似たようなのをツリーで持ってるのか
HTMLElement.clone(true)でページ全体のクローンを作って、
それをDOM操作してからdocument.documentElementに差し替えるのかと思ってた
単純にFragment使ってDOM操作するより速いのか気になる
714デフォルトの名無しさん (ワッチョイ a701-RjaY)
2019/03/07(木) 07:22:52.72ID:rioBJ/QG0 やってることは実DOMの変更をバッファして
変更タイミングをいい感じでやってくれてるってことじゃないの?
変更タイミングをいい感じでやってくれてるってことじゃないの?
715デフォルトの名無しさん (ワッチョイ 1f14-uGU8)
2019/03/07(木) 08:43:40.11ID:oVD+pZgg0 >>713
> 単純にFragment使ってDOM操作するより速いのか気になる
速くならない
× 仮想DOMは速い
○ 仮想DOMは遅くならないように頑張っている
速い速い詐欺のどこが詐欺かって言うと
何より速いかを書いてない所
仮想DOMの最初の発想は、実DOMと同じような内容をメモリ内に保持しておいて、
仮想DOMから実DOMをすべて生成しよう!という発想
もともとはゲームから来ている発想。
ゲームは1秒間に60回ぐらいメモリ内容を元に画面全体を書き換えている。
変更があるたびにDOM全体を書き換える。
当然DOMでそんなことやったら遅いって思うよな?
そこで差分を計算して変更があった所だけ書き換える
つまり
○ 仮想DOMは画面全体を書き換える発想だが、差分だけを書き換えるから、画面全体を書き換えるより速い
と言ってるだけ
そもそも実DOMを操作しているときは、必要最小限のものしか書き換えないので
仮想DOMが差分(必要なところ)だけ書き換えるといっても、それ普通ですよね?という話でしか無い。
むしろ仮想DOMは実DOM操作よりメモリ使用量は増えるし、差分計算の分遅くなってる。
> 単純にFragment使ってDOM操作するより速いのか気になる
速くならない
× 仮想DOMは速い
○ 仮想DOMは遅くならないように頑張っている
速い速い詐欺のどこが詐欺かって言うと
何より速いかを書いてない所
仮想DOMの最初の発想は、実DOMと同じような内容をメモリ内に保持しておいて、
仮想DOMから実DOMをすべて生成しよう!という発想
もともとはゲームから来ている発想。
ゲームは1秒間に60回ぐらいメモリ内容を元に画面全体を書き換えている。
変更があるたびにDOM全体を書き換える。
当然DOMでそんなことやったら遅いって思うよな?
そこで差分を計算して変更があった所だけ書き換える
つまり
○ 仮想DOMは画面全体を書き換える発想だが、差分だけを書き換えるから、画面全体を書き換えるより速い
と言ってるだけ
そもそも実DOMを操作しているときは、必要最小限のものしか書き換えないので
仮想DOMが差分(必要なところ)だけ書き換えるといっても、それ普通ですよね?という話でしか無い。
むしろ仮想DOMは実DOM操作よりメモリ使用量は増えるし、差分計算の分遅くなってる。
716デフォルトの名無しさん (アメ MMdb-F75Q)
2019/03/07(木) 08:54:40.49ID:NrdLaj5lM 実DOM操作自体の速度は当然変わらない。
人が書くか仮想DOMライブラリがやるかの違いだけ。
ライブラリは実DOM操作の回数を減らすため仮想DOM持って計算頑張ってるだけ。
「DOM操作が速くなる」とか言ってるのは全部嘘。
人が書くか仮想DOMライブラリがやるかの違いだけ。
ライブラリは実DOM操作の回数を減らすため仮想DOM持って計算頑張ってるだけ。
「DOM操作が速くなる」とか言ってるのは全部嘘。
717デフォルトの名無しさん (ワッチョイ 1f14-uGU8)
2019/03/07(木) 09:00:44.74ID:oVD+pZgg0 > 人が書くか仮想DOMライブラリがやるかの違いだけ
人は「全体の中から差分を計算してそこだけ書き換える」
なんてことはやってないですよ。
人はある処理の中でDOMのどの部分を書き換えたいかを
知っているので、必要最小限のDOM操作しか変更しない
(クソプログラマなら全部消して作り直すとかいう無駄してるかもしれんが)
その全部消して作り直すっていうのをやろうという発想が仮想DOMで
遅くならないように差分を計算して、必要最小限のものだけ変えよう。というふうに
自分で遅くしておいて、自分で改善した(速くした)って言ってるだけなんです
人は「全体の中から差分を計算してそこだけ書き換える」
なんてことはやってないですよ。
人はある処理の中でDOMのどの部分を書き換えたいかを
知っているので、必要最小限のDOM操作しか変更しない
(クソプログラマなら全部消して作り直すとかいう無駄してるかもしれんが)
その全部消して作り直すっていうのをやろうという発想が仮想DOMで
遅くならないように差分を計算して、必要最小限のものだけ変えよう。というふうに
自分で遅くしておいて、自分で改善した(速くした)って言ってるだけなんです
718デフォルトの名無しさん (ワッチョイ a701-w6xA)
2019/03/07(木) 09:10:38.72ID:FKXLE38I0 速度に関しては実dom直接操作よりは遅い。その辺はググればすぐ出るから見とくと良い。ただおかけでリアクティブという大きなメリットを手に入れた。ページ切り替えさえ差分更新してspaも出来る訳で、レスポンスは全体的に向上する。
719デフォルトの名無しさん (アメ MMdb-F75Q)
2019/03/07(木) 09:19:40.62ID:NrdLaj5lM 人はある処理の中でDOMのどの部分を書き換えたいかを
知っている(担当の頭の中にある)ので、必要最小限のDOM操作しか変更しない。
人の頭に依存しないように機械的に
最小限のDOM操作を特定・適用までやろうとしたのが仮想DOM系ライブラリ。
人が脳のリソース使ってやるか仮想DOMライブラリが自動でやるかの違いだけ。
知っている(担当の頭の中にある)ので、必要最小限のDOM操作しか変更しない。
人の頭に依存しないように機械的に
最小限のDOM操作を特定・適用までやろうとしたのが仮想DOM系ライブラリ。
人が脳のリソース使ってやるか仮想DOMライブラリが自動でやるかの違いだけ。
720デフォルトの名無しさん (ワッチョイ 1f14-uGU8)
2019/03/07(木) 09:27:16.66ID:oVD+pZgg0 ここで忘れてはいけないのは
> ただおかけでリアクティブという大きなメリットを手に入れた。ページ切り替えさえ差分更新してspaも出来る訳で、レスポンスは全体的に向上する。
リアクティブは本当に必要なのか?
SPAは本当に必要なのか?
ということ
世の中の多くのソフトウェアはリアクティブなんか使っていない。
それでまともに動く製品を作れている。
SPAもそうだ。ユーザーにとってはシングルページだろうが、マルチページだろうが関係ない。
シングルページだとページごとに分担して開発するのが難しくなる。
マルチページなら、ページごとに別の人が担当して開発するのが楽である。
> ただおかけでリアクティブという大きなメリットを手に入れた。ページ切り替えさえ差分更新してspaも出来る訳で、レスポンスは全体的に向上する。
リアクティブは本当に必要なのか?
SPAは本当に必要なのか?
ということ
世の中の多くのソフトウェアはリアクティブなんか使っていない。
それでまともに動く製品を作れている。
SPAもそうだ。ユーザーにとってはシングルページだろうが、マルチページだろうが関係ない。
シングルページだとページごとに分担して開発するのが難しくなる。
マルチページなら、ページごとに別の人が担当して開発するのが楽である。
721デフォルトの名無しさん (ワッチョイ a701-w6xA)
2019/03/07(木) 09:52:31.84ID:FKXLE38I0 リアクティブのメリットは複雑な入力フォームが分かりやすい。pc購入する際のカスタマイズ画面なんかが良い例。以前と比べて工期の短縮できて保守が凄く楽。部分的な導入も出来るからvueで試せば分かる。フォーム周りは圧倒的にリアクティブが良い。
722デフォルトの名無しさん (ワッチョイ 1f14-uGU8)
2019/03/07(木) 09:57:57.50ID:oVD+pZgg0723デフォルトの名無しさん (ワッチョイ 1f14-uGU8)
2019/03/07(木) 10:01:54.73ID:oVD+pZgg0 >>721
その例ってこんな程度でいいの?
https://www.dell.com/ja-jp/shop/serviceselection/cai401cspgmt04oo3ijp?selectionState=&cartItemId=
https://www.dospara.co.jp/5goods_pc/pc_bto.php?h=d&f=d&m=pc&tg=13&mc=8374&sn=3619&vn=1&lf=0
その例ってこんな程度でいいの?
https://www.dell.com/ja-jp/shop/serviceselection/cai401cspgmt04oo3ijp?selectionState=&cartItemId=
https://www.dospara.co.jp/5goods_pc/pc_bto.php?h=d&f=d&m=pc&tg=13&mc=8374&sn=3619&vn=1&lf=0
724デフォルトの名無しさん (ワッチョイ a701-w6xA)
2019/03/07(木) 10:43:49.16ID:FKXLE38I0725デフォルトの名無しさん (ワッチョイ 1f14-uGU8)
2019/03/07(木) 10:54:23.39ID:oVD+pZgg0 >>724
やっぱり使い方がわかってないだけだな
ある入力に複数の要素が動的に変わるならば、
その要素の親に、クラスをつけて、
あとはCSSで、それ以下の要素の表示、非表示状態を切り替えるだけだよ
jQueryだと最低3行。あとはCSSでおしまい。
やっぱり使い方がわかってないだけだな
ある入力に複数の要素が動的に変わるならば、
その要素の親に、クラスをつけて、
あとはCSSで、それ以下の要素の表示、非表示状態を切り替えるだけだよ
jQueryだと最低3行。あとはCSSでおしまい。
726デフォルトの名無しさん (ワッチョイ 1f14-uGU8)
2019/03/07(木) 11:05:05.80ID:oVD+pZgg0 前から思ってるんだけど(自称)プログラマって
HTML/CSSは嫌いです。出来ません。って人多いよね。
それを毛嫌いしてるというか、CSSなんてデザイナが使うもんだろ
馬鹿にしている感じで、俺出来ないから(笑)みたいな感じで言う。
恥ずかしいと思ってないんだろう。
多くのDOM要素はCSSを使って単に見えなくしたり表示したりすればいいだけなんだが
(プログラマとしての技術力不足で)CSSを使えないから
JavaScriptでいちいち作り出したり削除するしか出来ないんだよな
HTML/CSSは嫌いです。出来ません。って人多いよね。
それを毛嫌いしてるというか、CSSなんてデザイナが使うもんだろ
馬鹿にしている感じで、俺出来ないから(笑)みたいな感じで言う。
恥ずかしいと思ってないんだろう。
多くのDOM要素はCSSを使って単に見えなくしたり表示したりすればいいだけなんだが
(プログラマとしての技術力不足で)CSSを使えないから
JavaScriptでいちいち作り出したり削除するしか出来ないんだよな
727デフォルトの名無しさん (ブーイモ MM0e-4xo3)
2019/03/07(木) 16:04:46.19ID:uSXw2eVGM728デフォルトの名無しさん (ワッチョイ 1f14-uGU8)
2019/03/07(木) 17:22:06.09ID:oVD+pZgg0729デフォルトの名無しさん (スプッッ Sd52-P8NU)
2019/03/07(木) 18:14:20.13ID:mVKClUMzd 簡単にいい感じのページが作れるのはメリットの一つだと思うけどな。
例えばpythonは成果物に関してはCに対するメリットはないけど簡単に作れるから人気なわけで。
例えばpythonは成果物に関してはCに対するメリットはないけど簡単に作れるから人気なわけで。
730デフォルトの名無しさん (ブーイモ MM0e-4xo3)
2019/03/07(木) 21:20:18.65ID:bV0vVOYFM731デフォルトの名無しさん (ワッチョイ dff2-uGU8)
2019/03/07(木) 22:37:46.71ID:cPei42ec0 >人はある処理の中でDOMのどの部分を書き換えたいかを
>知っているので、必要最小限のDOM操作しか変更しない
>(クソプログラマなら全部消して作り直すとかいう無駄してるかもしれんが)
クソプログラマは全部消して作り直す
賢いプログラマはどうDOM操作すれば最適かなどという生産性のない仕事をフレームワークに任せる
>知っているので、必要最小限のDOM操作しか変更しない
>(クソプログラマなら全部消して作り直すとかいう無駄してるかもしれんが)
クソプログラマは全部消して作り直す
賢いプログラマはどうDOM操作すれば最適かなどという生産性のない仕事をフレームワークに任せる
732デフォルトの名無しさん (アウアウウー Sac3-cVal)
2019/03/07(木) 22:42:13.25ID:N/E4f3Caa733デフォルトの名無しさん (ワッチョイ 1202-4dCE)
2019/03/07(木) 22:55:10.59ID:Tta1cO7U0 GoogleもこれからPWAで攻めてきそうだけどね
734デフォルトの名無しさん (ワッチョイ 1614-uGU8)
2019/03/07(木) 22:59:25.97ID:Y4GuSkwR0735デフォルトの名無しさん (ワッチョイ 1614-uGU8)
2019/03/07(木) 23:00:35.30ID:Y4GuSkwR0 >>731
> 賢いプログラマはどうDOM操作すれば最適かなどという生産性のない仕事をフレームワークに任せる
もっと賢いプログラマは、必要なことしかしないんだよ。
Aを変えたいなら、Aだけを変えましょう。ってね
> 賢いプログラマはどうDOM操作すれば最適かなどという生産性のない仕事をフレームワークに任せる
もっと賢いプログラマは、必要なことしかしないんだよ。
Aを変えたいなら、Aだけを変えましょう。ってね
736デフォルトの名無しさん (アウアウウー Sac3-cVal)
2019/03/07(木) 23:01:50.74ID:N/E4f3Caa >>734
domの状態数は多すぎるよ
domの状態数は多すぎるよ
737デフォルトの名無しさん (アウアウウー Sac3-cVal)
2019/03/07(木) 23:04:15.56ID:N/E4f3Caa738デフォルトの名無しさん (アウアウカー Sa6f-F7Qp)
2019/03/07(木) 23:09:46.27ID:oTfLqBj1a まあ本当に賢いプログラマ達はフロントエンドなんてやらないんですけどね
739デフォルトの名無しさん (アウアウウー Sac3-cVal)
2019/03/07(木) 23:11:14.61ID:N/E4f3Caa >>738
それは同意
それは同意
740デフォルトの名無しさん (ワッチョイ 1614-uGU8)
2019/03/07(木) 23:12:46.45ID:Y4GuSkwR0 AしたらBを変えたいんですが?
Reactを使うと・・・・
ではBを変数に結びつけましょう。
そういうコードを書き換えます。
そうすれば変数を変えればBも変わります。
おっと待ってください。
そのために変数をSTOREに入れなければいけません。
STOREからとってきて、STOREを更新・・・いえいえいけません
新しくオブジェクトを作るのです。
そのオブジェクトを作るために〜
オブジェクトを変更する関数を用意するのです!
その関数を作るための、はい、メッセージが必要ですね。
えぇ、ですからね、AしたらAction Creatorを使ってactionを生成して
Storeに対してactinonをDispatchして、ReducerがDispatchに反応して
actionタイプから今の状態から新しい状態を変更すれば、
ほら簡単にBが変わるんです!
え?普通にAイベントのハンドラでBを変えればいいじゃないかって?
ムキー!
Reactを使うと・・・・
ではBを変数に結びつけましょう。
そういうコードを書き換えます。
そうすれば変数を変えればBも変わります。
おっと待ってください。
そのために変数をSTOREに入れなければいけません。
STOREからとってきて、STOREを更新・・・いえいえいけません
新しくオブジェクトを作るのです。
そのオブジェクトを作るために〜
オブジェクトを変更する関数を用意するのです!
その関数を作るための、はい、メッセージが必要ですね。
えぇ、ですからね、AしたらAction Creatorを使ってactionを生成して
Storeに対してactinonをDispatchして、ReducerがDispatchに反応して
actionタイプから今の状態から新しい状態を変更すれば、
ほら簡単にBが変わるんです!
え?普通にAイベントのハンドラでBを変えればいいじゃないかって?
ムキー!
741デフォルトの名無しさん (ワッチョイ 1614-uGU8)
2019/03/07(木) 23:14:47.91ID:Y4GuSkwR0 >>737
> それをわざわざdom/cssの物理構造に縛られた迂遠な方法で管理するのは確かに賢くないな
だから、CSSを使うといいですね。
JavaScirptからは親となる要素にクラスを設定するだけなんですよ。
簡単。DOMがどういう構造になっているかなんて関係ない。
あとはデザインを作る人が、その状態でどう表示したいかを作るだけなんです。
> それをわざわざdom/cssの物理構造に縛られた迂遠な方法で管理するのは確かに賢くないな
だから、CSSを使うといいですね。
JavaScirptからは親となる要素にクラスを設定するだけなんですよ。
簡単。DOMがどういう構造になっているかなんて関係ない。
あとはデザインを作る人が、その状態でどう表示したいかを作るだけなんです。
742デフォルトの名無しさん (オッペケ Src7-EzoF)
2019/03/07(木) 23:23:16.99ID:jEbiMY7gr fluxの概念を取り入れたらものすごく簡単に状態管理ができる!
って本にもキータにもみんな書いてるんだけど?
って本にもキータにもみんな書いてるんだけど?
743デフォルトの名無しさん (アウアウウー Sac3-cVal)
2019/03/07(木) 23:23:24.15ID:N/E4f3Caa >>741
私が管理したいのは見えるか見えないかという2つの純粋な状態なんです
ブーリアンで済むものをわざわざスタイルシートやらクラスなどといった迂遠な方法で管理したくないんです
それはまるで物体から投影された影に干渉して、もとの物体を操ろうとするような愚かなことです
私が管理したいのは見えるか見えないかという2つの純粋な状態なんです
ブーリアンで済むものをわざわざスタイルシートやらクラスなどといった迂遠な方法で管理したくないんです
それはまるで物体から投影された影に干渉して、もとの物体を操ろうとするような愚かなことです
744デフォルトの名無しさん (ワッチョイ ff3d-g2Ga)
2019/03/07(木) 23:58:03.68ID:tvHZX0HA0 どっちも極端じゃないか?
バインディングならjQueryよりはVueやReact使った方がいいと思うけど、
表示非表示やアニメーションならcss側でやった方がいいと思う。
バインディングならjQueryよりはVueやReact使った方がいいと思うけど、
表示非表示やアニメーションならcss側でやった方がいいと思う。
745デフォルトの名無しさん (ワッチョイ 126a-gi2a)
2019/03/08(金) 00:38:11.11ID:kMybevyH0 仮想DOMとJQueryの世代の重要な違いとして
セレクタやDOM操作を一切したくないという発想があるのではないだろうか
JSXでHTMLをそのまま書くのもセレクタを使いたくないからだろうし
セレクタやDOM操作を一切したくないという発想があるのではないだろうか
JSXでHTMLをそのまま書くのもセレクタを使いたくないからだろうし
746デフォルトの名無しさん (ワッチョイ 162c-1cTK)
2019/03/08(金) 00:47:24.38ID:N66/0TP00 実DOM では、IO 操作が遅い
仮想DOMでは、JavaScript内の操作だけだから、速い
仮想DOMでは、JavaScript内の操作だけだから、速い
747デフォルトの名無しさん (ワッチョイ 126a-gi2a)
2019/03/08(金) 01:03:32.93ID:kMybevyH0 それはHTMLFragmentがあれば事足りる話っしょ
748デフォルトの名無しさん (ワッチョイ 1614-uGU8)
2019/03/08(金) 10:15:11.65ID:jbQifWXg0 >>743
> ブーリアンで済むものをわざわざスタイルシートやらクラスなどといった迂遠な方法で管理したくないんです
だからセレクタのクラスはブーリアンなんだよ
ある要素に、flagクラスというブーリアン値が
立っているか、立っていないか
> ブーリアンで済むものをわざわざスタイルシートやらクラスなどといった迂遠な方法で管理したくないんです
だからセレクタのクラスはブーリアンなんだよ
ある要素に、flagクラスというブーリアン値が
立っているか、立っていないか
749デフォルトの名無しさん (ワッチョイ 1614-uGU8)
2019/03/08(金) 10:16:08.10ID:jbQifWXg0750デフォルトの名無しさん (ワッチョイ a701-w6xA)
2019/03/08(金) 11:13:41.54ID:/TYC9ex30 >>725
リアクティブだと一行で終わるよね。単に変数をfalseにするだけ。ミスしようがない。うーん、なんでjQueryやcssにそこまでこだわるかね。みんな散々苦労してきた末のスマートな解決方法が仮想domでありリアクティブなんだけどな。一度試してみたら?食わず嫌いしないでさ。
リアクティブだと一行で終わるよね。単に変数をfalseにするだけ。ミスしようがない。うーん、なんでjQueryやcssにそこまでこだわるかね。みんな散々苦労してきた末のスマートな解決方法が仮想domでありリアクティブなんだけどな。一度試してみたら?食わず嫌いしないでさ。
751デフォルトの名無しさん (ワッチョイ 1614-uGU8)
2019/03/08(金) 11:17:51.39ID:jbQifWXg0 > リアクティブだと一行で終わるよね。単に変数をfalseにするだけ。
終わらねーよw 変数みてデザインを変えるコードを書かないとだめだろ
終わらねーよw 変数みてデザインを変えるコードを書かないとだめだろ
752デフォルトの名無しさん (ワッチョイ a701-w6xA)
2019/03/08(金) 11:28:53.74ID:/TYC9ex30753デフォルトの名無しさん (ワッチョイ 1614-uGU8)
2019/03/08(金) 11:35:19.90ID:jbQifWXg0 > そう、まさにそこがキモ。ロジックとuiが綺麗に分離されてる。
別れてないよ。JavaScriptファイルを編集してもらわないといけない
CSSだと「プログラマの俺は、この要素のクラスを設定するだけです。
デザイナーさん、あとはかっこいいデザインを作ってください!」といえる
デザイナーはJavaScriptファイルを一切触らずに
デザインを作り込むことができる。
別れてないよ。JavaScriptファイルを編集してもらわないといけない
CSSだと「プログラマの俺は、この要素のクラスを設定するだけです。
デザイナーさん、あとはかっこいいデザインを作ってください!」といえる
デザイナーはJavaScriptファイルを一切触らずに
デザインを作り込むことができる。
754デフォルトの名無しさん (ワッチョイ 1614-uGU8)
2019/03/08(金) 11:40:36.85ID:jbQifWXg0 jQueryで書く場合はこんな感じだね。
$('.my-component [name="switch"]').change(function() {
$(this).closest('.my-component').toggleClass('active', this.checked);
});
コンポーネントの中にある名前がswitchのチェックボックスがONになれば
そのコンポーネントがactiveになって、
そのコンポーネント以下のデザインがactive用に変わる
DOMの構成がどうなっているか一切気にする必要がないんだよ。
$('.my-component [name="switch"]').change(function() {
$(this).closest('.my-component').toggleClass('active', this.checked);
});
コンポーネントの中にある名前がswitchのチェックボックスがONになれば
そのコンポーネントがactiveになって、
そのコンポーネント以下のデザインがactive用に変わる
DOMの構成がどうなっているか一切気にする必要がないんだよ。
755デフォルトの名無しさん (ワッチョイ a701-w6xA)
2019/03/08(金) 13:46:44.51ID:/TYC9ex30 >>753
デザイナはスクリプトをいじる必要全くない。例えば
<div v-if=“isShow”></div>
というテンプレに対してスクリプトでは、
isShow=false
とするだけ。これだけでリアクティブになる。どっちがミスが少ないか分かるだろう?
デザイナはスクリプトをいじる必要全くない。例えば
<div v-if=“isShow”></div>
というテンプレに対してスクリプトでは、
isShow=false
とするだけ。これだけでリアクティブになる。どっちがミスが少ないか分かるだろう?
756デフォルトの名無しさん (ワッチョイ a701-w6xA)
2019/03/08(金) 13:50:05.53ID:/TYC9ex30 すまん途切れた。どっちがミスが少ないか、分業しやすいか分かると思うんだが、どうかね?
757デフォルトの名無しさん (ワッチョイ 1614-uGU8)
2019/03/08(金) 13:55:12.54ID:jbQifWXg0 > <div v-if=“isShow”></div>
すいませーん、デザイナーさーん。
今度から、v-ifってのを覚えてくださいー。
いままでCSSで表示切り替えしてたでしょー?
それ、今度からやめてくださいねー。
リ・ア・ク・ト。やり方覚えてくださいね。
やり方変えたんですよ。こっちのやり方にね。
え?他にも色々ありますよ。勉強してくださいー。
すいませーん、デザイナーさーん。
今度から、v-ifってのを覚えてくださいー。
いままでCSSで表示切り替えしてたでしょー?
それ、今度からやめてくださいねー。
リ・ア・ク・ト。やり方覚えてくださいね。
やり方変えたんですよ。こっちのやり方にね。
え?他にも色々ありますよ。勉強してくださいー。
758デフォルトの名無しさん (ワッチョイ 126a-gi2a)
2019/03/08(金) 13:57:57.43ID:kMybevyH0 Javascript(Data/Model) - Javascript(UI/DOM) - HTML/CSS
デザイナーが真ん中の層を如何にやるのかという話だろう
HTML内にv-bindとか属性で埋め込むのもJQueryを書かせるのも同じこと
仮想DOMのフレームワークによって真ん中が無くなったとは言えないだろうし
デザイナーが真ん中の層を如何にやるのかという話だろう
HTML内にv-bindとか属性で埋め込むのもJQueryを書かせるのも同じこと
仮想DOMのフレームワークによって真ん中が無くなったとは言えないだろうし
759デフォルトの名無しさん (ワッチョイ 1614-uGU8)
2019/03/08(金) 14:02:22.95ID:jbQifWXg0 jQueryはプログラマが使って、
イベントに反応してクラスを変更するだけなんだよ。
あとはDOMの構造とかCSSとか完全にデザイナーに
任せることができる。
デザイナーはデザイナーの流儀でやれるし、
JavaScriptフレームワークの流儀を押し付けることもない
イベントに反応してクラスを変更するだけなんだよ。
あとはDOMの構造とかCSSとか完全にデザイナーに
任せることができる。
デザイナーはデザイナーの流儀でやれるし、
JavaScriptフレームワークの流儀を押し付けることもない
760デフォルトの名無しさん (ワッチョイ 1614-uGU8)
2019/03/08(金) 14:05:09.01ID:jbQifWXg0761デフォルトの名無しさん (ワッチョイ a701-w6xA)
2019/03/08(金) 14:11:29.15ID:/TYC9ex30762デフォルトの名無しさん (ワッチョイ 126a-gi2a)
2019/03/08(金) 14:12:44.22ID:kMybevyH0 jQueryはすべてデザイナーがやるべき
ボタンをクリックしたらどのタグの色が変わるのか、それを知っているのはデザイナーだけで良い
ボタンをクリックしたらどのタグの色が変わるのか、それを知っているのはデザイナーだけで良い
763デフォルトの名無しさん (ワッチョイ 1614-uGU8)
2019/03/08(金) 14:20:09.62ID:jbQifWXg0 >>761
> いや随分コード減るぞ。当然ミスも減る。デザイナも楽になる。
jQueryの方が少ないですね。
嘘だと思うならこれ同じことを実際に動くのに必要な分、書いてみてください。
[JavaScript]
$('.my-component [name="switch"]').change(function() {
$(this).closest('.my-component').toggleClass('active', this.checked);
});
[HTML]
<div class="my-component">
<input type="checkbox" name="switch">switch
</div>
[CSS]
.my-component.active {
color: red;
}
jQuery版の実際に動くコードですよ。
https://jsfiddle.net/eu2wm3tk/
> いや随分コード減るぞ。当然ミスも減る。デザイナも楽になる。
jQueryの方が少ないですね。
嘘だと思うならこれ同じことを実際に動くのに必要な分、書いてみてください。
[JavaScript]
$('.my-component [name="switch"]').change(function() {
$(this).closest('.my-component').toggleClass('active', this.checked);
});
[HTML]
<div class="my-component">
<input type="checkbox" name="switch">switch
</div>
[CSS]
.my-component.active {
color: red;
}
jQuery版の実際に動くコードですよ。
https://jsfiddle.net/eu2wm3tk/
764デフォルトの名無しさん (オッペケ Src7-EzoF)
2019/03/08(金) 14:20:12.96ID:mjBCJk3zr ほらほらだからこうなるって何度も言っただろ
フロントはフルスタックじゃないとこの程度ですら揉めるんだよ
もう一度言うぞ
デザインできないフロントエンジニアはクソ
エンジニアリングできないフロントデザイナーはクソ
お前ら言い争ってる時点で無能だと自覚しろ
フロントはフルスタックじゃないとこの程度ですら揉めるんだよ
もう一度言うぞ
デザインできないフロントエンジニアはクソ
エンジニアリングできないフロントデザイナーはクソ
お前ら言い争ってる時点で無能だと自覚しろ
765デフォルトの名無しさん (ワッチョイ 126a-gi2a)
2019/03/08(金) 14:20:13.82ID:kMybevyH0 >>761
>いや随分コード減るぞ。当然ミスも減る。デザイナも楽になる。
そう、デザイン側のJSコードは減る。それはたしかだし、データ側JSとの繋ぎかたもはっきりとするね
欠点はHTML内に変なのをたくさん突っ込むのはいかがなものかってことかな
>いや随分コード減るぞ。当然ミスも減る。デザイナも楽になる。
そう、デザイン側のJSコードは減る。それはたしかだし、データ側JSとの繋ぎかたもはっきりとするね
欠点はHTML内に変なのをたくさん突っ込むのはいかがなものかってことかな
766デフォルトの名無しさん (ワッチョイ 1614-uGU8)
2019/03/08(金) 14:20:59.66ID:jbQifWXg0 >>762
> jQueryはすべてデザイナーがやるべき
JavaScriptのライブラリなのにデザイナーって意味不明w
ボタンを押したら、ここのタグにこういうクラスがつきます。
って伝えるだけで、あとはそれぞれ作業ができる。
これが分業っていうんだよ。
> jQueryはすべてデザイナーがやるべき
JavaScriptのライブラリなのにデザイナーって意味不明w
ボタンを押したら、ここのタグにこういうクラスがつきます。
って伝えるだけで、あとはそれぞれ作業ができる。
これが分業っていうんだよ。
767デフォルトの名無しさん (アウアウウー Sac3-4dCE)
2019/03/08(金) 14:28:57.63ID:B/j0V0h2a >>757
どっちかというとその場合デザイナーに必要なのはv-showじゃなくてisShowだから
どういうモードの時変数の設定値を何にすべきかという一覧表があればいいだけじゃね?
てかその辺のコード化はデザイナーじゃなくてフロントエンジニアの仕事だろ
どっちかというとその場合デザイナーに必要なのはv-showじゃなくてisShowだから
どういうモードの時変数の設定値を何にすべきかという一覧表があればいいだけじゃね?
てかその辺のコード化はデザイナーじゃなくてフロントエンジニアの仕事だろ
768デフォルトの名無しさん (ワッチョイ 1614-uGU8)
2019/03/08(金) 14:31:25.36ID:jbQifWXg0 > てかその辺のコード化はデザイナーじゃなくてフロントエンジニアの仕事だろ
フロントエンジニアがHTMLを書くから
分業できないってことなんですよ
フロントエンジニアがHTMLを書くから
分業できないってことなんですよ
769デフォルトの名無しさん (オッペケ Src7-EzoF)
2019/03/08(金) 14:33:21.35ID:mjBCJk3zr >>757
いや、お前がデザイン覚えろよwwww
いや、お前がデザイン覚えろよwwww
770デフォルトの名無しさん (ワッチョイ 126a-gi2a)
2019/03/08(金) 14:36:15.92ID:kMybevyH0771デフォルトの名無しさん (アウアウウー Sac3-4dCE)
2019/03/08(金) 14:54:21.66ID:B/j0V0h2a デザイナーはロジックレスな一枚ずつのhtmlと画像素材のcss作ってりゃそれでいいじゃん
■ このスレッドは過去ログ倉庫に格納されています
ニュース
- 中国とロシアの爆撃機、日本周辺で共同飛行 [少考さん★]
- 「中国側も日本機のレーダーを感知していた」 中国メディアが報道 [♪♪♪★]
- 【YouTuber】バイク事故で入院のゆたぼん、振込で「お見舞金」募る [muffin★]
- 高市早苗首相、消費税減税に後ろ向き 足かせはレジシステム? 「責任ある積極財政」期待高いが [蚤の市★]
- 堀江貴文、キャッシュレス非対応の店にモヤッ 『PayPay』立ち上げの人物にまさかの直談判「現金決済しかできないんだけど…」 [冬月記者★]
- バリ島で男子生徒ら集団万引きか、防犯カメラ映像が拡散 京都の大谷中学・高校が「窃盗行為」謝罪★7 [七波羅探題★]
- 防衛省、中国を完全論破www 「事前通告があったのは海自であって空自ではない」 高市早苗勝利 [175344491]
- 買ったばかりのオーブンレンジ「この機種はお餅を焼くことはできません」
- 【悲報】JA「全然米が売れなくて倉庫を圧迫してる。助けて!」米卸売り業者「安売りしたら赤字になる…助けて!」 [802034645]
- 【悲惨】中国軍が自衛隊に「事前通告」し自衛隊も返答した音声が公開されてしまうwwwこれは高市チェックアウトゕ★4 [597533159]
- 腕時計が冷たあい!
- 無限大の世界の主 vs ヘリコプターのパイロット
