Skip to content

Ensure that Node.js polyfills are pre-optimized before the first request #8688

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 10 commits into from
Mar 31, 2025

Conversation

petebacondarwin
Copy link
Contributor

Fixes DEVX-1769

Previously, these polyfills were only optimized on demand when Vite became aware of them.
This was either because Vite was able to find an import to a polyfill when statically analysing the import tree of the entry-point,
or when a polyfilled module was dynamically imported as part of a executing code to handle a request.

In the second case, the optimizing of the dynamically imported dependency causes a reload of the Vite server, which can break applications that are holding state in modules during the request.
This is the case of most React type frameworks, in particular React Router.

Now, we pre-optimize all the possible Node.js polyfills when the server starts before the first request is handled.


  • Tests
    • TODO (before merge)
    • Tests included
    • Tests not necessary because:
  • Wrangler E2E Tests CI Job required? (Use "e2e" label or ask maintainer to run separately)
    • I don't know
    • Required
    • Not required because:
  • Public documentation
    • TODO (before merge)
    • Cloudflare docs PR(s):
    • Documentation not necessary because: bug fix / refactor
  • Wrangler V3 Backport
    • TODO (before merge)
    • Wrangler PR:
    • Not necessary because: vite plugin is not backported

@petebacondarwin petebacondarwin requested review from a team as code owners March 26, 2025 21:17
Copy link

changeset-bot bot commented Mar 26, 2025

🦋 Changeset detected

Latest commit: 6613be0

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@cloudflare/vite-plugin Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

Copy link
Contributor

github-actions bot commented Mar 26, 2025

A wrangler prerelease is available for testing. You can install this latest build in your project with:

npm install --save-dev https://prerelease-registry.devprod.cloudflare.dev/workers-sdk/runs/14177000445/npm-package-wrangler-8688

You can reference the automatically updated head of this PR with:

npm install --save-dev https://prerelease-registry.devprod.cloudflare.dev/workers-sdk/prs/8688/npm-package-wrangler-8688

Or you can use npx with this latest build directly:

npx https://prerelease-registry.devprod.cloudflare.dev/workers-sdk/runs/14177000445/npm-package-wrangler-8688 dev path/to/script.js
Additional artifacts:

cloudflare-workers-bindings-extension:

wget https://prerelease-registry.devprod.cloudflare.dev/workers-sdk/runs/14177000445/npm-package-cloudflare-workers-bindings-extension-8688 -O ./cloudflare-workers-bindings-extension.0.0.0-v328c0d2a7.vsix && code --install-extension ./cloudflare-workers-bindings-extension.0.0.0-v328c0d2a7.vsix

create-cloudflare:

npx https://prerelease-registry.devprod.cloudflare.dev/workers-sdk/runs/14177000445/npm-package-create-cloudflare-8688 --no-auto-update

@cloudflare/kv-asset-handler:

npm install https://prerelease-registry.devprod.cloudflare.dev/workers-sdk/runs/14177000445/npm-package-cloudflare-kv-asset-handler-8688

miniflare:

npm install https://prerelease-registry.devprod.cloudflare.dev/workers-sdk/runs/14177000445/npm-package-miniflare-8688

@cloudflare/pages-shared:

npm install https://prerelease-registry.devprod.cloudflare.dev/workers-sdk/runs/14177000445/npm-package-cloudflare-pages-shared-8688

@cloudflare/unenv-preset:

npm install https://prerelease-registry.devprod.cloudflare.dev/workers-sdk/runs/14177000445/npm-package-cloudflare-unenv-preset-8688

@cloudflare/vite-plugin:

npm install https://prerelease-registry.devprod.cloudflare.dev/workers-sdk/runs/14177000445/npm-package-cloudflare-vite-plugin-8688

@cloudflare/vitest-pool-workers:

npm install https://prerelease-registry.devprod.cloudflare.dev/workers-sdk/runs/14177000445/npm-package-cloudflare-vitest-pool-workers-8688

@cloudflare/workers-editor-shared:

npm install https://prerelease-registry.devprod.cloudflare.dev/workers-sdk/runs/14177000445/npm-package-cloudflare-workers-editor-shared-8688

@cloudflare/workers-shared:

npm install https://prerelease-registry.devprod.cloudflare.dev/workers-sdk/runs/14177000445/npm-package-cloudflare-workers-shared-8688

@cloudflare/workflows-shared:

npm install https://prerelease-registry.devprod.cloudflare.dev/workers-sdk/runs/14177000445/npm-package-cloudflare-workflows-shared-8688

Note that these links will no longer work once the GitHub Actions artifact expires.


wrangler@4.6.0 includes the following runtime dependencies:

Package Constraint Resolved
miniflare workspace:* 4.20250321.1
workerd 1.20250321.0 1.20250321.0
workerd --version 1.20250321.0 2025-03-21

Please ensure constraints are pinned, and miniflare/workerd minor versions match.

@petebacondarwin petebacondarwin force-pushed the pbd/vite-plugin/pre-bundle-nodejs-polyfills branch from a8ccf9c to 321861f Compare March 26, 2025 21:22
@petebacondarwin petebacondarwin added the e2e Run wrangler + vite-plugin e2e tests on a PR label Mar 26, 2025
@petebacondarwin petebacondarwin force-pushed the pbd/vite-plugin/pre-bundle-nodejs-polyfills branch 4 times, most recently from 7324c2f to 6d1c924 Compare March 27, 2025 09:40
@petebacondarwin petebacondarwin force-pushed the pbd/vite-plugin/pre-bundle-nodejs-polyfills branch 3 times, most recently from c0a7faa to 2223f7d Compare March 27, 2025 15:16
@petebacondarwin petebacondarwin added the c3-e2e Run c3 e2e tests on a PR label Mar 28, 2025
@petebacondarwin petebacondarwin force-pushed the pbd/vite-plugin/pre-bundle-nodejs-polyfills branch from b28a9ab to 4954054 Compare March 28, 2025 15:14
@jamesopstad jamesopstad added the vite-plugin Relating to the `@cloudflare/vite-plugin` package label Mar 28, 2025
Copy link
Contributor

@jamesopstad jamesopstad left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks great! Thanks for figuring this out.

@github-project-automation github-project-automation bot moved this from Untriaged to Approved in workers-sdk Mar 28, 2025
@jamesopstad
Copy link
Contributor

jamesopstad commented Mar 28, 2025

This comment is no longer valid now that you've removed the configureServer hook in vite-plugin-cloudflare:nodejs-compat-warnings. Is the logic still correct or is there a chance the assertion will fail?

// It has not been added to the map until the `configureServer()` hook is called, which is after the `configEnvironment()` hook.

@petebacondarwin
Copy link
Contributor Author

This comment is no longer valid now that you've removed the configureServer hook in vite-plugin-cloudflare:nodejs-compat-warnings. Is the logic still correct or is there a chance the assertion will fail?

// It has not been added to the map until the `configureServer()` hook is called, which is after the `configEnvironment()` hook.

Yep - good spot. I updated the comment: it is now the resolveId hook that sets this element. The assertion is still valid.

@petebacondarwin petebacondarwin force-pushed the pbd/vite-plugin/pre-bundle-nodejs-polyfills branch 3 times, most recently from c0c4d96 to e673463 Compare March 31, 2025 12:07
Previously, these polyfills were only optimized on demand when Vite became aware of them.
This was either because Vite was able to find an import to a polyfill when statically analysing the import tree of the entry-point,
or when a polyfilled module was dynamically imported as part of a executing code to handle a request.

In the second case, the optimizing of the dynamically imported dependency causes a reload of the Vite server, which can break applications that are holding state in modules during the request.
This is the case of most React type frameworks, in particular React Router.

Now, we pre-optimize all the possible Node.js polyfills when the server starts before the first request is handled.
@jamesopstad jamesopstad force-pushed the pbd/vite-plugin/pre-bundle-nodejs-polyfills branch from e673463 to 6613be0 Compare March 31, 2025 16:55
@petebacondarwin petebacondarwin merged commit 28522ae into main Mar 31, 2025
28 of 29 checks passed
@petebacondarwin petebacondarwin deleted the pbd/vite-plugin/pre-bundle-nodejs-polyfills branch March 31, 2025 17:55
@github-project-automation github-project-automation bot moved this from Approved to Done in workers-sdk Mar 31, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
c3-e2e Run c3 e2e tests on a PR e2e Run wrangler + vite-plugin e2e tests on a PR vite-plugin Relating to the `@cloudflare/vite-plugin` package
Projects
Archived in project
Development

Successfully merging this pull request may close these issues.

2 participants