處理是一種環境/編程語言，旨在使視覺，交互式應用程序非常易於編寫。它可以用於從教孩子如何編碼到可視化科學數據的所有事物。
這是這樣的語言，部分落後於這樣的巫術：
>和此：
，當然，您可以在這裡找到的所有東西。
>
但是，如果我們之前有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中文網其他相關文章！
