1. JS/CSSのコードを少なくする

セレクタやメソッドで編集内容が重複している場合、最下部のコードが適用されます。
適用されていないコードを削除することでデザイン案の軽量化をし、チラつきを軽減出来ることがあります。

2. スタイル編集はJSタブではなく、CSSタブで行う

エディター内で記述したコードはCCSタブの方が先に反映されます。
そのため、スタイルの編集は極力CSSタブで行うことで、チラつきが軽減できます。

3. 使用している画像のファイル容量を小さくする

画像のファイルサイズが大きいと、チラつきが目立ちやすくなります。
ファイルサイズや解像度を、実用上問題ない範囲で、リサイズ・アップロードし、差し替えてみてください。
なお、ファイルサイズを小さくする場合には、画像の不具合での差し戻し にお気をつけください。

4. CSSタブで元ページを非表示にしてから、JSタブでデザイン案を再表示する

元ページ表示→Kaizenデザイン案反映、までの時間差が長くなるほどチラつきが目立ちやすくなります。
そこで、最初に表示される元ページを一旦CSSで非表示にすることで、体感的にチラつきを軽減できます。
以下のいずれかの方法をお試しください。

A. display:none を使う方法

1. まず、CSSタブの1行目でbody全体を display:none にします。

body {
    display:none;
}

2. 次に、JavaScriptタブの最終行でbody全体を !important属性 で表示します。

$("body").attr({"style":"display:block!important;"});

このコードで、CSSタブで元ページを全て非表示→JSタブでデザインを全て適用後に再表示、することになります。

B. visibility:hidden を使う方法

元ページの仕様で、高さや幅をJSで取得・制御していることがあります。
そのような場合 display:none を使用すると、表示崩れを起こす原因になります。
そこで代替案として visibility:hidden を使います。

1. まず、CSSタブの1行目でbody全体を visibility:hidden にします。

body {
    visibility:hidden;
}

2. 次に、JavaScriptタブの最終行でbody全体を !important属性 で表示します。

$("body").attr({"style":"visibility:visible!important;"});

このコードで、CSSタブで元ページを全て非表示→JSタブでデザインを全て適用後に再表示、することになります。