John ResigのProcessing.jsを使用するのは妥当ですか？

StackOverflow https://stackoverflow.com/questions/170937

  •  05-07-2019
  •  | 
  •  

質問

JavaScript /キャンバスの使用がかなり激しいウェブサイトを作成することを考えており、処理を検討しています。 .js を使用すると、キャンバスの操作が大幅に簡単になるようです。 Processing.jsを使用しない理由を誰かが知っていますか？古いブラウザでは使用できないことを理解していますが、今のところは大丈夫です。

役に立ちましたか？

解決

前述のように、IEはProcessing.js（IE8ベータ版を含む）ではサポートされていません。また、キャンバスを使用する場合と比較して、処理の観点からprocessing.jsが少し遅いことがわかりました（特に、javascript APIを使用する代わりに、Processing言語で文字列を解析する場合）。

個人的には、処理ラッパーよりもキャンバスAPIの方が好きです。例：

処理line（）関数は次のように実装されます（大まかに）：

function line (x1, y1, x2, y2) {
  context.beginPath();
  context.moveTo(x1, y1);
  context.lineTo(x2, y2);
  context.closePath();
  context.stroke();
};

そして、次のように使用します（javascript-exposed APIを使用している場合）：

var p = Processing("canvas")
p.stroke(255)

////Draw lines...///
p.line(0,0,10,10)
p.line(10,10,20,10)
//...and so on
p.line(100,100,200,200)
////End lines////

すべてのline（）呼び出しで新しいパスを開いたり閉じたりする必要があることに注意してください。キャンバスAPIを使用すると、すべての行を単一のbeginPath / endPathブロック内に描画でき、パフォーマンスが大幅に向上します。

context.strokeStyle = "#fff";
context.beginPath();

////Draw lines...///
context.moveTo(0, 0);
context.lineTo(10, 10);
context.lineTo(20, 10);
//...so on
context.lineTo(200, 200);
////End lines...///

context.closePath();
context.stroke();

他のヒント

IE7で動作していなくても問題ない場合は、そのままにしてください。 Firefox 3で動作させました。これは、Silverlight / Flash効果をあなたのページにもたらすための滑らかな方法です。

Processing.jsのようなライブラリは高速トラックパスで変更またはアップグレードされるので、それらが実行されたときに実行する準備をして、新しい機能についていくことができます。

キャンバス上での描画を簡素化しません。キャンバスを使用している場合、アニメーションのタスクが簡素化されます。アニメーションを実行していて、ブラウザの完全なサポートを気にしない場合は、Processing.jsを使用します。アニメーションを実行していない場合（たとえば、チャートや角を丸めている場合）、Processing.jsのオーバーヘッドを追加しないでください。

どちらの方法でも、キャンバスAPIを直接使用する方法を学ぶことをお勧めします。キャンバスAPI、特に変換を理解すると、Processing.jsを使用している場合でも非常に役立ちます。

代わりにFlashを使用してください。 processing.jsで動作するブラウザの数よりも多くのブラウザにFlashがインストールされています。さらに、JavaScriptを使用するよりもFlashの方がはるかに優れたパフォーマンスを得ることができます（少なくとも現時点では、JSを大幅に高速化するプロジェクトが進行中ですが、まだ少し道のりはありません）

新しいJavaScript実装p5jsを試してください p5js.org

ああ、レオの答えに応じて、実際に処理やp5jsで line 関数を使用する必要はありません。 beingShape と beingPathがあります。 関数は、キャンバスAPIに似ています。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top