2024.12.24
ビジネスが急速に変化する現代は「OODAサイクル」と親和性が高い 流通卸売業界を取り巻く5つの課題と打開策
リンクをコピー
記事をブックマーク
Taro L. Saito氏:じゃあ今度はクライアントサイドについて見ていきます。Scala.jsというのは基本的にScalaのコードをJavaScriptに変換するものなので、基本的にScalaのコードしか使えない。例えばJavaのコードが紛れ込んでいるとコンパイルがエラーになってしまいます。なので、依存関係にあるライブラリもすべてScalaになるように注意する必要があります。
Airframeでは、Scala以外のコードが紛れ込まないように、dependencyを最小にして、すごく非常に気を遣ってデザインされています。あとアノテーションが使えなかったりとかランタイムリフレクションが使えないなどの制約があります。
一方、コンパイルタイムに行われるもの、例えばScala Macrosによるコード展開などは、実はScala.jsではなにも問題なく使えます。
またRPCの実装では、常に非同期実行になります。Scala Futureベースの非同期実行になっていて。ただ問題なのが、Futureを待つ方法というのがないんですね。というのも、JavaScriptはブラウザ上でシングルスレッドで動いているものなので、バックグラウンドで処理を待つということはありません。だから結局レスポンスを受け取ってFutureのチェインでmap、flatMap、resqueなどを駆使して操作を連結することが必要になってきます。
Scala.jsのコードはブラウザ上で動くのでデバッグがなかなか大変になってくるんですけれども、Chromeなど最近のブラウザにはDeveloper Consoleというのがあって、そこに対してログを表示してあげると、非常にデバッグしやすくなります。
Scalaのコードは1回JSにコンパイルされているんですけれども、airframe-logというモジュールを使うと、デバッグが非常にしやすくなります。例えばdebugというメッセージをここで表示すると、ここのデバッグログのメッセージだけじゃなくて、ソースコードのファイル名や行数までも表示されます。
また、Scala.jsでWeb UIを作るための手法も実はすごくいろいろあるんですね。ただ、基本的にはDOMを生成すればいい。DOMというのは例えば
例えばXMLリテラルのScalaの機能を使ってDOMを表示するなど。monadic-html、Binding.scala、そういうライブラリがありましたけれども、どうしてもこのXMLをScalaの中に書くのは、ちょっと書きにくいところもあります。Dotty(Scala 3.0)ではXMLリテラルが廃止されるので、このアプローチというのはどうも筋がよくない。
現在のベストプラクティスは、Scalaの関数を使ってDOMをどんどん構成していく。例えばScalaTagsでは、このHTMLというのが関数で定義されています。「html」「head」「body」「h1」「div」、これらのタグが全部関数で定義されている。今から紹介するAirframe RxもすべてHTMLのタグに対応するものを関数で定義しています。
この2つの大きな違いは、DOMのelementとattributeを区別するかどうか。例えばScalaTagsでは、ここがattributeで、ここはtext部分なんですけど、この両者を区別するのに括弧を入れています。一方、もっと最近のアプローチだと、この2つを区別しないで、両方とも1つの括弧の中に入れてしまおうという。
実は後者のほうがScalaの関数型のシンタックスに非常にマッチしていて、実際に書いてみると、ScalaTagsはすごく括弧をたくさん書かなくてはいけなくてすごく大変な書いていてつらいライブラリですが、最近のscalajs-reactとかAirframe Rxでは、よりScalaで書きやすい形になっています。
関数をネストさせることでより複雑なDOMの要素も生成できます。Airframe RXではrenderというインターフェイスを提供することで、DOMのエレメントをネストしたりとか、あとからスタイルを設定したりとか、そういうことが可能になるようにデザインされています。
また例えばこういう凝ったテーブルのレイアウトを表示したいときに、Scalaのコレクションを間に埋め込んだり、テーブルの1行1行を表示したり、イベントに応じてDOMを書き換えたり、そういうことができるようになっています。
また、リアクティブにユーザーのクリックなどの動作に反応してUIを書き換えなくてはいけないので、例えばRx.variableというものがありまして……。これは何をするかというと、変数に変更があるとイベントをどんどん後ろのオペレーターに伝播、すなわち影響を伝播させていくという実装になっています。
例えばRx.variableを定義して、実際にマップをして、文字列を作って、subscriberでprintする。そうすると、最初は「World」という値が入っているので「Hello World!」が表示されるんですけれども、このRxの変数の中身を書き換えてあげると、今度は同じコードが実行されて、今度「Hello Rx!」が表示される。そういう仕組みになっています。
こういう仕組みはMonixとかScala.rxなどいろいろなライブラリでも実装されていて、monadic-htmlでも同様な実装になっています。
重要なのは、最終的にsubscriptionをキャンセルしてDOMのリフレッシュができることです。Airframe Rxは、Monixだったりとかmonadic-htmlのいいところを取って、このダイナミックにDOMを書き換えるインターフェイスが定義されています。
また、このRxの実装の背景にあるのがReactiveXというストリームを処理する実装です。これは基本的にはmap、flatMap、filterなどのオペレーションが使えて、ScalaのコレクションのAPIとほぼまったく一緒なんですね。なので、Scalaのコレクションの使い方さえ知っていれば、こういうストリームの情報、すなわちイベントの情報を受け取って、その都度DOMの要素を書き換えていくというのは、実はすごく簡単にできる。
また、このリアクティブのRxの抽象化を使うことで、例えばgRPCではクライアントストリーミング、サーバーストリーミング、あとは双方向での通信を適宜行うようなアドバンスドな通信もサポートされているんですけれども、そういうのもどんどん実装することができます。
では、まとめです。Airframeを使うことでScala中心の開発をすることが可能になっています。このアプローチのメリットは、もうScalaさえ学べばクライアント・サーバーの実装というのを全部済ませてしまう。非常にラーニングコストが下がるんですね。
Protocol Bufferについて学ばなくてもいいし、FinagleとかgRPCのWebサーバー側の技術についても最初は学ばなくてもよくなるというところがすごく大きなところ。
結論です。Scalaは非常に強力なプログラミング言語です。いいところは、最初はすべての技術を蹴散らすような書き方をしたんですけれども、実際にはいろいろな技術のいいところをScalaにどんどん集約することができます。ラーニングコストを最小化してScalaファーストなアプローチを可能にしているのがAirframeのライブラリです。
以上で終わりです。ありがとうございました。
2025.01.16
社内プレゼンは時間のムダ パワポ資料のプロが重視する、「ペライチ資料」で意見を通すこと
2025.01.15
若手がごろごろ辞める会社で「給料を5万円アップ」するも効果なし… 従業員のモチベーションを上げるために必要なことは何か
2025.01.20
組織で評価されない「自分でやったほうが早い病」の人 マネジメント層に求められる「部下を動かす力」の鍛え方
2025.01.14
目標がなく悩む若手、育成を放棄する管理職… 社員をやる気にさせる「等級制度」を作るための第一歩
2025.01.09
マッキンゼーのマネージャーが「資料を作る前」に準備する すべてのアウトプットを支える論理的なフレームワーク
2025.01.14
コンサルが「理由は3つあります」と前置きする理由 マッキンゼー流、プレゼンの質を向上させる具体的Tips
2025.01.07
1月から始めたい「日記」を書く習慣 ビジネスパーソンにおすすめな3つの理由
2025.01.21
言われたことしかやらないタイプの6つの言動 やらされ感が強く他人任せなメンバーを見極めるチェックリスト
2017.03.05
地面からつららが伸びる? 氷がもたらす不思議な現象
2015.11.24
人は食事をしないとどうなるか 餓死に至る3つのステップ
チームの生産性を上げるマネジメント術
2024.12.11 - 2024.12.11
特別対談「伝える×伝える」 ~1on1で伝えること、伝わること~
2024.12.16 - 2024.12.16
安野たかひろ氏・AIプロジェクト「デジタル民主主義2030」立ち上げ会見
2025.01.16 - 2025.01.16
国際コーチング連盟認定のプロフェッショナルコーチ”あべき光司”先生新刊『リーダーのためのコーチングがイチからわかる本』発売記念【オンラインイベント】
2024.12.09 - 2024.12.09
NEXT Innovation Summit 2024 in Autumn特別提供コンテンツ
2024.12.24 - 2024.12.24