GitBook: [#256] Docs for Marine JS

This commit is contained in:
Pavel Murygin 2022-04-26 12:38:20 +00:00 committed by gitbook-bot
parent 28712cd4a6
commit 72d271a69e
No known key found for this signature in database
GPG Key ID: 07D2180C7B12D0FF
2 changed files with 84 additions and 5 deletions

View File

@ -527,3 +527,67 @@ sig.securityGuard = or(
allowServiceFn("my_service", "my_function")
);
```
### Using Marine services in Fluence JS
Fluence JS can host Marine services with Marine JS. Currently only pure single-module services are supported.
Before registering the service corresponding WASM file must be loaded. Fluence JS package exports three helper functions for that.
#### loadWasmFromFileSystem 
Loads the WASM file from file system. It accepts the path to the file and returns buffer compatible with `FluencePeer` API.
This function can only be used in nodejs. Trying to call it inside browser will result throw an error.
**loadWasmFromNpmPackage**
Locates WASM file in the specified npm pacakge and loads it. The function accepts two arguments:
* Name of npm package
* Path to WASM file relative to the npm package
This function can only be used in nodejs. Trying to call it inside browser will result throw an error.
#### loadWasmFromServer
Loads WASM file from the service hosting the application. It accepts the file path on server and returns buffer compatible with `FluencePeer` API.
{% hint style="info" %}
The function will try load file into SharedArrayBuffer if the site is cross-origin isolated.
Otherwise the return value fall backs to Buffer which is less performant but is still compatible with `FluencePeer API`.
We strongly recommend to set-up cross-origin headers. For more details see: See [MDN page](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global\_Objects/SharedArrayBuffer#security\_requirements) for more info
{% endhint %}
This function can only be used in browser. Trying to call it inside nodejs will result throw an error.
### Registering services in FluencePeer
After the file has been loaded it can be registered in `FluencePeer`. To do so use `registerMarineService function.`
To remove service use `registerMarineService` function.
You can pick any unique service id. Once the service has been registered it can be referred in aqua code by the specified id
For example:
```typescript
import { Fluence, loadWasmFromFileSystem } from '@fluencelabs/fluence';
async function main()
await Fluence.start({connectTo: relay});
const path = path.join(__dirname, './service.wasm');
const service = await loadWasmFromFileSystem(path);
// to register service
await Fluence.registerMarineService(service, 'my_service_id');
// to remove service
Fluence.removeMarineService('my_service_id');
}
```
See [https://github.com/fluencelabs/marine-js-demo](https://github.com/fluencelabs/marine-js-demo) for a complete demo.

View File

@ -4,23 +4,38 @@ You can use the Fluence JS with any framework (or even without it). The "fluence
## Configuring application to run in browser
To run application in browser you need to configure the server which hosts the application to serve two additional files:
{% hint style="warning" %}
**Breaking change!**\
****\
****Starting from **v0.23.0** Fluence JS uses different file structure:
* `avm.wasm` is the execution file of AquaVM. The file is located in `@fluencelabs/avm` package
* `runnerScript.web.js` is the web worker script responsible for running AVM in background. The file is located in `@fluencelabs/avm-runner-background` package
* **copy-avm-public** script has been replaced with **copy-marine**
* **runnerScript.web.js** has been replaced with **`marine-js.web.js`**
* additional dependency added: **`marine-js.wasm`**
Fluence JS provides a utility script named `copy-avm-public` which locates described above files and copies them into the specified directory. For example if static files are served from the `public` directory you can run `copy-avm-public public` to copy files needed to run Fluence. It is recommended to put their names into `.gitignore` and run the script on every build to prevent possible inconsistencies with file versions. This can be done using npm's `postinstall` script:
Make sure to migrate when switching to **v0.23.0**
{% endhint %}
To run application in browser you need to configure the server which hosts the application to serve Marine JS dependencies. Fluence JS provides a utility script named `copy-marine` which copies all the necessary files into specified folder. For example if static files are served from the `public` directory you can run `copy-marine public` to copy files needed to run Fluence. It is recommended to put their names into `.gitignore` and run the script on every build to prevent possible inconsistencies with file versions. This can be done using npm's `postinstall` script:
```
...
"scripts": {
"postinstall": "copy-avm-public public",
"postinstall": "copy-marine public",
"start": "...",
..
},
...
```
In case you want to distribute the files by hand here is the list of dependencies required to run Fluence:
* `marine-js.wasm` is the Marine JS runtime. The file is located in `@fluencelabs/marine-js` package.
* `marine-js.web.js` is the web worker script responsible for running Marine JS in background. The file is located in `@fluencelabs/marine-js` package.
* `avm.wasm` is the AquaVM execution file. The file is located in `@fluencelabs/avm` package.
## Demo applications
See the browser-example which demonstrate integrating Fluence with React: [github](https://github.com/fluencelabs/examples/tree/main/fluence-js-examples/browser-example)