From 0a82167c308dd342486cef1c4c782253d8aeeb0e Mon Sep 17 00:00:00 2001 From: Nick Gerleman Date: Fri, 23 Dec 2022 23:49:35 -0800 Subject: [PATCH] Refactor entrypoints --- .github/actions/setup-js/action.yml | 2 +- javascript/README.md | 29 ++++++++++++++++++- javascript/jest.setup.js | 8 ++--- javascript/package.json | 17 +++++------ .../_entryAsync.js} | 0 .../_entrySync.js} | 0 .../{variants => entrypoint}/asmjs-async.js | 2 +- .../{variants => entrypoint}/asmjs-sync.js | 2 +- .../{variants => entrypoint}/wasm-async.js | 2 +- .../{variants => entrypoint}/wasm-sync.js | 2 +- javascript/src_js/index.js | 2 +- javascript/src_js/sync.js | 2 +- javascript/tests/run-bench.js | 2 +- 13 files changed, 48 insertions(+), 22 deletions(-) rename javascript/src_js/{entryAsync.js => entrypoint/_entryAsync.js} (100%) rename javascript/src_js/{entrySync.js => entrypoint/_entrySync.js} (100%) rename javascript/src_js/{variants => entrypoint}/asmjs-async.js (83%) rename javascript/src_js/{variants => entrypoint}/asmjs-sync.js (84%) rename javascript/src_js/{variants => entrypoint}/wasm-async.js (83%) rename javascript/src_js/{variants => entrypoint}/wasm-sync.js (84%) diff --git a/.github/actions/setup-js/action.yml b/.github/actions/setup-js/action.yml index 93c4fd3c..17ce83ed 100644 --- a/.github/actions/setup-js/action.yml +++ b/.github/actions/setup-js/action.yml @@ -17,5 +17,5 @@ runs: - name: yarn install shell: bash - run: yarn install --frozen-lockfile --ignore-scripts + run: yarn install --frozen-lockfile working-directory: javascript diff --git a/javascript/README.md b/javascript/README.md index 5f6fad3a..952b1323 100644 --- a/javascript/README.md +++ b/javascript/README.md @@ -1,6 +1,6 @@ # yoga-layout -This package provides JavaScript bindings for the Yoga layout engine as either WebAssembly (for browsers, Node) or asm.js (other clients or clients unable to read package export maps). +This package provides prebuilt JavaScript bindings for the Yoga layout engine. Both WebAssembly and asm.js variants are packaged, with the optimal loaded based on platform. ## Usage @@ -23,3 +23,30 @@ import Yoga, { ALIGN_CENTER } from "yoga-layout/sync"; const node = Yoga.Node.create(); node.setAlignContent(ALIGN_CENTER); ``` + +## Selecting WebAssembly or asm.js + +For better performance and smaller packages, WebAssembly is preferred to asm.js where available. `yoga-layout` tries to provide the right default using [export maps](https://webpack.js.org/guides/package-exports/#conditional-syntax) so that platforms which can take advantage of WebAssembly use it by default. + +A specific entrypoint may be specified on platforms which do not understand export conditions. + +```ts +import { loadYoga } from "yoga-layout/entrypoint/wasm-async"; +``` + + +## Contributing + +`yoga-layout` may be locally built by running the following set of commands. The build requires that some dependencies be installed first. + +```bash +git clone https://github.com/facebook/yoga.git +cd yoga/javascript +yarn install +yarn build +``` + +### Requirements + +1. CMake >= 3.13 +1. (Optional) ninja, for faster builds diff --git a/javascript/jest.setup.js b/javascript/jest.setup.js index e38327c2..7b6b5739 100644 --- a/javascript/jest.setup.js +++ b/javascript/jest.setup.js @@ -9,12 +9,12 @@ module.exports = async () => { if (process.env['SYNC'] == true && process.env['WASM'] == true) { - global.Yoga = require("./dist/variants/wasm-sync"); + global.Yoga = require("./dist/entrypoint/wasm-sync"); } else if (process.env['SYNC'] == true) { - global.Yoga = require("./dist/variants/asmjs-sync"); + global.Yoga = require("./dist/entrypoint/asmjs-sync"); } else if (process.env['WASM'] == true) { - global.Yoga = await require("./dist/variants/wasm-async").loadYoga(); + global.Yoga = await require("./dist/entrypoint/wasm-async").loadYoga(); } else { - global.Yoga = await require("./dist/variants/asmjs-async").loadYoga(); + global.Yoga = await require("./dist/entrypoint/asmjs-async").loadYoga(); } } diff --git a/javascript/package.json b/javascript/package.json index 28bf1849..3fb85e6d 100644 --- a/javascript/package.json +++ b/javascript/package.json @@ -1,7 +1,7 @@ { "name": "yoga-layout", - "version": "1.9.3", - "description": "Yoga is a cross-platform layout engine enabling maximum collaboration within your team by implementing an API many designers are familiar with, and opening it up to developers across different platforms.", + "version": "2.0.0-beta.1", + "description": "JavaScript bindings for the Yoga layout engine", "license": "MIT", "repository": { "type": "git", @@ -11,14 +11,14 @@ "types": "./dist/index.d.ts", "exports": { ".": { - "browser": "./dist/variants/wasm-async.js", - "node": "./dist/variants/wasm-async.js", - "default": "./dist/variants/asmjs-async.js" + "browser": "./dist/entrypoint/wasm-async.js", + "node": "./dist/entrypoint/wasm-async.js", + "default": "./dist/entrypoint/asmjs-async.js" }, "./sync": { - "browser": "./dist/variants/asmjs-sync.js", - "node": "./dist/variants/wasm-sync.js", - "default": "./dist/variants/asmjs-sync.js" + "browser": "./dist/entrypoint/asmjs-sync.js", + "node": "./dist/entrypoint/wasm-sync.js", + "default": "./dist/entrypoint/asmjs-sync.js" } }, "files": [ @@ -32,7 +32,6 @@ "build:copy-dts": "cd src_js && find . -name '*.d.ts' | cpio -pdm ../dist", "build:js": "babel src_js --source-maps --out-dir dist && yarn build:copy-dts", "build:native": "yarn build:configure && cmake --build build", - "postinstall": "yarn build", "test": "yarn test:asmjs && yarn test:asmjs-sync && yarn test:wasm && yarn test:wasm-sync", "test:asmjs": "WASM=0 SYNC=0 jest", "test:asmjs-sync": "WASM=0 SYNC=1 jest", diff --git a/javascript/src_js/entryAsync.js b/javascript/src_js/entrypoint/_entryAsync.js similarity index 100% rename from javascript/src_js/entryAsync.js rename to javascript/src_js/entrypoint/_entryAsync.js diff --git a/javascript/src_js/entrySync.js b/javascript/src_js/entrypoint/_entrySync.js similarity index 100% rename from javascript/src_js/entrySync.js rename to javascript/src_js/entrypoint/_entrySync.js diff --git a/javascript/src_js/variants/asmjs-async.js b/javascript/src_js/entrypoint/asmjs-async.js similarity index 83% rename from javascript/src_js/variants/asmjs-async.js rename to javascript/src_js/entrypoint/asmjs-async.js index 02d4097c..11c686cc 100644 --- a/javascript/src_js/variants/asmjs-async.js +++ b/javascript/src_js/entrypoint/asmjs-async.js @@ -8,4 +8,4 @@ */ const asm = require('../build/asmjs-async'); -module.exports = require("../entryAsync")(asm); +module.exports = require("./entryAsync")(asm); diff --git a/javascript/src_js/variants/asmjs-sync.js b/javascript/src_js/entrypoint/asmjs-sync.js similarity index 84% rename from javascript/src_js/variants/asmjs-sync.js rename to javascript/src_js/entrypoint/asmjs-sync.js index 6bcf004f..c165bad9 100644 --- a/javascript/src_js/variants/asmjs-sync.js +++ b/javascript/src_js/entrypoint/asmjs-sync.js @@ -8,4 +8,4 @@ */ const asm = require('../build/asmjs-sync'); -module.exports = require("../entrySync")(asm); +module.exports = require("./entrySync")(asm); diff --git a/javascript/src_js/variants/wasm-async.js b/javascript/src_js/entrypoint/wasm-async.js similarity index 83% rename from javascript/src_js/variants/wasm-async.js rename to javascript/src_js/entrypoint/wasm-async.js index 02906e31..c3a821ea 100644 --- a/javascript/src_js/variants/wasm-async.js +++ b/javascript/src_js/entrypoint/wasm-async.js @@ -8,4 +8,4 @@ */ const asm = require('../build/wasm-async'); -module.exports = require("../entryAsync")(asm); +module.exports = require("./entryAsync")(asm); diff --git a/javascript/src_js/variants/wasm-sync.js b/javascript/src_js/entrypoint/wasm-sync.js similarity index 84% rename from javascript/src_js/variants/wasm-sync.js rename to javascript/src_js/entrypoint/wasm-sync.js index f74af006..1c46a942 100644 --- a/javascript/src_js/variants/wasm-sync.js +++ b/javascript/src_js/entrypoint/wasm-sync.js @@ -8,4 +8,4 @@ */ const asm = require('../build/wasm-sync'); -module.exports = require("../entrySync")(asm); +module.exports = require("./entrySync")(asm); diff --git a/javascript/src_js/index.js b/javascript/src_js/index.js index 2864db0c..06a348c4 100644 --- a/javascript/src_js/index.js +++ b/javascript/src_js/index.js @@ -8,4 +8,4 @@ */ // Fallback for when the export map is not followed -module.exports = require('./variants/asmjs-async'); +module.exports = require('./entrypoint/asmjs-async'); diff --git a/javascript/src_js/sync.js b/javascript/src_js/sync.js index 5a79514e..6ac610ef 100644 --- a/javascript/src_js/sync.js +++ b/javascript/src_js/sync.js @@ -8,4 +8,4 @@ */ // Fallback for when the export map is not followed -module.exports = require('./variants/asmjs-sync'); +module.exports = require('./entrypoint/asmjs-sync'); diff --git a/javascript/tests/run-bench.js b/javascript/tests/run-bench.js index 02ca7dae..467724a2 100644 --- a/javascript/tests/run-bench.js +++ b/javascript/tests/run-bench.js @@ -27,7 +27,7 @@ for (let type of ['asmjs', 'wasm']) { vm.runInNewContext( file, Object.assign(Object.create(global), { - Yoga: require(type === 'asmjs' ? '../dist/variants/asmjs-sync' : '../dist/variants/wasm-sync'), + Yoga: require(type === 'asmjs' ? '../dist/entrypoint/asmjs-sync' : '../dist/entrypoint/wasm-sync'), YGBENCHMARK: function(name, fn) { let testEntry = testResults.get(name);