Server runtime: remove need for node compat layer (=> removing 200k from worker bundle size)

[brillout]

Description

We can make the server runtime completely agnostic to Node.js. Removing the need for Node.js shims on Edge platforms.

[brillout]

If someone wants/needs this, PM on discord.

[zeyuri]

I would be interested in doing this

[brillout]

I would be interested in doing this

👍 PR welcome.

[zeyuri]

Can you help me a little bit giving some guidance? How I have some experience porting some code from node to workers but I will be a little lost trying to find where this parts of the code are.

Also how would we make this work to not be a breaking change? A flag passed to the ssr plugin setup inside the vite.config.ts ?

[brillout]

I believe we can replace all runtime Node.js dependencies with our own functions (self written or copied from e.g. StackOverflow). I think it's fairly straigthforward (although I may miss something). Last time I checked there were only few trivial Node.js dependencies. Note that it's only about the dependencies of the runtime code, not the entire VPS code.

With that approach we don't need any new VPS flag.

I'd run the Cloudflare example (/examples/cloudflare) without the Node.js compat flag and fix the errors until it works.

[brillout]

If I'm not mistaken all server runtime dependencies now don't depend on Node.js anymore. So it should be fairly easy to implement this now.

[magne4000]

Perhaps some eslint config would also be welcome in order to not mistakenly add back some node dependency.

[brillout]

Yea, I've been thinking about adding eslint. Although note that this is about the server runtime. VPS's Vite plugin, for example, will still use Node.js.

But we can use the Cloudflare Workers tests to ensure that we don't mistakenly add back a Node.js dependency.

[kochrt]

I'm mildly curious about this so I am fiddling around with it a bit. Not sure how far I'll make it so wanted to document in case I drop off and someone wants to pick up.

I'd run the Cloudflare example (/examples/cloudflare) without the Node.js compat flag and fix the errors until it works.

Seems the initial errors are all about path:

[ERROR] Could not resolve "path"

    node_modules/@brillout/import/dist/index.js:8:39:
      8 │ const path_1 = __importDefault(require("path"));
        ╵                                        ~~~~~~

  The package "path" wasn't found on the file system but is built into node.
  Add "node_compat = true" to your wrangler.toml file to enable Node compatibility.


✘ [ERROR] Could not resolve "path"

    node_modules/vite-plugin-ssr/dist/cjs/node/runtime/renderPage/getPageAssets.js:10:39:
      10 │ const path_1 = __importDefault(require("path"));
         ╵                                        ~~~~~~

  The package "path" wasn't found on the file system but is built into node.
  Add "node_compat = true" to your wrangler.toml file to enable Node compatibility.


✘ [ERROR] Could not resolve "path"

    node_modules/vite-plugin-ssr/dist/cjs/utils/getOutDirs.js:10:39:
      10 │ const path_1 = __importDefault(require("path"));
         ╵                                        ~~~~~~

  The package "path" wasn't found on the file system but is built into node.
  Add "node_compat = true" to your wrangler.toml file to enable Node compatibility.


✘ [ERROR] Could not resolve "path"

    node_modules/vite-plugin-ssr/dist/cjs/utils/moduleExists.js:4:23:
      4 │ const path_1 = require("path");
        ╵                        ~~~~~~

  The package "path" wasn't found on the file system but is built into node.
  Add "node_compat = true" to your wrangler.toml file to enable Node compatibility.

[brillout]

@kochrt How about replacing these path imports with a path polyfill and see whether Cloudflare still complains?

(Note that not all path imports need be removed but only the ones from the server runtime.)

[kochrt]

Using pathe in conjunction with the pull request in @brillout/import seems to eliminate errors in the vue example.

[brillout]

Done, released as 0.4.112. Huge props to @kochrt 💯.

On a tangent: in case someone is able to convince his employer: https://github.com/sponsors/brillout. Sponsors are making a big difference!