Open
Description
Reproduction
- Go to for example daffy.org (it happened in my app as well, both are remix based)
- Try refreshing the page a few times to see the average request time
- Open up devtools on Chrome, enable javascript source maps in devtools settings
- Try refreshing the page again
System Info
System:
OS: Linux 5.15 Debian GNU/Linux 10 (buster) 10 (buster)
CPU: (16) x64 AMD EPYC 7R13 Processor
Memory: 42.70 GB / 61.44 GB
Container: Yes
Shell: 5.0.3 - /bin/bash
Binaries:
Node: 20.12.0 - ~/project/nodes/node-20.12.0/bin/node
Yarn: 1.22.22 - /usr/bin/yarn
npm: 10.5.0 - ~/project/nodes/node-20.12.0/bin/npm
pnpm: 8.15.5 - /usr/bin/pnpm
npmPackages:
@remix-run/dev: 2.8.1 => 2.8.1
@remix-run/express: 2.8.1 => 2.8.1
@remix-run/node: 2.8.1 => 2.8.1
@remix-run/react: 2.8.1 => 2.8.1
@remix-run/router: ^1.15.3 => 1.15.3
@remix-run/serve: 2.8.1 => 2.8.1
@remix-run/server-runtime: 2.8.1 => 2.8.1
@remix-run/testing: 2.8.1 => 2.8.1
vite: ^5.2.2 => 5.2.2
Used Package Manager
npm
Expected Behavior
It should load about the same time
Actual Behavior
It actually takes several seconds to load the page even though the source maps don't exist on the server. When I looked at my logs, fetching the source maps took more than 500ms which is way longer than expected for not found files.
To fix this I had to use this middleware
app.use((req, res, next) => {
if (MODE === "production" && req.path.endsWith(".js.map")) {
return res.status(404).send("Not found");
}
next();
});
While debugging, i was inspecting which middleware (if any) did this. Found out that it's actually the createRequestHandler
app.all(
"*",
createRequestHandler({
mode: MODE,
getLoadContext: (_, res) => ({
cspNonce: res.locals.cspNonce,
serverBuild: getBuild(),
}),
// @sentry/remix needs to be updated to handle the function signature
build: MODE === "production" ? await getBuild() : getBuild,
}),
);
Not sure if this is an issue in remix or not