Slackが高速化されたウェブとデスクトップクライアントを公開

米国時間7月22日、Slackはウェブとデスクトップクライアントのメジャーアップデートの公開を開始した。新機能はなくユーザーインターフェイスも変わらないが、内部は完全に作り直されている。2012年にSlackが登場したときにはウェブとデスクトップクライアント(この両者は基本的に同じコードベースだ)はjQueryなどのテクノロジーを使用していたが、ここ1年ほどかけてモダンなスタックに移行してきた。

Slackのプロダクトマネジメントのディレクター、Jaime DeLanghe(ジェイミー・デラング)氏は筆者に対し次のように語った。「Slackは仕事に必要なツールと一緒に、簡単にシンプルに、できれば楽しく使ってもらいたいと思っている。そのために我々はSlackがどんな環境で使われるかを考えた。また、クライアントサイドの開発のエコシステムは、ここ5年で大きく変化している。JavaScriptがアップデートされたし、ReactやReduxといった新しいテクノロジーでダイナミックなウェブアプリを以前よりも簡単に作れるようになった。モダンなパラダイムに合うようにスタックをアップデートしたいと考えていた」。

ここ数カ月、実はSlackは今回のアップデートの前段階の多くをサイレントに展開してきた。ただし全容は、クライアントを最新版にアップデートしたときに明らかになる。新しいElectronアプリですべてが統合されるからだ。

Slackは、新バージョンではメモリ使用量が最大で50%減り、起動は33%速くなるとしている。着信通話に参加するまでの時間も10分の1になるという。

こうした変化の多くは、複数のワークスペースに参加しているユーザーに特に顕著に現れる。デラング氏が強調するように、多くのユーザーが複数のワークスペースに参加しているという想定のもとに新しいアーキテクチャを設計したからだ。これまでのアプリでは各ワークスペースがそれぞれのElectronプロセスを使っていたため、ワークスペースを切り替えるときにメモリやCPUを多く必要としていた。

Slackは、Reactを使って新しいアプリのすべてのUIコンポーネントを作った。新しいアプリでは、すべてのデータがロードされてからUIに表示されるのではなく、利用できるデータを適宜ロードする。

この結果、オフラインのときに、前に開いていたチャンネルや会話を読むこともできるようになった。

さらに重要なポイントは、基盤としてのSlackがモダンなクライアントとなり、機能開発が今後高速化されると考えられることだろう。デラング氏は「無理な約束をするつもりはない。スケーリングと構築を同時に進める企業にとって、検討しなくてはならない障壁のひとつが今回のアップデートによって取り除かれる。トレードオフがこれまでよりもいくらか容易になる」と語った。

今回のアップデートは今後数週間で全ユーザーに展開される。アップデートを利用するには、デスクトップクライアントを新しくすることと、新しいバージョンを使える対象となることの、2つが必要だ。Slack側の状況だけでなく、例えば自社のIT部門がアップデートをどのように導入するかといった要因もある。

画像:Drew Angerer / Getty Images

[原文へ]

(翻訳:Kaori Koyama)

FacebookがChromeブラウザのAPIに初めて貢献

Facebookは米国時間4月22日、GoogleのChromeブラウザのAPIに対して、初めて大きな貢献を果たしたことを発表した。

Facebookのチームは、Googleと共同で、ブラウザにコードを提供するためのAPIプロポーザルを作成した。これはFacebookとしては初めてのこと。このコードは、ウェブ上のツールや標準に関するFacebookの他の多くの仕事と同様に、ユーザー体験をスムーズかつ高速にすることを目指したもの。このAPIの場合、ユーザーがクリック、またはキーを操作してから、ブラウザが応答するまでの時間を短縮する。

この新しいシステムの最初の試験的な実装はChrome 74とともにリリースされる予定だ。

一般的に、ブラウザのJavaScriptエンジンは、コードの実行を制御している。そして、応答しなければならない入力が保留になっていないかどうかを確認するため、一瞬コードの実行を停止することもある。マルチコアのマシンで動作する最新のJavaScriptエンジンも、基本的にはシングルスレッドで動作する。そのため、実際にはエンジンは1度に1つのことしか実行できない。そこで、入力イベントを確認しつつ、コードの実行をどのように組み合わせるかということがカギとなる。

「他の多くのサイトと同様に、私たちもJavaScriptを小さなブロックに分割することでこの問題に対処しています。ページがロードされている間も、若干のJavaScriptを実行し、その後にブラウザに制御を戻すのです」と、Facebookチームは発表の中で説明している。「ブラウザは、そこで入力イベントのキューをチェックして、ページに通知する必要のあるものがあるかどうかを確認できます。その後ブラウザは、JavaScriptのブロックが読み込まれる都度、それらを実行する動作に戻ります」。

ブラウザがこのようなサイクルで動作している際に、新しいイベントをチェックして、その処理に入ると、わずかながら余計な時間がかかる。それが何度も積み重なると、ページのロードが遅くなる。とはいえ、入力のチェックのインターバルを長くすると、こんどはブラウザの応答が鈍くなるので、ユーザー体験が劣化してしまう。

これを解決するため、FacebookのエンジニアはisInputPendingというAPIを作成した。これにより、上のようなトレードオフをする必要がなくなる。Facebookは、このAPIを、W3Cのウェブパフォーマンスのワーキンググループにも提案した。これを利用すれば、デベロッパーは保留中の入力があるかどうかを、コードの実行中に確認できる。

これにより、コードは応答すべきものがあるかどうかを自分でチェックできるようになる。ブラウザに完全に制御を戻さなくてもよく、さらにそこからJavaScriptエンジンに入力を引き渡す必要もない。

現時点ではこれはまだ試験的なもの。デベロッパーは、このAPIを自分のコードに組み込む必要があるため、Chrome 74のリリース後に、自動的にブラウザの動作が速くなるというわけではない。この試行が成功すれば、もちろんデベロッパーはこのAPIを利用するようになるだろうし(もちろんFacebookは自ら利用するだろう)、他のブラウザベンダーもそれぞれのエンジンにこのAPIを実装するようになるはずだ。

「ChromeにisInputPendingを導入するプロセスは、Facebookにおいてウェブ標準を開発する新しい方法を象徴するものです」とチームは言う。「私たちは今後も新しいAPIに取り組み続け、オープンソースのウェブブラウザへの貢献を増強したいと考えています。将来的には、このAPIをReactのコンカレントモードに直接組み込むことも可能となるでしょう。そうすれば、デベロッパーはこのAPIのメリットを、自動的に享受できるようになります。さらに、isInputPendingは、スケジューリングに関するプリミティブをウェブに導入するという大きな流れの一環なのです」。

画像クレジット:Getty Images上のAlexander Koerner/Getty Images

原文へ

(翻訳:Fumihiko Shibata)

Facebookが簡単なVRアプリを作るためのJavaScriptフレームワークReact VRをオープンソースでローンチ

Facebookは今日(米国時間4/18)、同社のデベロッパーカンファレンスF8で、React VRのローンチを発表した。これは、JavaScriptで仮想現実体験を構築できるためのJavaScriptフレームワークだ。Webアプリケーション用の同社のフレームワークがReactであるのに対し、仮想現実用のReactという意味でReact VRという名前になっている。つまりReactと同様の宣言型の書き方で、360度体験のアプリケーションを作れるのだ。

当然ながらReact VRは、WebGLやWebVRといった既存のWeb技術を利用して仮想現実体験やセンサー群との対話を実装している。現状はまだ、複雑なVRゲームを作れるレベルではなく、3Dモデルを記述できるとはいっても、2DのUIやテキストや画像に360度のパノラマを容易に組み合わせることができる、という程度だ。

Reactで何かを作った経験のある人なら誰でも、React VRを楽に使えるだろう。またもちろん、Reactのエコシステムにある既存のツールの多くを利用できるだろう。

ふつうのモバイルアプリよりもきついのは、VRアプリが60fps(できればそれ以上)の描画を要することだ。すでにReact NativeがJavaScriptでは難しいとされる問題の多くに対応しているから、React VRのチームはそのアプリケーションの高速高性能化に、それほど苦労せずに済んだようだ。

React VRのコードはGitHubで入手できる。何か作ってみたくなった人は、ここでドキュメンテーションを読もう。

[原文へ]
(翻訳:iwatani(a.k.a. hiwa))

Facebookがすべてのオープンソースプロジェクトの窓口をGitHub上に一本化、それをFacebook Incubatorと呼ぶ

BERLIN, GERMANY - FEBRUARY 24:  Coffee mugs adorned with the Facebook logo stand at the Facebook Innovation Hub on February 24, 2016 in Berlin, Germany. The Facebook Innovation Hub is a temporary exhibition space where the company is showcasing some of its newest technologies and projects.  (Photo by Sean Gallup/Getty Images)

【抄訳】
先週Facebookは、Reactによる開発を簡易化するためのプロジェクトCreate React Appを立ち上げた。しかし実はそれは、もっと大きな話の一部だった。GitHub上にFacebook Incubatorというものが作られ、そしてCreate React Appはそこに入る最初のプロジェクトなのだ。

Facebook Incubatorは、Facebookがオープンソースのプロジェクトをリリースするときの総合窓口になる。しかも今後長期的に。それは、Facebookが提供するオープンソースプロジェクトのベータのためのステージ、実験場、のようなものだ。

Facebookのオープンソース部門の長、James Pearceによると、主なねらいは、すべてのプロジェクトの良質なライフサイクル管理を維持すること。Facebookがオープンソースにしたプロジェクトはこれまでにおよそ400あり、GitHub上には数十万のフォロワーがいる。“どんなに数が多くなっても、良質な管理をキープしたい”、と彼は語る。そのために、すべての新しいプロジェクトが最初にこのFacebook Incubatorに入り、コミュニティの反応や採用の過程を一望できるようにする。

Pearceが強調するのは、このIncubatorはFacebookのそのほかのルートリポジトリの場合と同じく、同社自身が社内的に使うプロジェクトであり、活発に開発とメンテナンスを続けるチームが必ず存在する。休眠プロジェクトのための物置ではない。

このIncubatorを卒業するためには、ユーザーや愛好家が多くなることはもちろんだが、そのほかに、Facebook内部やその関連以外でも使われるようになっているか?、良質なドキュメンテーションが完備しているか?、ほかのツールと容易に統合できるか?、などが、重要な要件となる。Facebookがそのユーザーコミュニティにエンゲージできることも、要件の一つだ。

“業界全体からの反応があれば、それは、卒業してもよい兆候だ”、と彼は述べる。〔卒業、よりも、独立、と言うべきか?〕

Pearceは、ドキュメンテーションの重要性を何度も強調した。オープンソースでは、ドキュメンテーションが粗略になることが、少なくないからだ。Facebookは、このFacebook Incubatorリポジトリ専任の、テクニカルライターのチームを確保し、また技術者たちもドキュメンテーションの良質化に積極的に協力すべし、としている。また一部のドキュメンテーションに関しては、StackOverflowがこのたび新設したドキュメンテーションサービスも利用する予定だ。

なお、Open Compute Projectなどの、大きな組織や企画に属するオープンソースプロジェクトは、このIncubatorリポジトリには最初から入らない。デベロッパーは、最初からそっちの方へアクセスするだろう。

【後略】

[原文へ]
(翻訳:iwatani(a.k.a. hiwa))

Facebookが新しいオープンソースプロジェクトでReactの敷居を低くする

BERLIN, GERMANY - FEBRUARY 24:  The Facebook logo is displayed at the Facebook Innovation Hub on February 24, 2016 in Berlin, Germany. The Facebook Innovation Hub is a temporary exhibition space where the company is showcasing some of its newest technologies and projects.  (Photo by Sean Gallup/Getty Images)

FacebookのReactは、JavaScriptで手早くアプリケーションとそのユーザーインタフェイスを作りたいときのための、オープンソースのライブラリだ。ただし、実際の話はこれほど単純ではない。Reactでアプリケーションを作るためには、JavaScriptのほかにも、いろんなツールを勉強しなければならないのだ。

FacebookはReact用の自社のツールについて語っているが、でも個人のデベロッパーやスタートアップの多くは、Facebookのような企業が持ってるリソースがない。

そこで、もっと多くの人がReactで仕事ができるために、同社は今日(米国時間7/22)、新しいオープンソースプロジェクト”Create React App”(Reactアプリケーションを作ろう)を立ちあげた。それは、あるハッカソンから生まれたプロジェクトで、Reactでアプリケーション開発を始めるために必要なツール集合を、たった一つのコマンドラインツールにまとめたものだ。

[Marcはあとちょっとで彼のReactの”hello world”アプリケーションを実装できるところだった]〔実際には複雑すぎてできなかった〕

FacebookのDan Abramovが今日の発表声明で次のように述べている: “従来、このようなプロジェクトはうまく行かないことが多かった。しかし先日、Christopher [Chedeau]がぼくに、複数の’React CLI’(Reactコマンドラインインタフェイス)を作り始めたけど、Facebookには無視された、と言った。コミュニティにも、同じような目標のツールが存在している。でも今のところは、それほど人気がない”。

Create React App(すごい分かりやすい名前だ!)の場合は、構成ファイルというものがない。環境のセットアップは、自動的に行われる。しかも、デベロッパーが手にするのは単一のツールだ。だから依存性も単一だ。しかし内部的には、JavaScriptやReactのエコシステムの既存のツールをたくさん利用している(Webpack, Babel, ESLint, などなど)。

このツールがユーザーをロックインしないことも、強調されている。この種のサービスでは、よくあることだが。ユーザーはつねに単一のコマンドを発行し、それが基本的にやるのは、ユーザーの構成を‘イジェクト’して、依存性を新しいプロジェクトへ構築することだが、プロジェクトはCreate React Appには依存しない。

Abramovはこう書いている: “‘イジェクト’によっていつでもCreate React Appの居心地の良いセットアップを去ることができる。コマンドを一つ発行するだけで、ビルドのすべての依存性、構成、そしてスクリプトがユーザーのプロジェクトへ移動する。その時点でユーザーは必要なものを何でもカスタマイズできるが、しかしそれはわれわれの構成をフォークして自分の道を進むことだ”。

これによって初心者がReactを使い始めるのが容易になるが、しかし経験豊富なデベロッパーでも、この新しいツールをは試してみたくなるだろう。

[原文へ]
(翻訳:iwatani(a.k.a. hiwa))