機能と仕様

jQueryのセレクタ解釈処理は、テンプレート処理の中でもサーバー負荷の高い処理になります。

解決方法

jQueryオブジェクトの生成回数を削減します。また、負荷の高いセレクタの使用を避けます。

1. <gc-script>での変数利用

同一のjQueryオブジェクトが複数回参照されている場合、変数化します。

例：

【変数化を行う前のコード】

<gc-script>
  var i;
  for (i = 0; i < 10; i++) {
    var $e = $(".mainContainer").eq(i);
          :
  }
</gc-script>

【変数化を行った後のコード】

<gc-script>
  var i;
  var $main = $(".mainContainer");
  for (i = 0; i < 10; i++) {
    var $e = $main.eq(i);
          :
  }
</gc-script>

2. セレクタでの@THISの利用

<gc-each>内で繰り返している要素自身をパーツから参照して使用する場合、パーツのセレクタとしてスコープ指定子@THISが利用できます。

例： 【変数化を行う前のコード】

<gc-each selector=".ranking span" dh="0" dt="0">
 <gc-parts ...>
  <gc-paramList>
    <gc-param name="selector">.ranking span:eq(%GCIDX%)</gc-param>
  </gc-paramList>
 </gc-parts>
</gc-each>

【変数化を行った後のコード】

<gc-each selector=".ranking span" dh="0" dt="0">
 <gc-parts ...>
  <gc-paramList>
    <gc-param name="selector">@THIS</gc-param>
  </gc-paramList>
 </gc-parts>
</gc-each>

3. :has疑似セレクタを使用しない

:has疑似セレクタはサーバー負荷の高い処理になりますので、:hasを使わないか、もしくは<gc-each>の外側で実行するなど、実行回数を制限します。