October 15, 2003

JavaScriptで軽量化を!!

このサイトはMovableTypeというCMS(Contents Management System)を使って運用しているわけですが、CMSを使ったサイト運用に求められるものはなにかっつうのを探求しているわけでして…。
それはすばり高速性でしょ!?あれ、何か違いますね、ホントは互換性とか労力削減とかまともなこと答えなきゃいけないのになぁ(笑)。

ということですこしでも高速化しようとたくらんでいるわけです。で、今回試してみたのが共通のコンテンツ(例えば上に表示されるバナーのでっかいやつとか、右に表示されているリンク集とか)をすべてJavaScriptにして、個々のテンプレ(例えばIndividula Entry Archive)にはそれらをJSで読み込むようにしてしまえば、Rebuildの際にこれらがテンプレにべた書きしなくてもレイアウトの統一と高速Rebuildが可能というわけです。
ソースをみてもらえばわかると思いますが、現在上のバナーと右のリンク集はすべてJSで書き出しています。これによって、サイトのRebuildの速度がかなり向上しました。

くわしいやり方は追記を参照でよろしくぅ!!

例えばこんなのをインデックステンプレートページで作って、
テンプレートの名前:Common Banner
出力ファイル名:banner.js

function getBanner(){
    var html = "<div id='banner'>";
    html = html + "<h1><a href='<$MTBlogURL$>' accesskey='1'><$MTBlogName$></a></h1>";
    html = html + "<span class='description'><$MTBlogDescription$></span>";
    html = html + "</div>";
    return html;
}

各アーカイブで読み込ませる。例えばIndividula Entry Archiveで

<script lanaguage="javascript" type="text/javascript" src="banner.js">
<script lanaguage="javascript" type="text/javascript">

</script>

で、もしbanner.jsがEntryを追加するたびにかわるタグを含んでいるようだったら(例えばカレンダーとかを含んでいるようだったら)、『インデックス・テンプレートを再構築するときにこのテンプレートを自動的に再構築する』にチェックをいれとけば、変更があった場合、自動的にjsファイルを作ってくれるようになる。逆に上のbanner.jsのように、静的で一度『再構築』してしまえば代わることはないものだった場合は、チェックをいれなくてもよい(もちろん自分でbanner.jsを直接作り変えた場合は再構築が必要ですが)。

てなわけで、わかんなかったら聞いてくださいm(_ _)m

02:07 fenrir が投稿 : 固定リンク |