Skip to content

Commit 93b2531

Browse files
ntuckerntucker
authored
internal: Add bundle size tracker on PRs (#3382)
1 parent 3334071 commit 93b2531

File tree

13 files changed

+324
-24
lines changed

13 files changed

+324
-24
lines changed

‎.circleci/config.yml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ jobs:
3030
- run:
3131
name: Add examples/* to yarn workspace
3232
command: |
33+
npm pkg delete workspaces[5]
3334
npm pkg delete workspaces[4]
3435
npm pkg delete workspaces[3]
3536
npm pkg delete workspaces[2]

‎.github/workflows/bundle_size.yml‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
name: Bundle Size
2+
3+
on:
4+
pull_request:
5+
# The branches below must be a subset of the branches above
6+
branches: [ master ]
7+
paths:
8+
- 'packages/**'
9+
- 'yarn.lock'
10+
- 'examples/test-bundlesize/**'
11+
12+
jobs:
13+
build:
14+
15+
runs-on: ubuntu-latest
16+
17+
steps:
18+
- uses: actions/checkout@v4
19+
with:
20+
fetch-depth: 1
21+
- uses: actions/setup-node@v4
22+
with:
23+
node-version: '22'
24+
cache: 'yarn'
25+
- name: Install packages
26+
env:
27+
YARN_ENABLE_IMMUTABLE_INSTALLS: true
28+
run: |
29+
# npm pkg delete workspaces[5]
30+
# npm pkg delete workspaces[4]
31+
# npm pkg delete workspaces[3]
32+
# npm pkg delete workspaces[1]
33+
corepack enable
34+
yarn install
35+
- name: Build packages
36+
run: |
37+
yarn workspaces foreach -Wptiv --no-private run build:lib
38+
- name: compressed-size-action
39+
uses: preactjs/compressed-size-action@v2
40+
continue-on-error: true
41+
with:
42+
repo-token: "${{ secrets.GITHUB_TOKEN }}"
43+
build-script: "build:sizecompare"
44+
pattern: "examples/test-bundlesize/dist/**/*.{js,json}"
45+
exclude: "{examples/test-bundlesize/dist/manifest.json,**/*.LICENSE.txt,**/*.map,**/node_modules/**}"
46+
minimum-change-threshold: 8

‎.github/workflows/main.yml‎

Lines changed: 0 additions & 24 deletions
This file was deleted.

‎examples/test-bundlesize/.babelrc.js‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
module.exports = {
2+
presets: [['@anansi', { polyfillMethod: false }], '@linaria'],
3+
};

‎examples/test-bundlesize/.gitignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
dist-server

‎examples/test-bundlesize/LICENSE‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
The MIT License (MIT)
2+
3+
Copyright (c) 2023 Nathaniel Tucker <[email protected]>
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in
13+
all copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21+
THE SOFTWARE.

‎examples/test-bundlesize/package.json‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
{
2+
"name": "test-bundlesize",
3+
"version": "0.1.0",
4+
"packageManager": "[email protected]",
5+
"description": "Testing Bundled Size",
6+
"scripts": {
7+
"lint": "eslint src --ext .ts,.tsx",
8+
"format": "npm run lint --fix",
9+
"test:type": "tsc",
10+
"start": "anansi serve --dev ./src/index.tsx",
11+
"start:server": "anansi serve ./dist-server/App.js -a",
12+
"build": "webpack --mode=production",
13+
"build:server": "webpack --mode=production --target=node --env entrypath=index.server.tsx",
14+
"build:analyze": "BABEL_DISABLE_CACHE=1 BROWSERSLIST_ENV='modern' webpack --mode=production --env analyze",
15+
"build:sizecompare": "BABEL_DISABLE_CACHE=1 BROWSERSLIST_ENV='modern' webpack --mode=production --env nohash",
16+
"build:profile": "webpack --mode=production --env profile",
17+
"test:pkg": "webpack --env check=nobuild",
18+
"postinstall": "rm -rf node_modules/.cache"
19+
},
20+
"engines": {
21+
"node": ">=18.0"
22+
},
23+
"browserslist": "extends @anansi/browserslist-config",
24+
"keywords": [
25+
"anansi"
26+
],
27+
"devDependencies": {
28+
"@anansi/babel-preset": "6.2.1",
29+
"@anansi/browserslist-config": "^1.4.3",
30+
"@anansi/webpack-config": "^20.0.0",
31+
"@babel/core": "^7.22.15",
32+
"@types/react": "*",
33+
"@types/react-dom": "*",
34+
"react-refresh": "*",
35+
"typescript": "5.7.3",
36+
"webpack": "*",
37+
"webpack-cli": "*"
38+
},
39+
"dependencies": {
40+
"@babel/runtime-corejs3": "^7.26.7",
41+
"@data-client/img": "^0.14.0",
42+
"@data-client/react": "^0.14.0",
43+
"@data-client/rest": "^0.14.0",
44+
"core-js": "^3.40.0",
45+
"react": "^19.0.0",
46+
"react-dom": "^19.0.0"
47+
},
48+
"main": "src/index.ts",
49+
"types": "src/index.ts",
50+
"private": true,
51+
"license": "MIT"
52+
}

‎examples/test-bundlesize/src/index.tsx‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
import { AsyncBoundary, DataProvider, useSuspense } from '@data-client/react';
2+
import React from 'react';
3+
import { createRoot } from 'react-dom/client';
4+
5+
import { getCandles, TodoResource } from './resources';
6+
7+
export const Doit = () => {
8+
const a = useSuspense(getCandles, { product_id: 'BTC-USD' });
9+
const todos = useSuspense(TodoResource.getList, { userId: 1 });
10+
return (
11+
<>
12+
{a} hi {todos.length}
13+
</>
14+
);
15+
};
16+
export const second = React.memo(Doit);
17+
18+
export default function Entry() {
19+
return (
20+
<DataProvider>
21+
<AsyncBoundary>
22+
<Doit />
23+
</AsyncBoundary>
24+
</DataProvider>
25+
);
26+
}
27+
export const renderedElement = <Entry />;
28+
29+
createRoot(document.getElementById('root') || document.body).render(
30+
renderedElement,
31+
);

‎examples/test-bundlesize/src/resources.ts‎

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
import { Entity, resource, RestEndpoint, schema } from '@data-client/rest';
2+
3+
// docs: https://docs.cloud.coinbase.com/exchange/reference/exchangerestapi_getproductcandles
4+
export const getCandles = new RestEndpoint({
5+
urlPrefix: 'https://api.exchange.coinbase.com',
6+
path: '/products/:product_id/candles',
7+
searchParams: {} as {
8+
granularity?: 60 | 300 | 900 | 3600 | 21600 | 86400;
9+
start?: string | number;
10+
end?: string | number;
11+
},
12+
process(value: CandleTuple[]) {
13+
return value.map(candle => ({
14+
timestamp: candle[0],
15+
price_open: candle[3],
16+
}));
17+
},
18+
pollFrequency: 60 * 1000,
19+
});
20+
21+
type CandleTuple = [
22+
timestamp: number,
23+
price_low: number,
24+
price_high: number,
25+
price_open: number,
26+
price_close: number,
27+
];
28+
export class Todo extends Entity {
29+
id = 0;
30+
userId = 0;
31+
title = '';
32+
completed = false;
33+
}
34+
export const TodoResource = resource({
35+
urlPrefix: 'https://jsonplaceholder.typicode.com',
36+
path: '/todos/:id',
37+
searchParams: {} as { userId?: string | number } | undefined,
38+
schema: Todo,
39+
optimistic: true,
40+
});
41+
42+
export class User extends Entity {
43+
id = 0;
44+
name = '';
45+
username = '';
46+
email = '';
47+
website = '';
48+
todos: Todo[] = [];
49+
50+
get profileImage() {
51+
return `https://i.pravatar.cc/64?img=${this.id + 4}`;
52+
}
53+
54+
static schema = {
55+
todos: new schema.Collection([Todo], {
56+
nestKey: (parent, key) => ({
57+
userId: parent.id,
58+
}),
59+
}),
60+
};
61+
}
62+
export const UserResource = resource({
63+
urlPrefix: 'https://jsonplaceholder.typicode.com',
64+
path: '/users/:id',
65+
schema: User,
66+
optimistic: true,
67+
});

‎examples/test-bundlesize/tsconfig.json‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
{
2+
"compilerOptions": {
3+
"outDir": "./dist",
4+
"baseUrl": "./src",
5+
"target": "esnext",
6+
"module": "esnext",
7+
"lib": [
8+
"dom",
9+
"esnext"
10+
],
11+
"jsx": "react-jsx",
12+
"declaration": true,
13+
"strict": true,
14+
"moduleResolution": "bundler",
15+
"allowSyntheticDefaultImports": true,
16+
"esModuleInterop": true,
17+
"experimentalDecorators": true,
18+
"emitDecoratorMetadata": true,
19+
"skipLibCheck": true,
20+
"types": [
21+
"@anansi/webpack-config/types"
22+
],
23+
"noEmit": true
24+
},
25+
"include": [
26+
"src"
27+
],
28+
"exclude": [
29+
"node_modules",
30+
"dist"
31+
]
32+
}

0 commit comments

Comments
 (0)