まず、助けてくれてありがとう。:)
上記のフィドル リンクでわかるように、「きらめく効果」を作成しようとして 1400 個のオブジェクトをアニメーション化しています。ユーザーがマウスを速く動かすと、より多くの六角形が完全に不透明になり、フェードアウト率が変化します。フィドルのバージョンは、スペースを十分な色で満たしますが、ぎくしゃくしてぎこちなく感じます. fade_time 変数の量を減らすと、滑らかになりますが、完全に不透明な六角形が十分にありません。最終的な目標は、六角形で単語を綴ることです。
Chrome でのパフォーマンスは最高ですが、FireFox と IE ではそれほどではありません。iPad のモバイル サファリで (Raphael の element.touchmove を使用して) テストしたところ、さらに悪化しました。
パフォーマンスを向上させるために、コードのどの部分を別の方法で実行できるかについてのアドバイスを探しています。
他の誰かがパフォーマンスに役立つはずだったこの回答を見ましたが、アニメーション化する六角形の量をカーソルの動きに基づいて設定しようとしていますが、タイマーでそれを実行できるかどうかはわかりません。
キャンバスを使用して言及されたこの回答：
良い代替手段は、Canvas を使用して要素を描画することです。私の実験では、この数の描画では SVG よりも高速ですが、いくつかのアニメーションを使用している場合、RaphaelJS ライブラリよりも実装が難しくなります。
コードがアニメーションを使用していても、それは人々にとってより良いルートのように思えますか?
Raphael.js を使用するのはこれが初めてです。私は一般的にJSの経験があまりないので、どんな助けもwunderbarです!
編集:編集: また、質問者が考えていたよりも .resize が呼び出される回数についてのこの回答を見て、.mousemove 関数が予想よりも多く (必要以上に) 呼び出される可能性があるかどうか疑問に思いました。