Manage native build toolchain (#1506)

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

In order to build the website, you must build a Yoga binary. This usually requires installing native toolchains.

We have warning messages for these right now, but an even better solution is to just manage the dependencies ourselves. This does that, bringing in specific CMake and Ninja binaries from NPM, and caching a local copy of Emscripten during the build.

A downside is that the CMake packages are chunky, so we add 130MB to node_modules (for a repo total around 350MB). This also delays acquiring Emscripten (which is even chunkier) in CI builds until it is needed, and I added some caching for it as well.

The upside of JS users being able to run and test (inc the website) without installing and managing their own versions of toolchains is a real time-saver though, and is probably worth it.

Differential Revision: D52013026

fbshipit-source-id: 9b974bea1f13d46a5949ff7c84cccab04e199340

.github/actions/cache-emsdk/action.yml

@@ -0,0 +1,10 @@
+name: Cache the installed copy of emsdk and its build artifacts
+
+runs:
+  using: "composite"
+  steps:
+    - name: Cache emsdk
+      uses: actions/cache@v3
+      with:
+        path: javascript/.emsdk
+        key: emsdk-${{ runner.os }}-${{ runner.arch }}-${{ hashFiles('yarn.lock', 'javascript/package.json', 'javascript/just.config.cjs'}}

.github/actions/install-emsdk/action.yml

@@ -1,23 +0,0 @@
-name: Install emsdk (including emcc)
-inputs:
-  version:
-    description: EMCC Version to install
-    required: false
-    default: 3.1.28
-
-runs:
-  using: "composite"
-  steps:
-    - name: Clone emsdk repo
-      working-directory: ${{ runner.temp }}
-      shell: bash
-      run: git clone https://github.com/emscripten-core/emsdk.git
-
-    - name: emdsk install
-      working-directory: ${{ runner.temp }}/emsdk
-      shell: bash
-      run: |
-        ./emsdk install ${{ inputs.version }}
-        ./emsdk activate ${{ inputs.version }}
-        echo $RUNNER_TEMP/emsdk >> $GITHUB_PATH
-        echo $RUNNER_TEMP/emsdk/upstream/emscripten >> $GITHUB_PATH

.github/actions/setup-js/action.yml

@@ -3,12 +3,6 @@ name: Setup JavaScript envirionment
 runs:
   using: "composite"
   steps:
-    - name: Install emsdk
-      uses: ./.github/actions/install-emsdk
-
-    - name: Install Ninja
-      uses: ./.github/actions/install-ninja
-
     - name: Setup Node environment
       uses: actions/setup-node@v3
       with:

.github/workflows/validate-js.yml

@@ -24,6 +24,9 @@ jobs:
       - name: Setup
         uses: ./.github/actions/setup-js
 
+      - name: Restore emsdk
+        uses: ./.github/actions/cache-emsdk
+
       - name: yarn benchmark
         run: yarn benchmark
         working-directory: javascript
@@ -40,8 +43,11 @@ jobs:
       - name: Setup
         uses: ./.github/actions/setup-js
 
+      - name: Restore emsdk
+        uses: ./.github/actions/cache-emsdk
+
       - name: yarn build
-        run: yarn build
+        run: yarn build --verbose
         working-directory: javascript
 
   test:
@@ -56,6 +62,9 @@ jobs:
       - name: Setup
         uses: ./.github/actions/setup-js
 
+      - name: Restore emsdk
+        uses: ./.github/actions/cache-emsdk
+
       - name: yarn test
         run: yarn test
         working-directory: javascript
@@ -94,6 +103,9 @@ jobs:
       - name: Setup
         uses: ./.github/actions/setup-js
 
+      - name: Restore emsdk
+        uses: ./.github/actions/cache-emsdk
+
       - name: yarn pack
         run: yarn pack --filename yoga-layout.tar.gz
         working-directory: javascript

.github/workflows/validate-website.yml

@@ -34,6 +34,9 @@ jobs:
       - name: Setup
         uses: ./.github/actions/setup-js
 
+      - name: Restore emsdk
+        uses: ./.github/actions/cache-emsdk
+
       - name: Build Website
         run: yarn build
         working-directory: website-next