Table of Contents
a wasm core for p5.js library written in C++ using emscripten for better speed in calculations.
- Node.js Please download and install the latest version of Node.js from this link
- Emscripten
for more information please refer to this link
# Get the emsdk repo git clone https://github.com/emscripten-core/emsdk.git # Enter that directory cd emsdk # Fetch the latest version of the emsdk (not needed the first time you clone) git pull # Download and install the latest SDK tools. ./emsdk install latest # Make the "latest" SDK "active" for the current user. (writes .emscripten file) ./emsdk activate latest # Activate PATH and other environment variables in the current terminal source ./emsdk_env.sh
- Clone the repo
git clone https://github.com/ars2062/p5-wasm.git
- Install NPM packages
npm install
- make a
.envfile containingMODE=development
for using this package please add the script tag after where you added your p5.js script tag and before your script.js file like so:
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/p5@1.4.1/lib/p5.js"></script>
<script src="https://cdn.jsdelivr.net/npm/p5-wasm-core@0.0.4/dist/p5.wasm.js"></script>
<script src="sketch.js"></script>
</head>
<body>
<main>
</main>
</body>
</html>and inside your sketch file you need to wait for wasm file to load like so:
// Global mode
// This is to stop global mode from starting automatically
p5.instance = true;
// Write your p5 sketch as usual
function setup(){
//...
}
function draw(){
//...
}
// Wait for promise to resolve then start p5 sketch
window.wasmReady.then(() => {
new p5();
});// Instance mode
// Write your p5 sketch as usual
const sketch = function(p){
p.setup = function(){
//...
};
p.draw = function(){
//...
}
};
// Wait for promise to resolve then start p5 sketch
window.wasmReady.then(() => {
new p5(sketch);
});- Fork the Project
- Create your Feature Branch (
git checkout -b feature/AmazingFeature) - Commit your Changes (
git commit -m 'Add some AmazingFeature') - Push to the Branch (
git push origin feature/AmazingFeature) - Open a Pull Request
Distributed under the MIT License. See LICENSE for more information.
Arshia Moghaddam - linkedin - ars2062@gmail.com
Project Link: https://github.com/ars2062/p5-wasm