新しくなるappCacheとtemplateでWebアプリケーションの作り方が変わる

2013年3月4日

WebComponents仕様の一部として議論されているテンプレートの機能は、Ajaxが登場したときのようにWebアプリケーションを変えていくだろう。W3Cのマイケル・スミス(Michael Smith)氏は2月18日に都内で開催された「第36回HTML5とか勉強」でそう説明し、HTML5.1に相当する議論中の新機能への期待を示しました。

先週紹介した「オフラインファーストの思想と実践」の前に行われたスミス氏のセッション「勧告候補になったHTML5.0の仕様についてと、HTML5.1の始まり」の内容をダイジェストで紹介しましょう。

新しくなるアプリケーションキャッシュ

マイケル・スミス氏。今日はappCacheとtemplateと、HTML5のテストをgithub上に置き始めた、などの話をします。

fig

アプリケーションキャッシュ(appCache)はご存じですか? HTML5でオフラインアプリケーションを作るためのキャッシュ機能。ところが、いまはオンライン状態でもアプリケーションはキャッシュを見に行ってしまいます。

現在のappCacheはたくさん問題があります。そこでグッドニュース。新しいappCacheの作業が始まっています。先週発表される予定でしたが、まだ作業中のようです。今日はそれを紹介しましょう。

You are the first people to see this!(みなさんはこれを見る最初の人々なのです!)

fig

新しいappCache APIを使ったコードです。まず、オリジンを関連づけてアプリケーションのコントローラになるJavaScriptファイルを登録します。オリジンの*はワイルドカードです。

これでこのドメインへのリクエストはコントローラに送られるようになります。コントローラはカスタムのJavaScriptコードとして記述するものです。

fig

これがシンプルな説明です。もうすこし詳しく紹介しましょう。

これがappCacheのコード。ここになにをキャッシュしたいかを宣言する、マニフェストになるところ。

fig

ただ、このドキュメントはまだプライベートモードになっていて見えません(笑)。

fig

既存のappCacheはハイレベルなAPIになっていて、シンプルだが機能がとても限定されている。一方、新しいappCacheの考え方はローレベルで、もっとパワフル。その代わりコードも多く書かなければなりません。

コントローラが宣言され、ネットワークへのリクエストがそのコントローラへ送られて、そこで扱われないものがネットワークへ出て行くのです。ある意味、内部的なプロキシーのように働きます。

これは早めに実装されると思います。6カ月くらいかな。

このAPIは名称が「controller」か「navigationController」になるでしょう。もう少しで発表されるはずです。

fig

navigationControllerは、レスポンシブイメージでも使われるかもしれません。

fig

レスポンシブイメージは、クライアントサイドで画面の大きさや解像度に応じて表示するイメージを決定するものです。ブラウザはデバイスのことを知っているので、どのイメージを表示するかを決定するのはブラウザがもっとも優れた場所となります。

navigationControllerは、レスポンシブイメージの仕組みにも使えるでしょう。

何にせよ、navigationControllerはまだアイデア段階です。しかしきっと成功するでしょう。私はこの機能が、今年登場するHTML5の新機能でもっとも大事なものだと考えています。

fig

Webアプリケーションをオフラインでも動くようにするのはスマートなアイデアだと多くの人が考え始めています。オフライン対応のアプリも増えてきており、navigationControllerは、それをさらに容易にすることでしょう。

テンプレートはWebアプリケーションを大きく変えるだろう

次はtemplate。WebComponents仕様の一部です。これも長期的にみて大きな新機能。すごくいい。

fig

WebComponentsの考えは、要素を定義して振る舞いをバインドできる、というもの。Webブラウザで要素を、既存の要素のように定義できます。例えば既存のForm要素のように、Inputボタンや日付コントロールのようなものが新しく定義できるのです。

サーバサイドのプログラミングを経験したことがあるなら、テンプレートにも触れたことがあるでしょう。

まずdocument fragmentを宣言します。これはドキュメントがロードされても特に何もせず、しかしあとで使えるようにパースされてDOMに組み込まれます。再利用もできます。

fig

これがテンプレートの例の1つ。プロパティを追加したりと、まるでJavaScriptのカスタムオブジェクトを作るようなものです。そして普通のHTMLページを書くようにテンプレートを書くことができます。

fig

テンプレートはとてもパワフルで、Webアプリの作り方を変えていくでしょう。それはAjaxがWebアプリケーションを変えたときのように大きく変えていくでしょう。

fig

WebComponentsについては、仕様文書ではなく紹介文書があります。これは必読です(リンク)。

fig

あわせて読みたい

HTML/CSS Web技術




タグクラウド

クラウド
AWS / Azure / Google Cloud
クラウドネイティブ / サーバレス
クラウドのシェア / クラウドの障害

コンテナ型仮想化

プログラミング言語
JavaScript / Java / .NET
WebAssembly / Web標準
開発ツール / テスト・品質

アジャイル開発 / スクラム / DevOps

データベース / 機械学習・AI
RDB / NoSQL

ネットワーク / セキュリティ
HTTP / QUIC

OS / Windows / Linux / 仮想化
サーバ / ストレージ / ハードウェア

ITエンジニアの給与・年収 / 働き方

殿堂入り / おもしろ / 編集後記

全てのタグを見る

Blogger in Chief

photo of jniino

Junichi Niino(jniino)
IT系の雑誌編集者、オンラインメディア発行人を経て独立。2009年にPublickeyを開始しました。
詳しいプロフィール

Publickeyの新着情報をチェックしませんか?
Twitterで : @Publickey
Facebookで : Publickeyのページ
RSSリーダーで : Feed

最新記事10本