Optimize rect updates by targeting reconciled elements only (#701)
#2786
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| name: CI | |
| on: | |
| push: | |
| branches: | |
| - main | |
| pull_request: | |
| types: [opened, synchronize, reopened] | |
| paths-ignore: | |
| - "**.md" | |
| - scripts/** | |
| - blog/** | |
| - docs/** | |
| - .github/** | |
| - "!.github/workflows/ci.yml" | |
| concurrency: | |
| group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }} | |
| cancel-in-progress: true | |
| jobs: | |
| lint: | |
| name: Lint | |
| runs-on: ubuntu-latest | |
| timeout-minutes: 3 | |
| steps: | |
| - name: Check out repository | |
| uses: actions/checkout@v4 | |
| - name: Cache pnpm modules | |
| uses: actions/cache@v3 | |
| with: | |
| path: ~/.pnpm-store | |
| key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }} | |
| restore-keys: | | |
| ${{ runner.os }}- | |
| - uses: pnpm/[email protected] | |
| with: | |
| version: ^8.0.0 | |
| run_install: true | |
| - name: Use latest version of Node.j | |
| uses: actions/setup-node@v3 | |
| with: | |
| node-version: "*" | |
| cache: "pnpm" | |
| - name: Run lint | |
| run: "pnpm lint" | |
| types: | |
| name: Check Types | |
| runs-on: ubuntu-latest | |
| timeout-minutes: 3 | |
| steps: | |
| - name: Check out repository | |
| uses: actions/checkout@v4 | |
| - name: Cache pnpm modules | |
| uses: actions/cache@v3 | |
| with: | |
| path: ~/.pnpm-store | |
| key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }} | |
| restore-keys: | | |
| ${{ runner.os }}- | |
| - uses: pnpm/[email protected] | |
| with: | |
| version: ^8.0.0 | |
| run_install: true | |
| - name: Use latest version of Node.j | |
| uses: actions/setup-node@v3 | |
| with: | |
| node-version: "*" | |
| cache: "pnpm" | |
| - name: check types | |
| run: pnpm check-types | |
| unit-test: | |
| name: Unit Test | |
| timeout-minutes: 3 | |
| runs-on: ubuntu-latest | |
| steps: | |
| - name: Check out repository | |
| uses: actions/checkout@v4 | |
| - name: Cache pnpm modules | |
| uses: actions/cache@v3 | |
| with: | |
| path: ~/.pnpm-store | |
| key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }} | |
| restore-keys: | | |
| ${{ runner.os }}- | |
| - uses: pnpm/[email protected] | |
| with: | |
| version: ^8.0.0 | |
| run_install: true | |
| - name: Use latest version of Node.j | |
| uses: actions/setup-node@v3 | |
| with: | |
| node-version: "*" | |
| cache: "pnpm" | |
| - name: Run Test | |
| run: CI=true pnpm jest --coverage | |
| # install-build: | |
| # name: Build and upload artifacts | |
| # runs-on: ubuntu-latest | |
| # if: github.repository_owner == 'dflex-js' && github.event.pull_request.draft != true | |
| # steps: | |
| # - name: Check out repository | |
| # uses: actions/checkout@v4 | |
| # - name: Cache pnpm modules | |
| # uses: actions/cache@v3 | |
| # with: | |
| # path: ~/.pnpm-store | |
| # key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }} | |
| # restore-keys: | | |
| # ${{ runner.os }}- | |
| # - uses: pnpm/[email protected] | |
| # with: | |
| # version: ^8.0.0 | |
| # run_install: true | |
| # - name: Use latest version of Node.j | |
| # uses: actions/setup-node@v3 | |
| # with: | |
| # node-version: "*" | |
| # cache: "pnpm" | |
| # - name: Build packages | |
| # run: "pnpm clean && pnpm -r emit && pnpm build --production --release --minify" | |
| # - name: Build DnD React App | |
| # run: pnpm -F dflex-dnd-playground build --mode CI | |
| # - name: Upload Package Artifacts | |
| # uses: actions/upload-artifact@v3 | |
| # with: | |
| # name: build | |
| # path: | | |
| # packages/**/dist | |
| # packages/**/types | |
| # if-no-files-found: error | |
| e2e-same-container-vertical: | |
| name: One Container Vertically - Chrome | |
| runs-on: ubuntu-latest | |
| timeout-minutes: 20 | |
| if: github.repository_owner == 'dflex-js' && github.event.pull_request.draft != true | |
| steps: | |
| - name: Check out repository | |
| uses: actions/checkout@v4 | |
| - name: Cache pnpm modules | |
| uses: actions/cache@v3 | |
| with: | |
| path: ~/.pnpm-store | |
| key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }} | |
| restore-keys: | | |
| ${{ runner.os }}- | |
| - uses: pnpm/[email protected] | |
| with: | |
| version: ^8.0.0 | |
| run_install: true | |
| - name: Use latest version of Node.j | |
| uses: actions/setup-node@v3 | |
| with: | |
| node-version: "*" | |
| cache: "pnpm" | |
| # - name: Download Build Artifacts | |
| # uses: actions/download-artifact@v3 | |
| # with: | |
| # name: build | |
| # path: ./packages | |
| # - name: Download Build Artifacts | |
| # uses: actions/download-artifact@v3 | |
| # with: | |
| # name: build | |
| # path: ./packages | |
| - name: Build packages | |
| run: "pnpm clean && pnpm -r emit && pnpm build --production --release --minify" | |
| - name: Build DnD React App | |
| run: pnpm -F dflex-dnd-playground build --mode CI | |
| - name: Testing features for DnD with React APP - Chrome | |
| run: pnpm test-e2e-vertical:chrome | |
| e2e-multi-containers: | |
| name: Multiple Containers - Chrome | |
| runs-on: ubuntu-latest | |
| timeout-minutes: 20 | |
| if: github.repository_owner == 'dflex-js' && github.event.pull_request.draft != true | |
| # needs: install-build | |
| steps: | |
| - name: Check out repository | |
| uses: actions/checkout@v4 | |
| - name: Cache pnpm modules | |
| uses: actions/cache@v3 | |
| with: | |
| path: ~/.pnpm-store | |
| key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }} | |
| restore-keys: | | |
| ${{ runner.os }}- | |
| - uses: pnpm/[email protected] | |
| with: | |
| version: ^8.0.0 | |
| run_install: true | |
| - name: Use latest version of Node.j | |
| uses: actions/setup-node@v3 | |
| with: | |
| node-version: "*" | |
| cache: "pnpm" | |
| # - name: Download Build Artifacts | |
| # uses: actions/download-artifact@v3 | |
| # with: | |
| # name: build | |
| # path: ./packages | |
| - name: Build packages | |
| run: "pnpm clean && pnpm -r emit && pnpm build --production --release --minify" | |
| - name: Build DnD React App | |
| run: pnpm -F dflex-dnd-playground build --mode CI | |
| - name: Testing features for DnD with React APP - Chrome | |
| run: pnpm test-e2e-multi:chrome | |
| e2e-linux: | |
| runs-on: ubuntu-latest | |
| timeout-minutes: 20 | |
| if: github.repository_owner == 'dflex-js' && github.event.pull_request.draft != true | |
| strategy: | |
| matrix: | |
| node-version: [18.15] | |
| browser: ["chromium", "firefox"] | |
| bundle: ["production"] | |
| env: | |
| CI: true | |
| PACKAGE_BUNDLE: ${{ matrix.bundle }} | |
| steps: | |
| - name: Checkout | |
| uses: actions/checkout@v4 | |
| - name: Use Node.js ${{ matrix.node-version }} | |
| uses: actions/setup-node@v3 | |
| with: | |
| node-version: ${{ matrix.node-version }} | |
| - uses: pnpm/[email protected] | |
| name: Install pnpm | |
| id: pnpm-install | |
| with: | |
| version: ^8.0.0 | |
| run_install: false | |
| - name: Get pnpm store directory | |
| id: pnpm-cache | |
| run: | | |
| echo "::set-output name=pnpm_cache_dir::$(pnpm store path)" | |
| - uses: actions/cache@v3 | |
| name: Setup pnpm cache | |
| with: | |
| path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }} | |
| key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }} | |
| restore-keys: | | |
| ${{ runner.os }}-pnpm-store- | |
| - name: Install dependencies | |
| run: pnpm install | |
| - name: Build packages | |
| if: matrix.bundle == 'production' | |
| run: "pnpm build --production --release --minify" | |
| - name: Build DnD React App | |
| run: pnpm -F dflex-dnd-playground build --mode CI | |
| - name: Install Playwright | |
| run: npx playwright install --with-deps | |
| - name: Test Playwright | |
| run: pnpm run test-e2e-ci:${{ matrix.browser }} | |
| e2e-windows: | |
| runs-on: windows-latest | |
| timeout-minutes: 20 | |
| if: github.repository_owner == 'dflex-js' && github.event.pull_request.draft != true | |
| strategy: | |
| matrix: | |
| node-version: [18.15] | |
| browser: ["chromium", "firefox"] | |
| bundle: ["production"] | |
| env: | |
| CI: true | |
| PACKAGE_BUNDLE: ${{ matrix.bundle }} | |
| steps: | |
| - name: Checkout | |
| uses: actions/checkout@v4 | |
| - name: Use Node.js ${{ matrix.node-version }} | |
| uses: actions/setup-node@v3 | |
| with: | |
| node-version: ${{ matrix.node-version }} | |
| - uses: pnpm/[email protected] | |
| name: Install pnpm | |
| id: pnpm-install | |
| with: | |
| version: ^8.0.0 | |
| run_install: false | |
| - name: Get pnpm store directory | |
| id: pnpm-cache | |
| run: | | |
| echo "::set-output name=pnpm_cache_dir::$(pnpm store path)" | |
| - uses: actions/cache@v3 | |
| name: Setup pnpm cache | |
| with: | |
| path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }} | |
| key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }} | |
| restore-keys: | | |
| ${{ runner.os }}-pnpm-store- | |
| - name: Install dependencies | |
| run: pnpm install | |
| - name: Build packages | |
| if: matrix.bundle == 'production' | |
| run: "pnpm build --production --release --minify" | |
| - name: Build DnD React App | |
| run: pnpm -F dflex-dnd-playground build --mode CI | |
| - name: Install Playwright | |
| run: npx playwright install --with-deps | |
| - name: Test Playwright | |
| run: pnpm run test-e2e-ci:${{ matrix.browser }} | |
| e2e-mac: | |
| runs-on: macos-latest | |
| timeout-minutes: 20 | |
| strategy: | |
| matrix: | |
| node-version: [18.15] | |
| browser: ["chromium", "firefox", "webkit"] | |
| bundle: ["production", "development"] | |
| env: | |
| CI: true | |
| PACKAGE_BUNDLE: ${{ matrix.bundle }} | |
| steps: | |
| - name: Checkout | |
| uses: actions/checkout@v4 | |
| - name: Use Node.js ${{ matrix.node-version }} | |
| uses: actions/setup-node@v3 | |
| with: | |
| node-version: ${{ matrix.node-version }} | |
| - uses: pnpm/[email protected] | |
| name: Install pnpm | |
| id: pnpm-install | |
| with: | |
| version: ^8.0.0 | |
| run_install: false | |
| - name: Get pnpm store directory | |
| id: pnpm-cache | |
| run: | | |
| echo "::set-output name=pnpm_cache_dir::$(pnpm store path)" | |
| - uses: actions/cache@v3 | |
| name: Setup pnpm cache | |
| with: | |
| path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }} | |
| key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }} | |
| restore-keys: | | |
| ${{ runner.os }}-pnpm-store- | |
| - name: Install dependencies | |
| run: pnpm install | |
| - name: Build packages | |
| if: matrix.bundle == 'production' | |
| run: "pnpm build --production --release --minify" | |
| - name: Build DnD React App | |
| run: pnpm -F dflex-dnd-playground build --mode CI | |
| - name: Install Playwright | |
| run: npx playwright install --with-deps | |
| - name: Test Playwright | |
| run: pnpm run test-e2e-ci:${{ matrix.browser }} | |
| release: | |
| name: Publish to NPM | |
| if: ${{ github.ref_name == 'main' && github.repository_owner == 'dflex-js' }} | |
| runs-on: ubuntu-latest | |
| needs: | |
| [ | |
| lint, | |
| unit-test, | |
| types, | |
| e2e-same-container-vertical, | |
| e2e-multi-containers, | |
| e2e-mac, | |
| e2e-windows, | |
| e2e-linux, | |
| ] | |
| steps: | |
| - name: Check out repository | |
| uses: actions/checkout@v4 | |
| with: | |
| # This makes Actions fetch all Git history so that Changesets can generate changelogs with the correct commits | |
| fetch-depth: 0 | |
| - name: Cache pnpm modules | |
| uses: actions/cache@v3 | |
| with: | |
| path: ~/.pnpm-store | |
| key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }} | |
| restore-keys: | | |
| ${{ runner.os }}- | |
| - uses: pnpm/[email protected] | |
| with: | |
| version: ^8.0.0 | |
| run_install: true | |
| - name: Use latest version of Node.j | |
| uses: actions/setup-node@v3 | |
| with: | |
| node-version: "*" | |
| cache: "pnpm" | |
| - name: Build packages for production | |
| run: "pnpm clean && pnpm -r emit && pnpm build --production --release --minify" | |
| - name: Create Release Pull Request or Publish to npm | |
| id: changesets | |
| uses: changesets/action@v1 | |
| with: | |
| # This expects you to have a script called release which does a build for your packages and calls changeset publish | |
| publish: pnpm -r publish | |
| env: | |
| NPM_TOKEN: ${{ secrets.NPM_TOKEN }} | |
| GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} |