implement example apps benchmarking

[dario-piotrowicz]

As discussed with the team we want to look into application performance improvements, but before doing that it's important to know where we start, so we can also validate our solutions and see if we are actually improving things.

So for this I'm introducing here some rudimental benchmarking capabilities that rely on our examples.

The benchmark script I'm adding here allows any user (including external contributors) to log in using wrangler, deploy and benchmark the example applications.

The benchmarking here simply consists in fetching from the deployed application and seeing how long the fetch took (using performance.now() calls).

This is the result of running the script (pnpm benchmark at the root of the monorepo):

`2024-11-01_16-41-33.json.json`

[
  {
    "name": "api",
    "path": "/Users/dario/Repos/opennextjs-cloudflare/examples/api",
    "fetchBenchmark": {
      "calls": [
        968.4477079999997, 92.53629199999705, 91.15600000000268, 64.40050000000338, 81.6182919999992,
        99.98604200000409, 107.83137500000157, 158.28583299999445, 713.4847079999963, 116.06433400000242,
        85.19845799999894, 126.78262499999983, 68.33308300000499, 98.43016600000556, 82.63295899999503,
        158.11979200000496, 365.22762499999953, 100.05025000000023, 101.95495800000208, 81.64195800000016
      ],
      "average": 188.1091479000006
    }
  },
  {
    "name": "create-next-app",
    "path": "/Users/dario/Repos/opennextjs-cloudflare/examples/create-next-app",
    "fetchBenchmark": {
      "calls": [
        120.17570799999521, 83.23262500000419, 77.19024999999965, 76.00137499999983, 114.57091599999694,
        72.455458000004, 84.43537500000093, 64.03845900000306, 63.78299999999581, 101.29545900000085,
        139.92129199999908, 69.30854199999885, 1025.9113339999967, 327.7433749999982, 71.47758299999987,
        96.38175000000047, 68.3715000000011, 87.0643329999948, 159.8877500000017, 104.00108299999556
      ],
      "average": 150.36235834999934
    }
  },
  {
    "name": "vercel-blog-starter",
    "path": "/Users/dario/Repos/opennextjs-cloudflare/examples/vercel-blog-starter",
    "fetchBenchmark": {
      "calls": [
        162.13308400000096, 218.4584579999937, 711.0034999999989, 149.95554099999572, 165.5824999999968,
        162.60087499999645, 218.49045800000022, 204.74100000000908, 1105.5174999999945, 204.81149999999616,
        170.08466699999553, 148.48545800000284, 160.25333300000057, 147.34891600000265, 169.2338329999984,
        234.29762499999924, 156.23070900000312, 139.84700000000157, 153.2925000000032, 645.9700840000005
      ],
      "average": 271.4169270499995
    }
  }
]

---

Things can be improved later on and we can also generalize the script here (I tried making it fairly generic/reusable), but as a starting point I think this should (hopefully) be pretty adequate 🙂

[changeset-bot]

⚠️ No Changeset found

Latest commit: 62e878b

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[pkg-pr-new]

Open in Stackblitz

pnpm add https://pkg.pr.new/@opennextjs/cloudflare@117

commit: 62e878b

[vicb]

Thanks for working on this.

I added a few comments.

[vicb]

Looks great, thanks for the updates