ITエンジニア/デザイナ向けにオープンソースを毎日紹介

fragment.jsは外部HTMLの読み込みに対応したJavaScriptテンプレートエンジンです。

Webアプリケーションが広まるのにつれて必要になっているのがテンプレートエンジンです。HTML内にテンプレートとして記述するケースが多いですが、今回は外部ファイルとしてHTMLを定義できるfragment.jsを紹介します。


サンプルです。外部のHTMLファイルを読み込んで表示しています。


HTMLファイルの内容はこのようになっています。


JSONPを読み込んでそのままレンダリングに使うこともできます。

fragment.jsでは同じドメイン内に保存したHTMLファイルを読み込んで表示したり、JSONと合わせて内容を変えて描画します。JSONPと組み合わせて外部コンテンツを表示させるのにも使えます。

fragment.jsはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。


MOONGIFTはこう見る

JavaScriptによるコンテンツレンダリングとサーバサイドでのデータ取得によるレンダリングとを分ける決め手になるのは、Webクローラーにクローリングして欲しいか否かになります。例えばGoogle、Facebookのクローラーなどです。

JavaScriptによるレンダリングではSEO的には殆ど意味がないと考える方が良いでしょう。またユニークなURLを持たない場合、Facebookのいいね数も意図した集計にならない可能性もあります。ログイン必須でそうした数値を気にする必要がなければ、JavaScriptを積極的に使っていくべきです。

fragment.js

DanielRapp/fragment.js · GitHub

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2