Polymer： リリース前にやるべきこと。Elementsを1つのファイルにまとめる

Polymer0.5でVulcanize（硬化）する方法

Polymerは複数のElement（Web Components）を組み合わせて、作っていきます。そのため、ブラウザからリクエストが来た時に、複数のHTMLファイルが通信でやりとりされコストが大きいです。

Vulcanizeツールは、複数のElementを1つのファイルにまとめることで、通信のオーバーヘッドを減らそうという試みです。

Vulcanizeツールには、全部（HTML、JS、Element、Element内のJS）まとめるパターンと、
Elementのみまとめ、JSは別ファイルに別途まとめるパターン（Content Security Policy）があります。

Vulcanizeの説明は以下が詳しいです。
　　https://www.polymer-project.org/0.5/articles/concatenating-web-components.html

VulcanizeツールのGitHubはこちら（ここにも使い方が載ってます。）
　　https://github.com/Polymer/vulcanize/tree/polymer-0.5

使い方

Vulcanizeのインストール

---

バージョン指定をしてインストールします。バージョン指定しないと1.0系用のVulcanizeが落ちてきてしまいます。
Windows環境だとうまく落とせなかったので、Fedora19上で以下を実行しました。

sudo npm install -g vulcanize@0.7.11

使い方

---

CSPモード

　　　Extract inline scripts to a separate file

vulcanize -o build.html --verbose --csp --strip index.html

オプション

• --output, -o
• Output file name (defaults to vulcanized.html)
• --verbose, -v
• More verbose logging
• --help, -v, -?
• Print this message
• --config
  • Read a given config file
• --strip, -s
  • Remove comments and empty text nodes
• --csp
• Extract inline scripts to a separate file (uses <output file name>.js)
• --inline
• The opposite of CSP mode, inline all assets (script and css) into the document
• --inline --csp
  • Bundle all javascript (inline and external) into <output file name>.js
• --abspath, -p
  • Specify site root. Resolve paths to absolute paths based on site root
• --no-strip-excludes
  • Keep imports excluded from inlining
• --version, -V
  • print version information

出力結果は

　　build.html　と　build.js　の2つ

---

inlineモード（JSもHTMLもまとめて1ファイルにする）

　　　The opposite of CSP mode, inline all assets (script and css) into the document

こっちは私の環境ではうまくいきませんでした。
vulcanize -o build.html --verbose --inline --strip index.html

出力結果は

　　build.htmlのみ