Remix builds slow with projects containing a high number of routes

[daniloteodoro]

What version of Remix are you using?

1.17.1

Are all your remix dependencies & dev-dependencies using the same version?

• Yes

Steps to Reproduce

Generate a vanilla Remix app using some basic template like indie-stack
Add 300 routes. In my case I added them on the remix.config.js file:

const remixRoutes = require('./data/remixRoutes.json');

module.exports = {

  routes: (defineRoutes) => {
    return defineRoutes((route) => {
      remixRoutes.forEach(([routePath, filePath]) => {
        route(routePath, filePath, {id: routePath});
      });
    });
  },

with remixRoutes.json having the following structure:

[
  ["/path1", "routes/helloworld.tsx"],
  ["/path2", "routes/helloworld.tsx"],
  ["/path3", "routes/helloworld.tsx"],
...
  ["/path300", "routes/helloworld.tsx"]
]

Run the app with npm run dev

Expected Behavior

Build times, especially after a change in the source-code happens in under 2 seconds

Actual Behavior

Build times are 30+ seconds. Rebuild time (hmr) is similar 😭

[daniloteodoro]

@jacob-ebey

[pcattori]

Confirmed fixed by #6629

Setup

// remix.config.js
module.exports = {
  routes: (defineRoutes) => {
    return defineRoutes((route) => {
      let i = 1;
      while (i <= 300) {
        let routePath = `/route_${i}`;
        route(routePath, "routes/helloworld.tsx", { id: routePath });
        i += 1;
      }
    });
  },
};

// app/routes/helloworld.tsx
export default function Component() {
  return <h1>heyooo</h1>;
}

Before

👆 figured out that the esbuild compilations were not the bottleneck, but rather the metafile creation. between the js and server builds. Metafile creation was taking >20s and scaling superlinearly (> O(n))

After