DaddyFrosty/yoga
1
0
Fork 0
Code Issues 96 Pull Requests 31 Actions Packages Projects Releases 33 Wiki Activity

Revive JavaScript Bindings (#1177)

Browse Source 
Summary:
Yoga's JavaScript bindings do not work past Node 10, or on recent versions of Ubuntu even using it. This is due to a reliance on `nbind`, a library which is no longer maintained. `nbind` itself abstracts over `embind` running Emscripten to generate an asm.js build, along with building Node native modules. In the meantime, [yoga-layout-prebuilt](https://www.npmjs.com/package/yoga-layout-prebuilt) has been used by the community instead of the official package.

https://github.com/facebook/yoga/pull/1177 was contributed as a conversion of bindings created using `nbind` to instead use `embind` directly.

I continued building on this to add more:
1. WebAssembly support (required to be async in browsers)
2. CMake + Ninja Build for the 4 flavors
3. TypeScript typings (partially generated)
4. yarn scripts to build (working on macOS, Ubuntu, Windows)
5. A README with some usage and contribution instructions
6. Updated tests to work with Jest, and updated general infra
7. ESLint and clang-format scripts
8. More GitHub actions (and now testing Windows)
9. Probably more I kinda got carried away here lol

The plan is to eventually publish this to NPM, but there is a little bit of work after this before that happens.

Pull Request resolved: https://github.com/facebook/yoga/pull/1177

Test Plan: The bindings pass Jest tests (both manual and generated). GitHub actions added for the different yarn scripts. Did some manual checks on using the library as TS.

Reviewed By: christophpurrer

Differential Revision: D42207782

Pulled By: NickGerleman

fbshipit-source-id: 1dc5ce440f1c2b9705a005bbdcc86f952785d94e
This commit is contained in:
Dmitry Ivakhnenko
2022-12-28 01:27:12 -08:00
committed by Facebook GitHub Bot
parent 8035456330
commit 1813748eaa
110 changed files with 24702 additions and 22470 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
javascript/tests/run-bench.js
View File

@@ -1,3 +1,4 @@
#!/usr/bin/env node
/**
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
@@ -9,25 +10,27 @@
require(`./tools`);
let fs = require(`fs`);
let vm = require(`vm`);
const fs = require(`fs`);
const vm = require(`vm`);
let WARMUP_ITERATIONS = 3;
let BENCHMARK_ITERATIONS = 10;
const WARMUP_ITERATIONS = 3;
const BENCHMARK_ITERATIONS = 10;
let testFiles = process.argv.slice(2).map(file => {
const testFiles = process.argv.slice(2).map((file) => {
return fs.readFileSync(file).toString();
});
let testResults = new Map();
const testResults = new Map();
for (let type of [`node`, `browser`]) {
for (let file of testFiles) {
for (const type of ["asmjs", "wasm"]) {
for (const file of testFiles) {
vm.runInNewContext(
file,
Object.assign(Object.create(global), {
Yoga: require(`../dist/entry-${type}`),
YGBENCHMARK: function(name, fn) {
Yoga: require(type === "asmjs"
? "../dist/entrypoint/asmjs-sync"
: "../dist/entrypoint/wasm-sync"),
YGBENCHMARK: function (name, fn) {
let testEntry = testResults.get(name);
if (testEntry === undefined)
@@ -35,33 +38,33 @@ for (let type of [`node`, `browser`]) {
for (let t = 0; t < WARMUP_ITERATIONS; ++t) fn();
let start = Date.now();
const start = Date.now();
for (let t = 0; t < BENCHMARK_ITERATIONS; ++t) fn();
let end = Date.now();
const end = Date.now();
testEntry.set(type, (end - start) / BENCHMARK_ITERATIONS);
},
}),
})
);
}
}
console.log(
`Note: those tests are independants; there is no time relation to be expected between them`,
`Note: those tests are independants; there is no time relation to be expected between them`
);
for (let [name, results] of testResults) {
for (const [name, results] of testResults) {
console.log();
let min = Math.min(Infinity, ...results.values());
const min = Math.min(Infinity, ...results.values());
console.log(name);
for (let [type, result] of results) {
for (const [type, result] of results) {
console.log(
` - ${type}: ${result}ms (${Math.round((result / min) * 10000) / 100}%)`,
` - ${type}: ${result}ms (${Math.round((result / min) * 10000) / 100}%)`
);
}
}