はてなキーワード: Backbone.jsとは
要は結論は出せないし、迷うくらいならjQueryとBackbone.jsで十分だってことか?
みなさん、こんばんは。
「Merpaku Frontend Engineer Meetup」の時間がやってまいりました。
今夜は、著名フロントエンドエンジニアの方々にお集まりいただき、「2020年のフロントエンドJSフレームワークを考える」と題しまして、お話をお伺いいたします。
ま~、僕の場合はね、海外の技術情報をチェックしてるんだけど~
今のフロントエンドはさ~、なんちゅ~の?
あの、Frontend Engineerの友達がベイエリアとかにいるんだけどね~、いつもSlackで現地のトレンド情報を送ってくれるんだけど、よく調べると、ま~あの、銀の弾丸はない、結局はトレードオフ。
C:あ、ちょっちょっといい?
あのね、僕~はやっぱりjQueryが一番いいと…
A:でもね、僕なんかなんちゅうの、海外のカンファレンスに参加する機会がすごい多いわけ。ね?
この間もUSやUKまわってきたんすよね。
そこで一番感じたのはですね、銀の弾丸はないけど、結局はトレードオフというのが一番感じたなぁ~
B:う~ん、キミとはちょっと違うんだよね。
僕は英語がわかるでしょ~?
だから勉強会なんか、登壇してくれって何度も頼まれてね、断ってるんだけど、まぁ、だいたいよく調べてみると、銀の弾丸はない、結局はトレードオフっていう。
C:う~ん、でもね、やっぱり僕はjQueryが…
そうじゃなくてさぁ、僕なんかは1日にね、1日に8時間コード書きまくって生活してるわけですよ。
そうすっと、すごいよくわかるのは、銀の弾丸はない、だけど、結局はトレードオフっていう感じだなぁ~。
僕はいいね数5万個だよ?5万個ついてんだよ?それも「先週いいねが多かった投稿ベスト20」ばっかりよ?
で、だいたいよく調べてみると、銀の弾丸はない、結局はトレードオフなんだよ。
C:あ、ちょっと言わせてもらうとね、僕なんかやっぱりね、jQueryがやっぱりいいなと…
A:あのキミ違うよ、だってさぁ、Watchのレポジトリ数なんか言ったら、8万ありますよJS。
それをさぁ、全部動かしまくって感じんのは、はっきり言って、銀の弾丸はない、だけど、結局はトレードオフ。
B:んはっ、僕なんかね、キミとはちょっと違うんだけどね、懇親会で質問したりとかね、ちゃ~んとフロントントエンドの話して聞くとですね、銀の弾丸はない、結局はトレードオフなんだよね。
C:っといいですか?
フロントエンドを理解するためにはさぁ、アーキテクチャと切り離せないと思うわけですよ。
ね?聞いてる?
ね、ほら僕は今、自作ライブラリ開発してますよね?TypeScriptの、ほら?
だから、そういうふうに、日常にアーキテクチャを取り入れることからね、フロントエンドを考えると、銀の弾丸はない、だけど、結局はトレードオフと言い切れると思うわけよね。
B:ちょっと待ってよ、は~キミとはちょっと違うんだけどね、技術顧問先なんか行くとね、全部僕がWebpackとか、CI環境とか、み~んなレビューするんだよ?ペアプロするんだよ?
そうやってコミュニケーションしてね、でフロントエンドは銀の弾丸はない、結局はトレードオフなんだよね。
C:やっぱアーキテクチャだったらね、Backbone.jsじゃな~い?
A:なんかおかしいんじゃないの~?
え~、今度Abema Towersでフロントエンドのカンファレンスの運営サイドもします。
ま、そういう世界にいてですね、はじめてフロントエンドがよくわかると言い切れると思うんですよね。
だから、そういう言い方からしてもね、銀の弾丸はない、だけど、結局はトレードオフと僕は思うわけなんですよ。
B:違~うちょっと、僕はね、キミとちょっと違うんだけどね、僕なんかね、今度フルタイムのOSS開発やんだよ?しかもWebAssemblyよ?
そうやって実際にOSSを作ってみてね、銀の弾丸はない、結局はトレードオフ。
A:…
B:…
A:ちっ
B:ちっ
A:だからさぁ!!!WebAssemblyがどうしたか知らないけどさぁ!!!
僕ね、今度Google Japanに頼まれて、六本木ヒルズでキーノートやろうかどうしようか迷ってる自分がここにいるわけ。
B:だけどね!!!
A:来場者は1万人だよ!!!
B:それはね!!!六本木ヒルズがいくつあったって1万人がね…
B:六本木ヒルズがね、どうやって…
B:jQueryが…
A:そういう真剣勝負をさ、実力を持ってるところから、もの見てごらん!?
B:違うんだよ!!!
B:ちょっと違うんだよ!!!
**誰かみんなの主張のまとめを作ってくれないですか?** (まあそれこそお前がやれよって話かもしれないので、誰もやってくれなかったら私がしますが。。)
最近、JQueryはもはや不要でReactさえあればOK,みたいな記事をよく見ますね。
論旨としては、どうせトランスパイラ使ってるんだからもっと便利な書き方しようぜ!ってことなんだと思います。(virtual DOMがメインだ!という話もあったけど、じゃあ何でReactなの?というのは聞きたいかな。メジャーだから?)
ちなみに私は昔coffeeとbackbone.jsか何かで業務用のページ(SPAではなかったような気がする)を作るお仕事をしたことがありますが、フロントエンドエンジニアというわけではないです。どちらかというとサーバー管理とかのほうがよく知っていると思いますが、Javascriptもそれなりには書くくらいの感じの人です。Reactは不幸にして一度も触ったことがないので、以下の文章はすべてコードサンプルをみたうえでの感想です。
まずこれ。正直そんなにたくさん動的にがりがり書き換えているページをあんまり見ない気がするんですよね。その上正直そういうウェブページ、あったとしても大体使いづらいです。
世の中のページが全部FBならいいのかもしれませんが、具体的にはどんなところで使ってるんでしょう。業務ページとかですか?あと、なぜSPAにしなければいけないのかもよくわからないです。画面遷移するのだめなの?という感じで。
トランスコンパイラを使うのって、結局「将来的には全部ES6になるのだから、今のうちからES6で書いておけば将来のメンテナンスコストとかも減ってうれしいよね!」っていうことなんだと思います。
こういう例、JS以外にもいろいろあって、例えばboost、Androidのsupport library, Pythonのfrom __future__ importなどなどあると思うんですが、どれもやっぱり将来的なコストを見据えて、非標準のライブラリ・記法を使いましょう、ってことですよね。
でもJSXってそういうのじゃないじゃないですか。いわばsupport libraryを使うのとmonoで全部書くのと、位の違いがあるように見えます(そこまでは違わないかw)。そういう考察を一切入れずに、「どうせトランスパイラ使ってるんだから拡張記法使っちゃおうぜ!!」っていうのはかなり危ういように見えます。
そもそも、JSって結構独特な言語ですよね。もちろん今はnode.jsとかあるわけですけど、まあやっぱりスクリプト言語の標準の座ってPythonやRubyですよ。世の大多数の人はそっちのが使いやすいとおもってるんでしょう。ということでそもそもトランスパイラ通すんだったらもっと普通の言語から変えるようなソフトウェアが流行ってもいいんじゃないかなあとか思いますけど、そういうのがないのも謎です。dartとかどうなってるんですかね。(まtypescriptとか一種それだという話もあるか)
五年、十年あとにReact.jsって流行ってるんでしょうか。例えば五年前はcoffee scriptが結構流行ってましたけど、たしかもうサポート打ち切りとかになっちゃったんですよね。もちろん営利企業がバックなので、そこまで急になくなるかはわからないですけど、五年したらみんなまた別のライブラリがすごい!!みたいに言ってるんじゃないでしょうか。
まあだからこれはフロントエンドエンジニア業界全体の問題なのかもしれませんが、そういう将来的な保守コストをどう考えているのかが気になります。特にもし業務ページであるなら、せいぜいがなるべく枯れたライブラリ(≒JQuery)と、テンプレートエンジンあるいはフォーマットストリングでも使ってpure ES6で書いたほうがいいんじゃないでしょうか。そうすると結局SPAにはしないですよね。
まあこれを突き詰めるとじゃあetaxもactivexで、銀行のシステムはcobolで、マシンはpc98で、、、とかなっちゃうかもしれないんで、難しいところではあるとは思いますが、、、
とりあえずこんなところで、有識者の皆さんよろしくお願いします。
React.jsでした。angularと混ざりました。。あと特に喧嘩売ってるつもりとかは全くないですがそう見えたらごめんね。
id:murishinai 主張は単純で、せいぜいES6+トランスコンパイラ(+JQuery)とかでいいんじゃね、遷移はサーバー側でやったほうが楽じゃない?という感じです。
id:wordi virtual domが最大のメリット、ってのはよく見る意見ですね。例えば実際どんな場面で(どのくらいの規模のプログラムで)domの改変コストが効いてくるのか、みたいな実例を教えてくださると助かります。(もちろんFBとかはそうでしょうけど、もっとなんだろう、身近な例でお願いしたいです。)なんかReactががりがり(かつユーザー目線から見て有効的に)使われている例がイメージ出来ないのが問題な気がしてきました。
id:logic ええっと、それはそうなんですけど、なんだろう。標準のもので、少なくとも今後10年はあるだろうと言うもの(たとえばES6+フォーマットストリング)があるのにも関わらず、今後5年持つかもわからないライブラリを全面に押し出すの、ちょっと怖く見えるなあという気持ちです。
id:erukiti 具体的に頭の悪い点をご教授くださるとたいへんありがたいです。小規模だとそもそもvirtual domのメリットもなさそうですし、ES6標準でええんちゃうのんという気がしてならないのですが。
id:manaten もちろんFBやGMailをJQueryだけで作るのは不可能だと思います。だからFBはReactを、GはAngularを作ったのでしょうが、逆にそんなに気軽に使うようなものにも思えないのですよね。それこそ何百ブクマも付くのやべえなあ、と。(ところで私にはReactよりAngularJSのほうがずっと気持ちよく見えます)
SPAが使いづらいってのは言いすぎかな。正確には、「ページ遷移型のUIに比べて、SPAであることのメリットが明らかに生きているページって少なくないですか?」ということです。もちろんFBとかGとかtwとかは例外だと思いますけど、DOMを1000個とか10000個とかいじくり回しているページばっかあるようには思えない。もちろんどーーしてもSPAじゃなきゃダメなんだっていうならこの手のライブラリを使うといいとは思うんですが、どっちかというとニッチな需要じゃないでしょうか。
あとなんか保守点検に関する意識がちょっと違うのかなっていうコメントが散見されたんですけど、うーん、一発書いて書きっぱなしっていう案件そんなにあるんですかね?ちょっとそこがよくわかんないです。一度書いてもやっぱりn年先、さらにもっと言えば自分がその職場からいなくなった後のことまで考えてプログラム書くべきだと思うんです。そうすると、例えば数年後のプログラマにとってのReactは今のprototype.jsになってるかもしれない。そういうリスクが怖いです。勉強すればいいじゃんっていう意見もそうなんですが、なんでしょう、どちらかと言うと保守を気にしているので、そっちじゃないです。まあ幸いにして私は人の書いたJSをいじくり回した経験はないので、ただの推測なんですが。
それともしかしたら「枯れた技術」あるは「標準化」という意識があんまりないのかなとも思いました。まあ確かに「Webの世界は日進月歩!」ってことなのかもしれないんですが…。別のページのブコメとか見ても、「枯れた技術を使う」=「不勉強」みたいなのがあって、不思議です。。
あとcoffeeのころ、っていうコメントありましたが、あの頃はみんな夢がありましたよね。AltJSが世界を救う!みたいな。翻って今はどうか。それを思うと、やっぱり何でもかんでもReactじゃ、という意見には違和感を感じるんですよ。
増田に書いたのは単にみんなが見てくれるというだけの理由です。そもそも今諸般の事情でお仕事としてのエンジニアはしていないですし。ほんとに純粋な質問だと思ってもらえればうれしいです。
まあ長くなってきたので私のブログにまとめ直してもいいのですけど。
そういえばモバイルという話も出ていましたが、先日のandroid instant appsって、アレ「HTMLでモバイル向けに軽快なリッチUI作るの無理だからやめような」ってことかと思ったんですが、どうでしょうか。もちろん今現在は必要ですけど~。
手持ちのプログラムをちょっと手を加えれば作れそうだったので作ってみた(総工数0.5MH)。最下位2つが404になってたおかげでちょっと変なことになってるけど、だいたいこんなもんかな。いわゆるホッテントリーに上がる記事を大雑把に分けると、
に分かれる(勿論ミックスもあるけど)。諸君が『くだらねー』と思っている、エクセルだの英語だの簿記だのは後者だな。ただ、はてブはSNSとして機能している側面もあるけど、SBMが本来の目的である以上、インフォメーション系の記事も当然上位に上がってくる。まあ、ブコメが盛り上がっている何か?を表示出来るようにしたいんだったら、日曜プログラミングでちょろっと書けば?と思う今日このごろ。
ブログに書くほどの話じゃないので、スペースお借りしますm(_ _)m
下見て思った。
http://mizchi.hatenablog.com/entry/2013/09/25/190313
知識が離散して蓄積されてない気がする。
シングルページスタイルのJavaScriptWebアプリケーションのアーキテクチャ
JavaScriptMVCライブラリを利用するよ!
とりあえず今回は、乱立する名称候補たちを紹介
HTML5って言いたいだけのJavaScrtipt使ったスマホのアプリフレームワークとかも呼ばれたり。
HTML5とか言われる前にJavaScriptアプリケーションやるとこれになってた。
アーキテクチャとしては、もっとも正解の名前なのだが、NET系界隈でしかきかん。
ASP.NET MVC Single Page Applicationは、キー要素がかなり詰まってて、参考になる。
このあたりのやろうとしてる奴は一度触っておくが吉
JavaScriptMVCライブラリ、AMD等の依存モジュール管理とか
英語ソースだと結構ポピュラーな感じの名前だが、指針的な匂いでアプリケーションとは言わない感も。
日本でも一時期、大規模Javascript開発とか言われてたが、Bakcbone.jsって名前に変わった。
Node.jsと被るために、このアーキテクチャの説明にはあんまり使われない。
動物本の、
「ステートフルJavaScript MVCアーキテクチャに基づくWebアプリケーションの状態管理 」
原題は、「JavaScript Web Applications」
これだけで、どのぐらい困ったか分かる感じ。
ちなみに、JavascriptMVCアーキテクチャの解説本としてはありなので読むが吉
といっても、10年ぐらい前からXHRとHTMLとDOMでほげるのは
実はあんまり変わってない。
Java界隈から出したかっただけ。oracleが呼んでた気がする。
Struts死んだけど、JSFでやるの?JSF無理筋だから違うフレームワーク作るの。
JSFみたいな抽象化使い始めると、コボルみたいにJava世界に閉じそうだけど大丈夫なの?
このあたりのライブラリ使えば、簡単にこのスタイルのアプリ作れると思ってるでしょ?
ライブラリの名称なのだが、背負ってるものは、大体この界隈全て
だけど、使えば、この界隈のアプリが簡単に作れるかというと、そうでもない。
ますだでリリース報告すると、いいことあるかもよと聞いて、やってきました。
あまけんβ- アマゾン商品の検索をいい感じに使えるサービスを開発中。
「あまけん」はアマゾン商品の検索をいい感じにできるサービスを目標に開発しました。
「あまけん」ではアマゾン商品の検索後、レビュー数などによる並び替えや、星の数でのフィルタリング、画像や簡易表示など表示モードの切り替えが可能です。
また検索後の並び替えなどでは、非常に高速に動作するため、商品の比較などに向いていると思います。
ますだ報告デフォルト(?)の、開発の流れや開発環境を簡単に。
検索後、お好みの星の数でフィルタリングした上で、レビュー数や売上ランキング順で並び替えて商品を比較するのがお勧めです。特にレビュー数は本家サイトにない指標なので、おすすめです。
表示モードは情報量と一覧性のバランスのいい”簡易”モードがお勧めです。お好みに合わせて、情報量の多い”詳細”モードや一覧性が高い”画像モードの使い分けも可能です。
アマゾン内で検索する前や後に併用して、あまけんの高速性を活かして、商品比較用にといった活用もおすすめです。