处理是一种环境/编程语言，旨在使视觉，交互式应用程序非常易于编写。它可以用于从教孩子如何编码到可视化科学数据的所有事物。
这是这样的语言，部分落后于这样的巫术：
>和此：
，当然，您可以在这里找到的所有东西。
>
但是，如果我们之前有processing.js，那是什么p5.js？钥匙要点
p5.js是处理语言的直接JavaScript端口，旨在使艺术家，设计师，教育工作者和初学者可以访问编码，而processing.js是一个转换器，将纯处理代码解释为即时的JavaScript。
>所以，听起来像是在处理自己。但是它是什么
？
？放松，困惑的读者，我们会做到的！首先，在这里观看他们惊人的热情介绍，然后回来。>>单击了吗？现在得到吗？不？好的。让我们分解。
processing.js和p5.js 之间的差异 tl; dr：p5是处理语言的直接JS端口。 processing.js是一个转换器，将纯处理代码解释为即时的JS。后者要求您学习处理，但不学习JS，反之亦然。
>实时编译与语言翻译：processing.js是一个库，它采用原始处理代码（类似于Java，带有类型和所有类型），并将其转换为JavaScript。实际上，您在processing.js网站上在浏览器中看到的示例实际上是纯处理代码现场直播为JS。例如，这种转换类似于使用DART2JS在没有内置DART VM的浏览器中运行DART代码时获得的收益。另一方面，P5是处理为JS代码的完整转换 - 所有功能最终都将被翻译，并且您将在JavaScript中写作。
在processing.js中，您需要使用带有数据源的帆布区域，该数据源导致PDE文件（带有处理源代码的文件）。也有其他方法，但简而言之，仅此而已。在P5中，您直接编写JS代码，并且它像您在网站上包含的任何其他JS文件一样被执行。
扩展：另一个区别是可以使用插件库扩展P5。例如，p5.dom.js库添加添加了使用P5创建和操纵HTML元素的选项，将滑块，按钮，表单元素添加到您的草图中，就像我们在链接到In的Hello视频中所做的那样上一节。
请注意，在两者中，只有P5正式得到处理基金会的正式支持，甚至还有用于处理用户的过渡手册。
>>让我们看看演示比较，以获得完整的要点。我制作了一个github存储库，其中包含每种方法中编写的相同演示的存储库。
><span>git clone https://github.com/Swader/processing</span>
请注意，processing.js使用AJAX请求（通过XHR）加载PDE文件，因此，如果您尝试通过运行index.html将其在浏览器中打开，则将获得交叉原始错误。为了使其正常运行，您可能应该设置一个虚拟服务器以访问样品。最好是通过在一个流浪盒中改进宅基地的实例 - 您将在五分钟内启动并运行。
>
p5.js>
<span>function setup() {
</span><span> createCanvas(640, 480);
</span><span>}
</span><span>
</span><span>function draw() {
</span><span> if (mouseIsPressed) {
</span><span> fill(0);
</span><span> } else {
</span><span> fill(255);
</span><span> }
</span><span> ellipse(mouseX, mouseY, 80, 80);
</span><span>}</span>>
<span><head> </span><span> <script language="javascript" src="../p5.js"></script> </span><span> <!-- uncomment lines below to include extra p5 libraries --> </span><span> <!--<script language="javascript" src="../addons/p5.dom.js"></script>--> </span><span> <!--<script language="javascript" src="../addons/p5.sound.js"></script>--> </span><span> <script language="javascript" src="sketch.js"></script> </span><span></head> </span><span> </span><span><body> </span><span></body></span>
然后，我们有我们的index.html文件： 。另一方面，P5如果没有更改画布正在待处理（您的光标不在图纸区域之外），则会停止渲染，因此在不绘制时减轻负载。
演示2
> p5
使用P5而不是处理的优点。
由加工基金会正式支持 HTML DOM操纵 - 将常见的HTML元素添加到您的P5草图和更多 > > > processing.js和p5.js之间的选择在很大程度上取决于您的特定需求和偏好。如果您有要在网络上运行的现有处理代码，或者您喜欢更传统的类似Java的语法，则Processing.js可能是更好的选择。另一方面，如果您从头开始一个新项目，或者您喜欢更简单，更像JavaScript的语法以及更现代，更现代的，对处理媒体和互动性的方法，那么P5.js可能是更好的选择。 processing.js和p5.js之间是否有任何性能差异动画顺利。但是，任何JavaScript库的性能都可以受到多种因素的影响，包括代码的复杂性，运行代码的设备的功能以及Web浏览器中JavaScript引擎的效率。因此，在各种设备和浏览器上测试您的代码总是一个好主意，以确保最佳性能。 ><span>git clone https://github.com/Swader/processing</span>
分析
乍一看，没有明显的差异。两个样本以大致相同的速度运行，表现良好，并且具有相似的语法。但是，如果您使用的是Google Chrome，然后转到Chrome：//标志，然后激活帧速率计数器（请参见下图），您会注意到processing.js canvas中的绘图保持稳定的帧速率大约58至60，而绘画时P5的低至50，闲置时返回60。另一个有趣的事实是，即使您的光标在帆布区域外，处理始终都使用硬件加速度
>
> processing.js >
<span>function setup() {
</span><span> createCanvas(640, 480);
</span><span>}
</span><span>
</span><span>function draw() {
</span><span> if (mouseIsPressed) {
</span><span> fill(0);
</span><span> } else {
</span><span> fill(255);
</span><span> }
</span><span> ellipse(mouseX, mouseY, 80, 80);
</span><span>}</span>
分析<span><head>
</span><span> <script language="javascript" src="../p5.js"></script>
</span><span> <!-- uncomment lines below to include extra p5 libraries -->
</span><span> <!--<script language="javascript" src="../addons/p5.dom.js"></script>-->
</span><span> <!--<script language="javascript" src="../addons/p5.sound.js"></script>-->
</span><span> <script language="javascript" src="sketch.js"></script>
</span><span></head>
</span><span>
</span><span><body>
</span><span></body></span>
结论
P5JS是一个年轻而雄心勃勃的项目，旨在以比处理更容易接近处理的方式将视觉编程带入大众。虽然目前正在被迫在某种程度上被愚弄，但该团队努力工作将其余的处理语言移植到此JS对应物中。>编写您可能已经熟悉
的JS代码
不绘制
>我们将密切关注这个图书馆并定期进行游戏。你会？让我们知道，如果您提出一些有趣的例子，我们很想写关于它们的！经常询问的问题（常见问题解答）
> processing.js和p5.js？procesing.js和p5.js之间的主要区别是什么JavaScript库，用于创建网络上的可视化，动画和交互式内容。但是，它们有一些关键差异。 processing.js是用Java编写的原始处理语言的端口，用于JavaScript。它旨在与现有的处理代码兼容，这意味着它可以运行未修改的处理草图。另一方面，P5.JS是对处理原理的新解释，从头开始为网络设计。它具有更简单，更类似JavaScript的语法，并且具有更现代的，更现代的网络友好方法来处理媒体和互动性。
我可以在同一项目中使用processing.js和p5.js吗？在技术上可以同时使用processing.js和p5.js ，但通常不建议使用。这是因为两个库具有不同的语法和方法来处理媒体和互动性，这可能导致混乱和兼容性问题。相反，通常最好选择一个库并在项目期间坚持下去。 processing.js是其与现有处理代码的兼容性。如果您有要在网络上运行的处理草图，则可以使用processing.js进行最小修改。此外，processing.js具有更传统的类似Java的语法，某些程序员可能更熟悉。>
>使用p5.js？与processing.js相比，有几个优点。首先，它具有更简单，更直观的语法，它更接近标准的JavaScript，使学习和使用更容易。其次，它具有更现代的，更现代的网络友好方法来处理媒体和交互性，并具有鼠标和键盘输入，图像和声音加载以及画布绘图之类的内置功能。最后，P5.JS拥有一个非常活跃的社区和大量的学习资源，使其成为初学者和经验丰富的程序员的绝佳选择。我可以将processing.js或p5.js用于商业项目吗？但是，最好检查您在商业项目中使用的任何库或工具的特定许可条款，以确保您处于合规性。我项目的JS？
processing.js和p5.js？
我可以将processing.js或p5.js与其他JavaScript库或框架一起使用？
是的，processing.js和p5.js均可与其他JavaScript库或框架一起使用。但是，重要的是要了解潜在的兼容性问题并彻底测试您的代码，以确保一切正常。 > processing.js和p5.js都有大量可用的学习资源。对于processing.js，您可以从具有教程，示例和参考指南的官方处理网站开始。对于P5.js，您可以从官方P5.JS网站开始，该网站上有教程，示例，参考指南和友好的论坛。此外，有许多在线教程，视频和课程可用于两个图书馆。
以上是processing.js vs p5.js-有什么区别？的详细内容。更多信息请关注PHP中文网其他相关文章！
