Support Vite projects in debug:cpu command

[frandiox]

Needs #2100 first

This PR adds supports for Vite projects in the h2 debug cpu command, and makes the command also available in diff examples with the --diff example flag.

It's easier to check the code commit by commit.

To tophat:

1. Check that we can still run it for classic projects: in examples/classic-remix, run h2 debug cpu --diff.
2. Check that it works in Vite projects: in templates/skeleton, run h2 debug cpu.

You can add the following code, for example, to the top level of server.ts and change the number or 0s in the times variable:

let times = 100000;
while (--times) {
  // @ts-ignore
  globalThis.asdf = 2 + 6;
}

[shopify[bot]]

Oxygen deployed a preview of your fd-debug-cpu-vite branch. Details:

Storefront	Status	Preview link	Deployment details	Last update (UTC)
subscriptions	✅ Successful (Logs)	Preview deployment	Inspect deployment	May 24, 2024 6:16 AM
vite	✅ Successful (Logs)	Preview deployment	Inspect deployment	May 24, 2024 6:16 AM
custom-cart-method	✅ Successful (Logs)	Preview deployment	Inspect deployment	May 24, 2024 6:16 AM
third-party-queries-caching	✅ Successful (Logs)	Preview deployment	Inspect deployment	May 24, 2024 6:16 AM
Skeleton (skeleton.hydrogen.shop)	✅ Successful (Logs)	Preview deployment	Inspect deployment	May 24, 2024 6:16 AM
optimistic-cart-ui	✅ Successful (Logs)	Preview deployment	Inspect deployment	May 24, 2024 6:16 AM

Learn more about Hydrogen's GitHub integration.

[blittle]

It appears to work, the total start-up time seems correct. But in all honesty, I can't get the cpuprofile to actually be helpful

[frandiox]

But in all honesty, I can't get the cpuprofile to actually be helpful

Oh maybe there's an issue with sourcemaps when using Vite. I think we were getting real names and paths in the classic one 🤔

Also, the idea is that you can feed this cpuprofile file to a flame chart, like this one: https://marketplace.visualstudio.com/items?itemName=ms-vscode.vscode-js-profile-flame#flame-chart-view

---

While checking what you mentioned, I found it wasn't passing sourcemap: true to the build in the debug:cpu command, now fixed 👍

For what you mention, however, it looks like React doesn't provide sourcemaps so we can't do much for that one. For the app code, if you wrap the while loop in a function you can see it is properly identified using sourcemaps (at the top level it would just be "anonymous"):

---

Also, I noticed that the script>:1 part might be confusing. This is because the slow part is the top-level of the app code and sourcemaps cannot find any more information because it's like the slow part is the whole bundled script. I've changed it to show the app's entry point and change the label to "(top-level app code)". The slow part can be in server.ts, root.tsx or somewhere else we don't know, but it must be top level.