React.js: The Documentaryで振り返るReact普及の歴史

www.youtube.com

Meta(当時Facebook)のReact Core Teamの主要人物たちに直接インタビューしたドキュメンタリー動画

タイムライン

2012年まで

最初はFacebook社内でReactが普及するまでの道程。

当時世の中的にはクロスブラウザの解決策はjQueryに落ち着き、モバイルアプリ化の流れでAPIサーバーとViewは切り離される傾向にあり、JavaScriptのクライアントサイドで大きいアプリケーション作るためにMVCフレームワークとか取り入れないとね〜という雰囲気だった

Facebook社はマーク・ザッカーバーグがHTML5に賭けていた頃*1にBolt.jsというFacebook版Backbone.jsを開発していた

広告プラットフォームのコードは当時Bolt.jsを中心に構成されていたが、Jordan Walkeが関数型プログラミングのアイデアを取り入れ改善しようとした

これがReactの元になっている

先ずReactをNewsFeedのウィジェットに部分導入した

その後Pete Huntが参加し、InstagramのWeb版に導入

移行プロジェクトをするかどうかでめっちゃ揉めたけど、広告プラットフォーム自体も既存のBolt.jsから新興のReactに全面移行

2013年

次はFacebook社外に展開する。開発チームはReactのOSS化を押し進めた。

JS Conf USでReactを大発表したら「JSXがキモ過ぎる」と話題に

www.youtube.com

開発チーム意気消沈

JSConf EUで次鋒Pete行きます

www.youtube.com

この辺りからKhan AcademyのエンジニアやClojureScript作者*2など一部関数型プログラミング愛好家の間では好評価

着実にフォロワーが増えはじめる……

2014年

この頃から日本のコミュニティでもアーリーアダプタの間で話題になっており、よく記事を見かけた

他方、Flux ArchitectureなどReactを実践する為の話題に発展していった

www.youtube.com

2015年

React Nativeリリース

www.youtube.com

NetflixやAirbnb、Yahoo!、GitHubなどがReact使ってるよと表明していたのもこの時期

React界隈で熱心にハックしていたDan Abramovという若者がReact EU ConfでReduxを発表

www.youtube.com

Hot Reloading+タイムトラベルデバッグの概念実証をして界隈がザワつく

そのまま面接してCore Teamにジョイン

2016年以降

中国や日本ではコミュニティの先行したVueの方が多く使われていた時期もあったが段々Reactの採用が増えていった

感想

以下の点に関心を持った

開発現場での問題を解決するために生まれた技術であること

組織が計画的に研究して生み出されたイノベーションではなくて問題と個人の裁量が先にあり、それぞれの人が協力して泥臭くできた結果というのが素晴しいと思った

広告プラットフォームはサルたちの狂宴 下 ――フェイスブック乱闘篇という本などからも分かるとうりFacebookにとってのキャッシュエンジンで、そこの開発を数ヶ月止めてReactに移行するするか否かを現場のエンジニアが判断して、CTOは「中長期的に良い判断をしてくれ」とだけ言って見守っているのがすごい。

また実際に起きている問題を解決するものなので、アーリーアダプタ以下の我々が持つ「ユーザーがどれぐらいいて、どのぐらい将来性のある技術なのか」という類の視点ではなくて、最初から本番環境投入するために開発されておりイノベーターの視点を知ることができた。

新しい概念を普及させてWeb開発の考え方ごと変えたこと

Reactが作るの新しい概念が受け入れられることに注力している描写が多かった

確かにReactは当時からしたらかなり受け入れづらい開発手法だった

今のような駆け出しエンジニアがReactを通じて関数型プログラミングのエッセンスを意識せずに体得する状況になるとは思っていなかった

今の地位にくるまでに、Reactチームはドキュメンテーション、エラーメッセージ、開発ツール、コミュニティ活動などをインクリメンタルに行っていたようだ

ReactはjQuery+Backboneからの置き換えの側面が強かった

  1. jQuery普及
  2. 大規模jQueryアプリケーションとしてBackbone+CoffeeScript(Marionette, Chaplin)が導入される
  3. 一方AngularJS等のデータバインディング系がjQuery Viewの代替としてが注目される
  4. jQueryが役目を終え、Angular, React, Vue三兄弟の状況になる
  5. Backboneで構成していたModel-Controller部分もViewライブラリ系と統合されるようになる

2014年末に発刊されたJavaScriptエンジニア養成読本にはAngularJSやBackboneが特集されているが、Reactはまだ出てこない。

JavaScriptエンジニア養成読本［Webアプリ開発の定番構成Backbone.js＋CoffeeScript＋Gruntを1冊で習得！］

JavaScriptエンジニア養成読本［Webアプリ開発の定番構成Backbone.js＋CoffeeScript＋Gruntを1冊で習得！］

Amazon

この頃に現場で導入の進んでいたのはBackboneの方だったというのが分かる。

FacebookとJavaScriptコミュニティの関係

Facebookは当時JavaScript界隈の有名人を引き抜いてきてWeb関係ないことをやらせてる——とJavaScript系のコミュニティから嫌われていたらしい

FirebugのJoe HewittがiOSアプリフレームワークのThree20作っていたような時代のことだと思われる

確かにMozilla出身の人が何人か居るようだけど……　よく覚えてない

Reactリリース時の反応

僕ははじめてReactを見た時はHipHopとかThriftのようなFacebookクラスのスケールの現場のみが必要としている変態なぞ高度技術ぐらいに受け取ってしまっていました

日本のコミュニティではバーチャルDOMで魂が震えたり*3、なぜかOOP vs FP宗教戦争でQiitaが燃えたり関係ない場外乱闘も発生していた(何だったのか)

登場人物紹介

Jordan Walke

github.com

  • 当時広告チームのエンジニア
  • Reactのオリジナル作者とされる人
  • JavaScript Jabber #146 によるとReact Nativeもvjeuxといっしょに中心になって開発していたようだ
  • 動画には出演を断わったのが出て来ない
  • Metaは2021年に退職してる

Pete Hunt

github.com

Christopher Chedeau

github.com

Tom Occhino

github.com

  • Product Infrastructure Teamのボス
  • 今はVercelのVPoEになってる
  • JS Conf 2013でのReactのOSS化、F8 2014でのFlux発表、React.js Conf 2015でReact Native発表の動画を見ると全部ホストをしている

Shane O'Sullivan

github.com

  • SOS
  • 元Dojo Toolkitのコミッター
  • Bolt.jsを開発していた

Paul O’Shannessy

github.com

Jing Chen

github.com

Sebastian Markbåge

github.com

  • MooToolsやってた人
  • この人も大量にReactにコミットしている
  • Vercelに転職した

Sophie Alpert

github.com

  • Khan Academyの数学問題のエディタでReactを導入した
  • その後React Core Teamにジョイン

Dan Abramov

github.com

  • Reduxの作者
  • Reactのコードを一番書き換えてる現プロジェクトの中心人物

Andrew Clark

github.com

  • Dan Abramovと共にRedux以降のReactの開発を支えた人
  • Vercelに転職した

コミュニティ

David Nolen

github.com

Netflix

参考文献

*1:https://www.itmedia.co.jp/news/articles/1209/12/news032.html

*2:https://swannodette.github.io/2013/12/17/the-future-of-javascript-mvcs/

*3:https://qiita.com/mizchi/items/4d25bc26def1719d52e6