タグ

2012年2月1日のブックマーク (5件)

  • 詳解! HTML 5と関連APIの最新動向 - Webアプリ開発編

    Web Workersは、Webアプリケーションにおいてバックグラウンドでの処理実行を実現するための技術だ。 HTMLJavaScriptで作成したプログラムは、基的にUIスレッド内で行われるため、JavaScriptでの処理に時間がかかるとその分UIの応答性が劣化する。最悪の場合は、ブラウザがフリーズした挙句に「スクリプトが応答しない」というダイアログが表示されてしまい、処理を中断されてしまうこともある。 Web Workersを使用すると、バックグラウンドで動作するスレッド(ワーカ)を簡単に生成することができるため、長時間にわたる処理はワーカに任せることで、UIの応答を妨げることがなくなる。 ワーカを生成するのは非常に簡単だ。Workerクラスのコンストラクタに、ワーカのソースコード(JavaScriptファイル)を指すURLを渡せばよい。 var worker = new Wor

  • 詳解! HTML 5と関連APIの最新動向 - Webアプリ開発編

    HTML5から、ウィンドウ(フレーム)間でメッセージの送受信を行うための仕組みが用意された。この仕組みを用いると、対象となるウィンドウのインスタンスさえ手に入れば、同じオリジン(プロトコル+ドメイン + ポート番号)のWebページはもちろん、違うオリジンのWebページとも通信を行うことが可能だ。 まず、他のウィンドウから送られてきたメッセージを受信するには、windowオブジェクトのmessageイベントを監視する必要がある。 // messageイベントの監視 window.addEventListener("message", function() {...}, false); 他のウィンドウに対してメッセージを送信する場合は、window.postMessage()メソッドを使用する。 postMessage(data, "targetOrigin"); postMessage()の

  • 詳解! HTML 5と関連APIの最新動向 - Webアプリ開発編

    サンプルのソースコードを以下に示す。 HTMLファイルでは、HTML要素のmanifest属性にマニフェストファイルのURLを指定している以外は、特に注目すべき点はない。 hello.html <!DOCTYPE HTML> <html manifest="hello.manifest"> <head> <meta charset="UTF-8"> <title>おはよう</title> <script src="hello.js"></script> </head> <body onload="init()"> <p>おはよう</p> </body> </html> 上のHTMLファイルから読み込まれているJavaScriptファイルは以下の通りだ。ドキュメントのonloadイベントで呼び出される、init()というメソッドが1つ定義されているのみだ。 hello.js function

  • HTML5でiPhone用Webアプリをオフライン対応に

    HTML5でiPhone用Webアプリをオフライン対応に:iPhoneで動かす業務用Webアプリ開発入門(5)(1/2 ページ) モバイルWebアプリはオフライン対応が必須! いよいよ最終回の今回は、「Application Cache(アプリケーションキャッシュ)」を使います。 HTML5で導入されたアプリケーションキャッシュを使うと、WebアプリをWebブラウザのキャッシュに載せてオフラインで利用できるようになります。特に、前回の「HTML5のlocalStorageでiPhone用Webアプリを高速化」で紹介したHTML5の「localStorage」と組み合わせると、一度ダウンロードしたデータについては完全にオフラインでアプリが動作するようになります。 オフラインでの利用に対応して、3G回線など接続が安定しない環境でも業務用Webアプリが快適に使えるようにしてみましょう。 「キャッ

    HTML5でiPhone用Webアプリをオフライン対応に
  • HTML5のlocalStorageでiPhone用Webアプリを高速化

    HTML5のlocalStorageでiPhone用Webアプリを高速化:iPhoneで動かす業務用Webアプリ開発入門(4)(1/2 ページ) 今回は、iOSのSafariの中にデータを記録できる、HTML5の「localStorage」機能を使って、データの先読みとキャッシュを実現しアプリケーションの体感パフォーマンスを向上させてみます。 HTML5の「localStorage」とは localStorage(ローカルストレージ)とは、HTML5で規定されている、Webブラウザ内部のKVS(キーバリュー型データストア)です。iOSのSafariでも実装されていて、JavaScriptコードからアクセスでき、任意のデータを保存できます。 いきなり注意! localStorageの保存データはテキストで! HTML5の仕様では、localStorageに保存できるデータはJavaScrip

    HTML5のlocalStorageでiPhone用Webアプリを高速化