Node.js+Socket.IOでAir Bellのアンサンブルを実現! - SINAP Christmas Project 2013 -

2013.12.18
nodexaribells.gif

こんにちは、フロントエンドエンジニアの村山です。

先日公開されました、クリスマスプロジェクトのブログになります。SUMMERでもやってましたが、今回も私の担当はNode.js(+Socket.IO)の部分でした。Node.jsって何だっけって言うお話とAir BellsでNode.js使ったお話です。

ここまで Leap や Web Audio API など、フロントやハードで見た目にも楽しい内容から一転、バックエンドな話ですがおつきあいください。

Node.jsとは

Node.js

サーバサイドはまだまだ勉強しはじめで、なんと表現したら良いんでしょうかね。JavaScriptでありサーバサイド言語と言えば良いんでしょうか。

サーバとしての実装部分の後はクライアントサイドでJavaScript書く要領で書けるため、今までフロントエンドをしていたエンジニアからすると敷居は低いかと思います。

Socket.IOとは

Socket.IOはNode.jsのモジュールの一つです。Node.jsには様々な機能を持つモジュールが数多あるのですが、Node.jsでリアルタイムウェブアプリケーション開発となるとSocket.IOを使う事が多いのではないでしょうか。

Webの世界にはWebSocketやポーリングといった様々なリアルタイムウェブ接続がありますが、これはブラウザやデバイスによってできたりできなかったりします。Socket.IOはそういった様々あるリアルタイムウェブ接続を接続方法を隠蔽して全てのブラウザ・デバイスでリアルタイム通信を可能にするAPIを提供してくれます。誰かが接続した事を他の人に伝えたり、誰かがサーバに送ったメッセージを接続者全員に送ったりする事ができます。

Node.jsの特徴

一般的にNode.jsのメリットというとC10K問題(クライアント1万台問題)を解消できるというのが大きいです。C10K問題というのはJavaやPHPではクライアント接続の度に新しいスレッドが立ち、その度に2MB程度のメモリを使用してしまうため、同時に接続できるクライアント数があり、それを超えてしまうとシステムダウンしてしまう、というやつです。Node.jsではシングルスレッド・イベント駆動で動作しており、クライアント接続されてもスレッドは立たず1イベントとして処理されるため、このメモリの問題を飛躍的に解消できるというわけです。

またNode.jsのメリットと言われて自分の中で真っ先に出てくるのは先にも上げたJavaScriptで書ける事でしょうか。今までフロントを担当していたエンジニアがそのままバックエンドまで一貫して書けたりするので、裏表の連結が容易にできたりするのも美味しいかなと思うこの頃です。良いか悪いかは置いておいても、フロントで使うオブジェクトをサーバからそのまま投げることもできます。

しかしシングルスレッド故のデメリットも多く、マルチコアを活かせないとか、1つの構文エラーでサーバが止まるとか、1つの重い処理で全体が止まるとかとか、等々...。

ちょっと探せば様々な事を言われていますが、良い所も悪い所もまとめてそれがNode.js特徴です。PHPやJavaにだって向き不向きがあるのでDisる事もありません。

ほかに比べたら1クライアントにガッツリ注力できないけど、すごくたくさんのクライアントをさばける、みたいな感じです。

Air Bells と Node.js+Socket.IO

Air BellsではNode.js+Socket.IOの技術をもってそれぞれのクライアントでハンドベルのアンサンブルが行える様になっています。

C10K問題を危惧してNode.jsを使ったのではなく、今回の主役はLeapであり、Leapの動きをリアルタイムウェブアプリにできないか!!という事でSocket.IOに白羽の矢がたったのがホントの所だったりします。ハンドベル合奏団なので1万人どころか100人だって多いですからね。

シングルスレッドのため完全同タイミングの和音が使えないなどあるため、同時演奏者が増えれば増えるだけ厳しい事になりそうです。

Node内部の動きとしては、それぞれのクライアントから送られてくる「接続した」「名前を変えた」「部屋に入った」「音を鳴らした」といった様々なメッセージを受けて、サーバ上のデータを更新しそのレスポンスを関係するクライアントに返しています。

データの更新記述はJavascriptそのまま、やり取りされるメッセージもJSONでそのままフロントへ。

誰かの動きを皆に拡散する裏方の働きをして、その繰り返しで「合奏をしているように見せる」演出をしています。

Node.jsで作られたもの・作ったもの

Node.jsは性質上Webサイトよりもゲームアプリケーション等への適正が高いようで、Webサイトで有効活用されているものは少ないかもしれません。

Webサイト:Node学園祭
シナップでもデザインのお手伝い等させて頂いたNode学園祭のWebサイト。マウス位置を他の接続者と共有している。
Webアプリ:SINAP SUMMER 2013 すまほ風鈴
弊社が2013年夏プロジェクトで制作したウェブアプリケーション。風鈴を吊るし、他の接続者と共有してならしたりならされたりできる。
ソーシャルゲーム:ピグライフ
サイバーエージェント社のソーシャルゲーム。仮想空間に庭を作り、他の接続者とアバターを通じてコミュニケーションをとったりできる。

Air Bells と 私の年末

弊社の年末年始はちょっと早めなので、実家に帰って家族皆で鳴らすデス。ノエルは家族皆で過ごす日ですよ!

煩悩じゃないけど108度ならして新年を迎えるでしょう。

この記事をシェアする