[html5-developers-jp:950] WebSocketとWebWorkerを使ってみました

[はぎー]

久々の投稿です、hagino3000です。

今、渋谷のギャラリーでやっているイベントで会場のインターネット使用状況を可視化するというインタラクションをWebSocket,
WebWorkerを使って実装してみました。

http://chaos.yuiseki.net
Chromeのみ対応、今日と明日の夜はデータが流れているはずです

サーバー側から頻繁にpushしたかった部分(画面に流してるサーバーのログ)はWebSocketを使い、それ以外の通信はWebWorker内で実
行しています。ついでにアニメーションやフェード効果をほとんどCSS3にしたら、JavaScriptによるCPU負荷はかなり減りました。(逆に
Google Chrome Rendererというプロセスが重くなりましたが。)

サーバー側はrubyで、em-websocketを使っています
http://github.com/igrigorik/em-websocket

リアルタイムで何かを表示させたい時にWebSocketを使うと随分楽に実装できるのが実感できました。以前白石さんの話を聞いて、
WebWorkerの実装はデバッグが大変なのかな、と思っていましたが、ChromeのデベロッパツールがちゃんとWorker内のエラー発生箇所も
教えてくれる時があってそこまで苦戦しませんでした。(Worker外のデバッグに比べれば大変でしたが)

--
このメールは Google グループのグループ「html5-developers-jp」の登録者に送られています。
このグループに投稿するには、html5-dev...@googlegroups.com にメールを送信してください。
このグループから退会するには、html5-developer...@googlegroups.com にメールを送信してください。
詳細については、http://groups.google.com/group/html5-developers-jp?hl=ja からこのグループにアクセスしてください。

[はぎー]

リポジトリのURLを載せてなかったので
http://github.com/yuiseki/chaos_proxy
です

On 5月22日, 午後1:19, はぎー <hagino.3...@gmail.com> wrote:
> 久々の投稿です、hagino3000です。
>
> 今、渋谷のギャラリーでやっているイベントで会場のインターネット使用状況を可視化するというインタラクションをWebSocket,
> WebWorkerを使って実装してみました。
>
> http://chaos.yuiseki.net
> Chromeのみ対応、今日と明日の夜はデータが流れているはずです
>
> サーバー側から頻繁にpushしたかった部分(画面に流してるサーバーのログ)はWebSocketを使い、それ以外の通信はWebWorker内で実
> 行しています。ついでにアニメーションやフェード効果をほとんどCSS3にしたら、JavaScriptによるCPU負荷はかなり減りました。(逆に
> Google Chrome Rendererというプロセスが重くなりましたが。)
>

> サーバー側はrubyで、em-websocketを使っていますhttp://github.com/igrigorik/em-websocket

[Shumpei Shiraishi]

白石です。

土日は子供の相手でネット接続していなくて、見れなかったのが残念(><)

>> WebWorkerの実装はデバッグが大変なのかな、と思っていましたが、ChromeのデベロッパツールがちゃんとWorker内のエラー発生箇所も
>> 教えてくれる時があってそこまで苦戦しませんでした。

そうそう、最近Workerのデバッグというメニューが付きましたね～
だいぶデバッグ楽になりましたね。


2010/5/22 はぎー <hagin...@gmail.com>: