esbuild VS ts-node

Pre-bundle all the dependencies on the "optimization boundary" list into node_modules/.vite/deps/ folder. This step is done by esbuild.

ESBuild is a bundler. The subtitle on the website is literally “An extremely fast bundler for the web”. To bundle, pass —-bundle flag.

https://esbuild.github.io/

esbuild for bunding both the client and server separately

> like individual loaders/modules are/were slow, rather than webpack itself

tbh this is just nitpicking, I'm not a react developer to do CRA debugging for them. They're paid by Facebook a couple orders of magnitude more than what we're making here, and if they're fine with the intact CRA configuration being that slow, while a third-party alternative rips through the massive pile of shit I'm working on while not bringing any obvious downsides, I'll just to the alternative.

It's a well known problem: esbuild, which is the base of vite's HMR, boasts of speeds dozens to hundreds of times faster than webpack:

https://github.com/evanw/esbuild?tab=readme-ov-file#why

Micro-frontend has always aroused my curiosity: I wanted to understand how they work, how to build them, what their pros and cons are. In 2018, inspired by this topic, I tried to build something similar to single-spa in one of the pet projects. At that time, there was no Webpack Module Federation (WMF), and Webpack itself seemed inconvenient. The choice fell on ESBuild and importmap. Browser support for importmap at the time was mostly on paper or with special flags in browsers. For this reason, I used a polyfill. But, surprisingly, everything worked and even in several projects.

Why esbuild? compared to other tools esbuild keeps things minimal, it is very fast(the fastest bundler as of today) and supports typescript and esm by default.

use ts-node

tsx : for typescript code execution. It is a replacement of ts-node. As the latter does not work in Node 20

I thought this was going to be a project like ts-node [1]

[1] https://github.com/TypeStrong/ts-node

The command specified in the app option uses ts-node by default, which is an execution engine for Node.js that allows you to run TypeScript code directly. The --prefer-ts-exts flag prevents ts-node from prioritizing precompiled .js files and will always import the TypeScript source code instead, if it is available. This is useful if you are also using tsc (the TypeScript compiler) alongside the app option. The bin/cdk.ts file is the entry point for our CDK app, which defines the main function that will be executed when the app is run.

If you want to write apps that run on Node.js I would suggest using Google’s TypeScript style guide. You can start using it by simply running npx gts init. I’d suggest that you start with this and run your apps using ts-node/ts-node-dev because it does not require an extra build step.

ts-node (“TypeScript execution and REPL for Node.js”)

Here is a relevant discussion and dev comment: https://github.com/TypeStrong/ts-node/issues/155