Skip to content

Commit cc3c42f

Browse files
kdy1kdy1
authored
chore(ci): Configure small benchmark for builds (#79796)
### What? We can use codspeed for profiling the build performance, considering that these apps are very small. ### Why? We need an e2e benchmark.
1 parent 6c7a69a commit cc3c42f

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

45 files changed

+3654
-14
lines changed

‎.github/workflows/test-turbopack-rust-bench-test.yml

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,10 @@ jobs:
4242
check-latest: true
4343
- run: corepack enable
4444

45+
# We need to install the dependencies for the benchmark apps
46+
- run: pnpm install
47+
working-directory: turbopack/benchmark-apps
48+
4549
- name: Build benchmarks for tests
4650
timeout-minutes: 120
4751
run: |

‎.github/workflows/turbopack-benchmark.yml

Lines changed: 42 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,10 +25,13 @@ env:
2525
CARGO_INCREMENTAL: 0
2626
# For faster CI
2727
RUST_LOG: 'off'
28+
TURBO_TEAM: 'vercel'
29+
TURBO_CACHE: 'remote:rw'
30+
TURBO_TOKEN: ${{ secrets.HOSTED_TURBO_TOKEN }}
2831

2932
jobs:
30-
benchmark-small:
31-
name: Benchmark Rust Crates (small)
33+
benchmark-tiny:
34+
name: Benchmark Rust Crates (tiny)
3235
runs-on: ubuntu-22.04
3336
steps:
3437
- uses: actions/checkout@v4
@@ -50,6 +53,43 @@ jobs:
5053
run: cargo codspeed run
5154
token: ${{ secrets.CODSPEED_TOKEN }}
5255

56+
benchmark-small-apps:
57+
name: Benchmark Rust Crates (small apps)
58+
runs-on: ubuntu-22.04
59+
steps:
60+
- uses: actions/checkout@v4
61+
62+
- name: Setup Rust toolchain
63+
uses: ./.github/actions/setup-rust
64+
65+
- name: Install cargo-codspeed
66+
uses: taiki-e/install-action@v2
67+
with:
68+
tool: [email protected]
69+
70+
- name: Cache on ${{ github.ref_name }}
71+
uses: ijjk/[email protected]
72+
with:
73+
save-if: 'true'
74+
cache-provider: 'turbo'
75+
shared-key: build-turbopack-benchmark-small-apps-${{ hashFiles('.cargo/config.toml') }}
76+
77+
- name: Install pnpm dependencies
78+
working-directory: turbopack/benchmark-apps
79+
run: |
80+
npm i -g [email protected]
81+
corepack enable
82+
pnpm install --loglevel error
83+
84+
- name: Build app build benchmarks
85+
run: cargo codspeed build -p turbopack-cli small_apps
86+
87+
- name: Run the benchmarks
88+
uses: CodSpeedHQ/action@v3
89+
with:
90+
run: cargo codspeed run
91+
token: ${{ secrets.CODSPEED_TOKEN }}
92+
5393
benchmark-large:
5494
name: Benchmark Rust Crates (large)
5595
# If the task is triggered manually, we want to run the large benchmarks

‎turbopack/benchmark-apps/README.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
# Benchmark Apps
2+
3+
This directory contains apps that are used to benchmark the performance of Turbopack.

‎turbopack/benchmark-apps/date-fns-all/App.tsx

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import * as React from 'react'
2+
import * as DateFns from 'date-fns'
3+
4+
console.log(DateFns)
5+
6+
export default function Home() {
7+
return <div>Benchmark</div>
8+
}

‎turbopack/benchmark-apps/date-fns-all/index.html

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="initial-scale=1, width=device-width" />
6+
</head>
7+
<body>
8+
<div id="root"></div>
9+
<script type="module" src="/src-mui/index.tsx"></script>
10+
</body>
11+
</html>

‎turbopack/benchmark-apps/date-fns-all/index.tsx

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import * as React from 'react'
2+
import * as ReactDOM from 'react-dom/client'
3+
import App from './App'
4+
5+
ReactDOM.createRoot(document.getElementById('root')!).render(
6+
<React.StrictMode>
7+
<App />
8+
</React.StrictMode>
9+
)

‎turbopack/benchmark-apps/date-fns-single/App.tsx

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import * as React from 'react'
2+
import { format } from 'date-fns'
3+
4+
export default function Home() {
5+
return <div>{format(new Date(), "'Today is a' eeee")}</div>
6+
}

‎turbopack/benchmark-apps/date-fns-single/index.html

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="initial-scale=1, width=device-width" />
6+
</head>
7+
<body>
8+
<div id="root"></div>
9+
<script type="module" src="/src-mui/index.tsx"></script>
10+
</body>
11+
</html>

‎turbopack/benchmark-apps/date-fns-single/index.tsx

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import * as React from 'react'
2+
import * as ReactDOM from 'react-dom/client'
3+
import App from './App'
4+
5+
ReactDOM.createRoot(document.getElementById('root')!).render(
6+
<React.StrictMode>
7+
<App />
8+
</React.StrictMode>
9+
)

‎turbopack/benchmark-apps/framer-motion-all/App.tsx

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
/* eslint-disable react/jsx-pascal-case */
2+
import * as React from 'react'
3+
import * as FramerMotion from 'framer-motion'
4+
5+
console.log(FramerMotion)
6+
7+
export default function Home() {
8+
return (
9+
<div>
10+
<FramerMotion.motion.div animate={{ x: 0 }} />
11+
</div>
12+
)
13+
}

‎turbopack/benchmark-apps/framer-motion-all/index.html

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="initial-scale=1, width=device-width" />
6+
</head>
7+
<body>
8+
<div id="root"></div>
9+
<script type="module" src="/src-mui/index.tsx"></script>
10+
</body>
11+
</html>

‎turbopack/benchmark-apps/framer-motion-all/index.tsx

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import * as React from 'react'
2+
import * as ReactDOM from 'react-dom/client'
3+
import App from './App'
4+
5+
ReactDOM.createRoot(document.getElementById('root')!).render(
6+
<React.StrictMode>
7+
<App />
8+
</React.StrictMode>
9+
)

‎turbopack/benchmark-apps/framer-motion-single/App.tsx

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import * as React from 'react'
2+
import { motion } from 'framer-motion'
3+
4+
export default function Home() {
5+
return (
6+
<div>
7+
<motion.div animate={{ x: 0 }} />
8+
</div>
9+
)
10+
}

‎turbopack/benchmark-apps/framer-motion-single/index.html

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="initial-scale=1, width=device-width" />
6+
</head>
7+
<body>
8+
<div id="root"></div>
9+
<script type="module" src="/src-mui/index.tsx"></script>
10+
</body>
11+
</html>

‎turbopack/benchmark-apps/framer-motion-single/index.tsx

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import * as React from 'react'
2+
import * as ReactDOM from 'react-dom/client'
3+
import App from './App'
4+
5+
ReactDOM.createRoot(document.getElementById('root')!).render(
6+
<React.StrictMode>
7+
<App />
8+
</React.StrictMode>
9+
)

‎turbopack/benchmark-apps/joy/App.tsx

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import * as React from 'react'
2+
import { Container, Typography, Box, Link } from '@mui/joy'
3+
import ProTip from './ProTip'
4+
5+
function Copyright() {
6+
return (
7+
<Typography
8+
textAlign="center"
9+
sx={{
10+
color: 'text.secondary',
11+
}}
12+
>
13+
{'Copyright © '}
14+
<Link href="https://mui.com/">Your Website</Link>{' '}
15+
{new Date().getFullYear()}.
16+
</Typography>
17+
)
18+
}
19+
20+
export default function App() {
21+
return (
22+
<Container maxWidth="sm">
23+
<Box sx={{ my: 4 }}>
24+
<Typography level="h4" component="h1" sx={{ mb: 2 }}>
25+
Material UI Vite.js example in TypeScript
26+
</Typography>
27+
<ProTip />
28+
<Copyright />
29+
</Box>
30+
</Container>
31+
)
32+
}

‎turbopack/benchmark-apps/joy/ProTip.tsx

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
import * as React from 'react'
2+
import { Link, Typography, SvgIcon, type SvgIconProps } from '@mui/joy'
3+
4+
function LightBulbIcon(props: SvgIconProps) {
5+
return (
6+
<SvgIcon {...props}>
7+
<path d="M9 21c0 .55.45 1 1 1h4c.55 0 1-.45 1-1v-1H9v1zm3-19C8.14 2 5 5.14 5 9c0 2.38 1.19 4.47 3 5.74V17c0 .55.45 1 1 1h6c.55 0 1-.45 1-1v-2.26c1.81-1.27 3-3.36 3-5.74 0-3.86-3.14-7-7-7zm2.85 11.1l-.85.6V16h-4v-2.3l-.85-.6C7.8 12.16 7 10.63 7 9c0-2.76 2.24-5 5-5s5 2.24 5 5c0 1.63-.8 3.16-2.15 4.1z" />
8+
</SvgIcon>
9+
)
10+
}
11+
12+
export default function ProTip() {
13+
return (
14+
<Typography sx={{ mt: 6, mb: 3, color: 'text.secondary' }}>
15+
<LightBulbIcon sx={{ mr: 1, verticalAlign: 'middle' }} />
16+
{'Pro tip: See more '}
17+
<Link href="https://mui.com/material-ui/getting-started/templates/">
18+
templates
19+
</Link>
20+
{' in the Material UI documentation.'}
21+
</Typography>
22+
)
23+
}

‎turbopack/benchmark-apps/joy/index.html

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="initial-scale=1, width=device-width" />
6+
</head>
7+
<body>
8+
<div id="root"></div>
9+
<script type="module" src="/src-joy/index.tsx"></script>
10+
</body>
11+
</html>

‎turbopack/benchmark-apps/joy/index.tsx

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import * as React from 'react'
2+
import * as ReactDOM from 'react-dom/client'
3+
import { CssBaseline } from '@mui/joy'
4+
import App from './App'
5+
6+
ReactDOM.createRoot(document.getElementById('root')!).render(
7+
<React.StrictMode>
8+
<CssBaseline />
9+
<App />
10+
</React.StrictMode>
11+
)

‎turbopack/benchmark-apps/lucide-react-all/App.tsx

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import * as React from 'react'
2+
import * as Icons from 'lucide-react'
3+
4+
export default function Home() {
5+
const dynamicName = 'Camera'
6+
const Icon = Icons[dynamicName]
7+
return (
8+
<div>
9+
<Icon />
10+
</div>
11+
)
12+
}

‎turbopack/benchmark-apps/lucide-react-all/index.html

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="initial-scale=1, width=device-width" />
6+
</head>
7+
<body>
8+
<div id="root"></div>
9+
<script type="module" src="/src-mui/index.tsx"></script>
10+
</body>
11+
</html>

‎turbopack/benchmark-apps/lucide-react-all/index.tsx

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import * as React from 'react'
2+
import * as ReactDOM from 'react-dom/client'
3+
import App from './App'
4+
5+
ReactDOM.createRoot(document.getElementById('root')!).render(
6+
<React.StrictMode>
7+
<App />
8+
</React.StrictMode>
9+
)

‎turbopack/benchmark-apps/lucide-react-single/App.tsx

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import * as React from 'react'
2+
import { Camera } from 'lucide-react'
3+
4+
export default function Home() {
5+
return (
6+
<div>
7+
<Camera />
8+
</div>
9+
)
10+
}

‎turbopack/benchmark-apps/lucide-react-single/index.html

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="initial-scale=1, width=device-width" />
6+
</head>
7+
<body>
8+
<div id="root"></div>
9+
<script type="module" src="/src-mui/index.tsx"></script>
10+
</body>
11+
</html>

‎turbopack/benchmark-apps/lucide-react-single/index.tsx

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import * as React from 'react'
2+
import * as ReactDOM from 'react-dom/client'
3+
import App from './App'
4+
5+
ReactDOM.createRoot(document.getElementById('root')!).render(
6+
<React.StrictMode>
7+
<App />
8+
</React.StrictMode>
9+
)

‎turbopack/benchmark-apps/mui/App.tsx

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import * as React from 'react'
2+
import Container from '@mui/material/Container'
3+
import Typography from '@mui/material/Typography'
4+
import Box from '@mui/material/Box'
5+
import Link from '@mui/material/Link'
6+
import ProTip from './components/ProTip'
7+
import Copyright from './components/Copyright'
8+
9+
export default function Home() {
10+
return (
11+
<Container maxWidth="lg">
12+
<Box
13+
sx={{
14+
my: 4,
15+
display: 'flex',
16+
flexDirection: 'column',
17+
justifyContent: 'center',
18+
alignItems: 'center',
19+
}}
20+
>
21+
<Typography variant="h4" component="h1" sx={{ mb: 2 }}>
22+
Material UI - Next.js App Router example in TypeScript
23+
</Typography>
24+
<Link href="/about" color="secondary">
25+
Go to the about page
26+
</Link>
27+
<ProTip />
28+
<Copyright />
29+
</Box>
30+
</Container>
31+
)
32+
}

0 commit comments

Comments
 (0)