Reactive Programming in JavaScript - Frontrend Final Conference 資料
Posted: Updated:
Reactive Programming
Reactive Programming in JavaScript ( 今回のスライド: HTML版 )
このスライド自体が Bacon.js で書かれた ahomu/Talkie で作られています。Rx系のライブラリに興味を持たれた方は、ぜひコードのほうもご覧いただければ。
アジェンダ
- What is Reactive Programming ?
- Reactive in Frontend JavaScript
- FRP with Reactive Extensions
Reactive Programming について紹介しました。今回も懲りずに新ネタでしゃべった次第。Reactive も Functional も若干こわいひとたちが生息しているイメージ（個人の感想です）があるので、遅延評価で飛んでくる斧だけがこわい :P
ノイズ避け
率直な感想として、RP/FRP を学ぼうとすると情報的なノイズが多く、検索結果を総合して自分の中で知識を体系化するのには非常に高いコストがかかります。その点、まずは気にしなくて良いところはスルーできるように、興味をもってくれた方が後から学習するときの助けになるように意識しました。
非同期データストリームという概念
一番説明が難しかったところです。Better Promise または Async Array であり、既存の JS のモデルと比較した この図 は、モデル理解の取っかかりとして秀逸でした。（セッション中でも拝借しています）
- GUI プログラミングにおける非同期処理の複雑性と、RP の必要性
- 同期/非同期を問わず、全てを時間軸に沿って値が流れるリストに落とし込む
- リストとみなすことで関数型のイディオムを活かすことができる
1度理解してしまえば、興味深いモデルだなぁと思います。
Bacon.js 推し
Rx の Hot/Cold Observable が取っかかり悪く感じるのと、Bacon.Bus という役割が自明なオブジェクトの存在は大きいと思いました。React や Backbone に組み込むにも違和感なく扱えるし、モジュール化もしやすい。
今回は Reactive Extensions に敬意を表して、まずは基本ということで RxJS を紹介しました。とはいえ Bacon.js, Kefir.js の辺りであれば Observable 周りの I/F は酷似しているので、基本的な概念はそのままに使い始められます。
そういえば本編中に「Reactive Extensions的なもの、随分前からあるのに流行ってない」的な物言いをしてしまいましたが、本家 Rx からすれば流行るも何もなく普通に使われているライブラリかと思います。あくまで近代 JavaScript 界隈の文脈のつもりで言っていたのでごめんなさい。。(;˘ω˘)
釈明
えっと...
デモ、ReactとES6知らないとついていけないと思う。 #frontrendjs
— Kuu MIYAZAKI (@miyazaqui) February 21, 2015何も言わずにArrow Function #frontrendJS
— じまぐ (@nakajmg) February 21, 2015...すまんかった。
セッション自体は、Reactive なにそれおいしいの？ってカンジだったであろう、弊社の若い衆にも一定の理解が得られたようなのでちょっと安心してます。
エゴサ
気持ちを高めている
Reactive Programming in JavaScriptこれも神資料
2015/02/22 10:28
Reactive Programming in JavaScript
- [reactive]
種類が色々あって分かりづらいリアクティブプログラミング界隈が綺麗に整理されている。これはいい資料だ
2015/02/22 11:25
どうでもいいけど # の有無で、はてブ分散してる...(´ω`) canonical ??
完全にﾘｱｸﾃｨﾌﾞちからがたまるわかりやすい講演だった #frontrendJS
— Kuniwak@Lint freak (@orga_chem) February 21, 2015#frontrendjs 正直わからないところも多かったが全体としては非常にわかりやすかった
— sys9kdr (@sys9kdr) February 21, 2015わかりやすくてめっちゃ面白かった #frontrendJS
— Genki @ 就活戦士 (@GenkiSugimotoJP) February 21, 2015おれ、次もがんばるよ(´；ω；`)
Frontrend おつかれさまでした
上京以来、Frontrend に混ぜていただいて数々のセッションでしゃべらせていただきましたが、毎回テーマを喋るために勉強をし続けるため、自分にとっても良い学びの機会でした。
今回の FFC (Frontrend Final Conference ﾃﾞｽｯﾃ!) で Frontrend というブランドの活動に一旦の区切りがつけられましたが、これからも研鑽して参りたいと思います ( ˘ω˘) 拝
参考URL
最後になりますが分類しんどいので、雑に全部だします。今回は削ったけど、ほんとはCSP的な文脈も入れたかった−。
- Functional Reactive Programming
- State Your Business - A journey in the world of Reactive Programming with JavaScript
- Sean Voisen » Functional Reactive Programming with Bacon.js
- Functional Reactive Programming with RxJS
- Stream processing, Event sourcing, Reactive, CEP… and making sense of it all | Confluent
- データバインディングとリアクティブプログラミング - Togetterまとめ
- Functional Reactive Programming with Bacon.js // Speaker Deck
- Functional Reactive Programming - HaskellWiki
- FRP - Functional Reactive Programming
- What is Reactive Programming? — Reactive Programming — Medium
- pokarimさんのReactive Manifestoに関する印象 - Togetterまとめ
- 非同期ストリーム処理の標準化を目指す "Reactive Streams" とは - Okapies' Archive
- The Netflix Tech Blog: Reactive Programming at Netflix
- The Netflix Tech Blog: Reactive Programming in the Netflix API with RxJava
- Event processing at all scales with Reactive Extensions | Techdays 2014 the Netherlands | Channel 9
- The History of Reactive Extensions
- Reactive Porn - steps to phantasien
- Q. （関数型）リアクティブプログラミングとは何ですか？ | POSTD
- やさしいFunctional reactive programming（概要編） - maoeのブログ
- なぜリアクティブプログラミングは重要か。 - Conceptual Contexture
- Bacon
- 【翻訳】あなたが求めていたリアクティブプログラミング入門 - ninjinkun's diary
- RxJava Observable tranformation: concatMap() vs flatMap() | Fernando Cejas
- RxJS/whyrx.md at master · Reactive-Extensions/RxJS
- ErlangとGolangを比較してみる - Qiita
- CSP and transducers in JavaScript
- Taming the Asynchronous Beast with CSP Channels in JavaScript
大変どうでもいいのですが、Frontrend中に E5 で5連続大破撤退しました。つらい。
