Есть ли смысл использовать Processing.js Джона Резига?

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

  •  05-07-2019
  •  | 
  •  

Вопрос

Я думаю о создании веб-сайта с довольно интенсивным использованием JavaScript / canvas и смотрю на обработку. .js и мне кажется, что это значительно облегчит манипулирование холстом. Кто-нибудь знает причины, по которым я не должен использовать Processing.js? Я понимаю, что старые браузеры не смогут его использовать, но пока это нормально.

Это было полезно?

Решение

Как уже упоминалось, IE не поддерживается Processing.js (включая бета-версию IE8). Я также обнаружил, что processing.js немного медленен с точки зрения производительности по сравнению с использованием только canvas (особенно если вы анализируете строку с помощью языка обработки вместо использования javascript API).

Лично я предпочитаю API Canvas над оболочкой обработки, потому что он дает мне больше контроля. Например:

Функция обработки строки () реализована примерно так:

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

И вы бы использовали его так (при условии, что вы используете API, предоставляемый javascript):

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 Canvas вы можете рисовать все линии в одном блоке 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, изменятся или будут обновлены по ускоренному пути, поэтому будьте готовы к запуску, когда они это сделают, и не отставайте от новых функций.

Это не упрощает рисование на холсте. Что он делает, так это упрощает задачу анимации, если вы используете canvas. Если вы делаете анимацию и вам не нужна полная поддержка браузера, используйте Processing.js. Если вы не делаете анимацию (например, если вы делаете графики или скругленные углы), не добавляйте накладные расходы на Processing.js.

В любом случае, я рекомендую вам научиться напрямую использовать API Canvas. Понимание API-интерфейса canvas, особенно преобразований, поможет вам, даже если вы используете Processing.js.

Я бы сказал, что вместо этого используйте Flash. Больше браузеров с установленной Flash, чем количество браузеров, которые работают с processing.js. Кроме того, вы получите гораздо лучшую производительность от Flash по сравнению с использованием JavaScript (по крайней мере, на данный момент, хотя в разработке есть проекты, позволяющие значительно ускорить работу с JS, но это еще далеко)

Попробуйте новую реализацию javascript p5js p5js.org

Да, и в ответ на ответ Лео, вам на самом деле не нужно использовать функцию line при обработке или p5js, есть отдельные BeingShape и BeingPath функции похожи на холст API.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top