• Home
  • Movable Type
  • MTAppjQuery
  • MTAppjQuery の mt:Foreach タグを使う場合と MT 標準のタグでやる場合を比較してみた

MTAppjQuery の mt:Foreach タグを使う場合と MT 標準のタグでやる場合を比較してみた

あまり知られていないかもしれませんが、MTAppjQuery では mt:Foreach タグというのと mt:NestVar タグというのを提供していて、これらを使うととても効率よくハッシュや配列を扱うことができます。

これを使う場合と使わない場合でどんな感じに使うのか、非常にシンプルな例で比較してみました。ついでに alfasado/mt-plugin-speed-meter プラグインを使って再構築時のパフォーマンス比較も。

共通

<mt:Ignore>==================================================

共通

=================================================</mt:Ignore>
<mt:SetVarBlock name="json">{
  "data": [
    { "id": "01", "name": "テスト01" },
    { "id": "02", "name": "テスト02" },
    { "id": "03", "name": "テスト03" },
    { "id": "04", "name": "テスト04" },
    { "id": "05", "name": "テスト05" },
    { "id": "06", "name": "テスト06" },
    { "id": "07", "name": "テスト07" },
    { "id": "08", "name": "テスト08" },
    { "id": "09", "name": "テスト09" },
    { "id": "10", "name": "テスト10" }
  ]
}</mt:SetVarBlock>
<mt:Var name="json" json_decode="1" setvar="json" />

mt:Foreach タグ無しの場合

<mt:Ignore>==================================================

mt:Foreach タグ無し

=================================================</mt:Ignore>
<mt:Var name="json" key="data" setvar="dataSet" />
<mt:Var name="dataSet" function="count" op="--" setvar="length" />
<h1>mt:Foreach タグ無し</h1>
<ul>
<mt:For var="i" from="0" to="$length">
  <mt:Var name="dataSet" index="$i" setvar="data" />
  <li><mt:Var name="data" key="id" />: <mt:Var name="data" key="name" /></li>
</mt:For>
</ul>

配列なので mt:For タグで処理します。

mt:Foreach タグを使う場合

<mt:Ignore>==================================================

mt:Foreach

=================================================</mt:Ignore>
<h1>mt:Foreach</h1>
<ul>
<mt:Foreach name="json.data" as="data">
  <li><mt:NestVar name="data.id" />: <mt:NestVar name="data.name" /></li>
</mt:Foreach>
</ul>

けっこうスッキリしますし、分かりやすいですよね。シンプルな例だからちょっと便利さが分からないかもしれませんが、もしハッシュの入れ子が深くなったら、かなり効果を発揮します。

元の JSON の要素数を500にしてパフォーマンスを比較

  • 'mt:Foreach タグ無し'をビルドしました。処理時間: 0.077099084854126
  • 'mt:Foreach タグあり'をビルドしました。処理時間: 0.0434930324554443

mt:Foreach を使った方が、使わない場合の半分ちょっとの時間で再構築が終わりました。

実は管理画面のカスタマイズだけではない MTAppjQuery なのです!

MTAppjQuery について

Movable Type の管理画面をフロントエンドの知識だけで簡単にカスタマイズすることができます。

クライアントの満足度を高めるためにぜひお使いください。

MTAppjQuery の詳細を見る

MTAppjQuery