Posted: 2012年3月14日 / Last updated: 2012年3月14日 / オーガニック度: 100% / Read in English 長い記事なので、先に結論だけ書いておきます。WebSocketのバイナリメッセージ機能は、これまでのインターネットのあり方をひっくり返します。「そんなの知ってるよ」という方もいるとは思います。僕も理屈では分かってたつもりだけど、実際にアプリを作ってみて、具体的にそれを感じることができたので、ちょっと長いですがどういうことなのか説明してみます。 WebSocketとは # WebSocketは、HTML5関連の中でも特に注目を集めている技術の一つです。通常のHTTP通信であればクライアントからのリクエストなしにサーバーは応答しませんが、WebSocketを使うことでクライアントとサーバーの間で双方向の通信が可能となります。これを利用す
大規模UIをJavaScriptで実現するためのテクニック、サイボウズkintone開発の現場から。デブサミ2012 7万行規模のJavaScriptプログラムで構築されたユーザーインターフェイス。そのプログラミングで使われたテクニックとはどういうものか。 2月16日、17日の2日間、都内で開催されたイベント「デベロッパーズサミット2012」(デブサミ2012)で、サイボウズ株式会社 開発部 若原祥正氏、生駒浩隆氏が講演「kintoneの表と裏~大規模JavaScript開発と非構造データベース」を行いました。 講演では前半に大規模JavaScriptのテクニック、後半でスキーマレスデータベース構築の仕組みが解説されましたが、この記事では資料が公開された前半のJavaScriptのテクニックについて、ダイジェストで紹介します。 7万行のコード、フレームワークはClosure Library
ngCoreとは何か? Mobageプラットフォーム ngCoreとは何かを説明する前に、まずはMobage(モバゲー)とは何かを簡単に説明しましょう。MobageはDeNAが提供しているソーシャルゲームプラットフォームであり、オンライン上の友人達と一緒にゲームを楽しむことができます。 現在、アプリケーションの開発者はMobageのAPIを利用してゲームを開発し、Mobageプラットフォームを利用している数多くのユーザーにサービスを提供できるようになっています。 多様化するプラットフォーム 当初、Mobageはフィーチャーフォンに利用環境が絞られていましたがYahoo! MobageのようにPC上でも楽しめるようになり、現在ではその領域をさらにスマートフォン環境にまで拡大しています。 スマートフォンでは、フィーチャーフォンでは実現できなかったマルチタッチなどを利用した入力方法やサウンドが可
Installation curl: $ curl -# http://expressjs.com/install.sh | sh npm: $ npm install express git clone, first update the submodules: $ git submodule update --init $ make install $ make install-support Creating An Application The express.Server now inherits from http.Server, however follows the same idiom by providing express.createServer() as shown below. This means that you can utilize Express se
この内容はJsTestDriver WikiのConfigurationFileを意訳したものです。 http://code.google.com/p/js-test-driver/wiki/ConfigurationFile JsTestDriverの設定ファイルはYAMLで書きます。 設定ファイルはテストで使用するファイルをJsTestDriverが読み込むために使用され、標準はJsTestDriverコマンドを実行したカレントディレクトリの「jsTestDriver.conf」を参照します。 この参照先はコマンドラインオプションの「--config」から変更することができます。 各ファイルのベースパスはjsTestDriver.confと同じディレクトリとなりますが、コマンドラインオプションの「--basePath」から変更することができます。また、設定ファイル内のbasepathで
この内容はJsTestDriver WikiのCommandLineFlagsを意訳したものです。 http://code.google.com/p/js-test-driver/wiki/CommandLineFlags $ java -jar JsTestDriver.jar --help --browser VAR : The path to the browser executable --browserTimeout VAR : The ms before a browser is declared dead. --captureAddress VAL : The address to capture the browser. --captureConsole : Capture the console (if pos
この内容はJsTestDriver WikiのAsyncTestCaseを意訳したものではありません。 http://code.google.com/p/js-test-driver/wiki/AsyncTestCase TestCaseはAsyncTestCaseの同期実行版なので基本的にAsyncTestCaseを使いましょう。 (TestCaseをAsyncTestCaseに置き換えるだけでそのまま実行できます) assert関係はこちらからどうぞ Assertions http://code.google.com/p/js-test-driver/wiki/Assertions 以下の二つはTestCaseと互換の基本的な実行方法です。 オブジェクトリテラルを渡す方法 AsyncTestCase('testCaseName', { 'setUp' : function () {},
こんにちは。毎日欠かさずAndroidと心で対話をおこなうHTMLファイ部の高橋です。入社4週目にしての初投稿です。 UIのタッチ操作が絡むJSのテストで、タッチイベントを生成する際のハマりどころをエントリします。 きっかけ 先日、JsTestDriverでタッチイベントの生成をした際、Androidだけイベントが生成されず何のエラーも出ないという事象が発生。 その答えは「selenium」の中にありました。 events.js#443 | selenium // Android's initTouchEvent method is not compliant with the W3C spec. // Android's initTouchEvent method is not compliant with the W3C spec. // Android's initTouchEven
こんにちは。 KRAYアルバイトの浅海です。 今回は、最近ちまたで噂のThree.jsで遊んでみようとおもいます。 http://github.com/mrdoob/three.js webgl対応のブラウザで見ている方は、右上に3Dのボックスが表示されていると思います。 Three.jsを使えば、このようなことを簡単にJavascriptで実現できるのです。 半信半疑で使ってみたところ、たしかにThree.jsでは、3D特有の行列計算や数学的思考をせずとも、3Dを表示、操作することができました。 「ちょっとのプログラムで3Dができる。」 この面白さを皆さんに届けたいです。 目次 立方体を表示する 光をあてる テスクチャを貼り付ける マウスで回転させる マウスで移動させる クリック判定する Three.js web上には、HTML5のcanvasを利用した様々なサンプルページやアプリケーシ
全国20人の ECMA セオリストのみなさま、おつかれさまです。大形尚弘です。 ついに Dmitry 先生の ES3 シリーズも最終章となりました。この後に ES5 シリーズが5章続きますが、それらは基本的に今シリーズの補足として書かれたものですので、ここまでお読みいただいたみなさまは、ほぼ ECMAScript の理論的側面を理解したと言えます。 もしそうでない部分があったとしても、実際に ECMAScript の仕様書をご覧いただければ、これまでとは全く理解度が違っていて、あっという間に足りない知識を補足できると思います。端的に、「仕様が読める」ようになっているはずです。 ES5 であれば、本来 PDF である仕様書を、有志の方が es5.github.com にて「注釈付きの」 HTML 形式で公開し、頻繁に更新されています。注釈の一つはもちろん我らが Dmitry 先生の ES シ
無効なURLです。 プログラム設定の反映待ちである可能性があります。 しばらく時間をおいて再度アクセスをお試しください。
IEでは戻るボタンで戻ったときにonloadイベントが呼び出されるが、Firefoxでは呼び出されないなどブラウザによって動きが違うようです。 よくある二度押し防止対策として、送信ボタンをクリックしたときにボタンを無効(disable = false)にして次の画面に遷移させるということをやりますが、その後ブラウザの戻るボタンで戻られるとボタンが無効のままで操作できないままになってしまいます。 その対策として、画面を表示したときに無効を解除するという処理が考えられますが、IEではonloadイベントが呼ばれるがFFでは呼ばれないという上記の問題が発生します。 調べてみたところ、戻るボタンとonloadイベント - a geekで紹介されている方法で解決できるみたいです。IEではonloadを使い、FFではpageshowを使い、Safariではonloadとonunloadの合わせ技で戻る
There are three ways to read a binary file from the browser. The first one is to download the file through XHR with charset=x-user-defined. You get the file as a String, convert it to byte Array and you have to rewrite all the decoding and encoding functions (getUint16, getFloat32, ...). All the browsers support this. Then browsers that implemented Canvas also added CanvasPixelArray as part of Ima
データベースコネクションの取得 データベースにデータベースシェルで接続します。(ノート: 同じようなことを、お好みのプログラム言語とドライバー|DOCS:Drivers]を使うことによってできます。 このシェルはインタラクティブな用途で便利です) MongoDBのJavaScriptシェルを起動します。
ワーキングドラフトが公開されたり、IEBlogでも言及されるなど、注目度が一層高まってきた感のあるWeb RTC (Web RealTime Communication)仕様について、改めて調べてみました。 Web RTCは、Webアプリからカメラやマイクでメディアデータを取り込んたり、リモートホストとのP2Pのデータ送受信を行うためのJavaScript APIです。 Web RTCは、以前はWHATWG HTMLの一部として仕様が提案されていましたが、分離して一つの仕様になりました。分離したのはつい最近です。 API自体は単純なので、これまでは仕様書流し読みしてわかった気になっていたのですが、「ローカルからのメディアデータの取り込みとP2Pがなんで同じ仕様にあるんだろう?」とふと疑問に思って、きちんと仕様書を眺めて見ました。同じように疑問に思う方が居らっしゃれば、お役に立つ記事かと思い
jsPerf — JavaScript performance playground What is jsPerf? jsPerf aims to provide an easy way to create and share test cases, comparing the performance of different JavaScript snippets by running benchmarks. For more information, see the FAQ. Create a test case Login with GitHub to Create Test Cases
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く