古町宝くじ売り場k8 カジノあなたの知らない超絶便利なWeb開発を叶える仕様Web Componentsとは仮想通貨カジノパチンコパチンコ動向

スティーブンキングマイル 81k8 カジノ Web Componentsとは

3のつく日スロットイベント神奈川　本稿では、Google I/O 2013の中から、「Web Components」に関するセッションをレポートする。

　「Web Components」は、簡単にいうと、Web（HTML）をコンポーネント化するための仕組みで、再利用性やメンテナンス性、開発効率を上げるのに大きな効果があるといわれている。

　今年のGoogle I/Oでは、次の2つのセッションでWeb Componentsについて解説があった。

Web Components: A Tectonic Shift for Web Development（Google Chromeチーム開発者Eric Bidelman氏）資料：http://www.WebComponentsshift.com/Web Components in Action（Google Chrome Open Web Platformチームテクニカルリードマネージャー Matthew McNulty氏、プロダクトマネージャー Alex Komoroske氏）

　「Web Components: A Tectonic Shift for Web Development」では、Webプラットフォームの将来のためのWeb Componentsの基本的な概念について説明があった。しかし、現在のところ、Web Componentsの多くは、Google ChromeとAndroidブラウザにしか対応していない。

　そこで「Web Components in Action」では、主要WebブラウザでWeb Componentsの利用を実現する「Polymer」について語られた。

　Web Componentsにも触れたGoogle I/O 2013の基調講演については、記事「Android、Chrome、Google+、Mapsは偉大なモノになれるのか～Google I/O 2013基調講演参加レポート」を参照のこと。

Web Componentsを構成する4つの要素とは

　Eric Bidelman氏はWeb Componentsを構成する4つの要素について説明した。

Web Componentsを構成する4つの要素【1】HTML Templates（テンプレート）

　<template>タグを使用すると、マークアップの塊をテンプレートにすることができ、単に「DOM」（Document Object Model）に入れればいいだけになる。WebブラウザはDOMを解析するので、テンプレートとともに動作するのは容易だ。

　HTML Templatesの最も良いところは、それがパースされてもレンダリングはされないことだ。テンプレート内に<script>タグがあると、それを使うまで実行されず、スタイルシートや画像もロードしないので、リソースの観点からも利点がある。また、<form>ドキュメントから隠れていてDOMをトラバースできない。

　使い方としては、<template>要素自体のcontentプロパティとする方法とinnerHTMLプロパティとする方法の2通りの方法がある。

　以下は「RUN」ボタンをクリックすると値をインクリメントするinnerHTMLのデモである。

http://www.webcomponentsshift.com/#15【2】Shadow DOM

　Shadow DOMは、マークアップのカプセル化ができる機能で、見えるDOMノードと見えないDOMツリーの間に通常のDOM操作ではアクセスできない境界を与えることで、ブラウザベンダが内部UIを実装するのに使ってきたのと同じ機構をWeb開発者に見えるようにしている。

　Shadow DOMの特徴としては、DOMノードは隠れたDOMをホストすることができ、隠れたDOMは外部のJavaScriptからアクセスできない点がある。以下が良い例だ。

　Chromeの開発者ツールで［Show Shadow DOM］をチェックし、［Elements］ビューを見ると「<input type=”date”>」に付いているShadow DOMがあり、ブラウザでどのように実装されているかを見ることができる。

　Bidelman氏が作成したというShadoew DOMの視覚化ツール「Shadoew DOM Visualizer」が紹介された。

Shadoew DOM Visualizer