Skip to content

Commit b18375e

Browse files
committed
Use a much smaller cloneDeep implementation to improve bundlesize
We were previously using cloneDeep from lodash for simplicity in deep cloning the properties of a GadgetRecord for changetracking. We don't need the giant lodash cloneDeep function, we can use one of the much smaller ones out there on the internet that is just about the same. https://github.com/lukeed/klona has a great comparison table in the readme and looks appropriate for our use! Before: ``` vite v4.4.7 building for production... ✓ 174 modules transformed. dist/api-read-stats.html 211.29 kB │ gzip: 46.97 kB dist/test-bundle-api-read.js 223.49 kB │ gzip: 40.77 kB dist/api-read-stats.html 211.85 kB │ gzip: 46.99 kB dist/test-bundle-api-read.cjs 146.84 kB │ gzip: 33.65 kB ✓ built in 795ms vite v4.4.7 building for production... ✓ 450 modules transformed. dist/react-read-stats.html 302.75 kB │ gzip: 56.82 kB dist/test-bundle-react-read.js 328.63 kB │ gzip: 69.94 kB dist/react-read-stats.html 306.74 kB │ gzip: 56.90 kB dist/test-bundle-react-read.cjs 221.58 kB │ gzip: 58.80 kB ✓ built in 1.21s vite v4.4.7 building for production... ✓ 984 modules transformed. dist/shopify-read-stats.html 516.32 kB │ gzip: 77.44 kB dist/test-bundle-shopify-read.js 647.97 kB │ gzip: 128.67 kB dist/shopify-read-stats.html 516.83 kB │ gzip: 77.47 kB dist/test-bundle-shopify-read.cjs 455.63 kB │ gzip: 109.84 kB ✓ built in 2.60s ``` After: ``` vite v4.4.7 building for production... ✓ 173 modules transformed. dist/api-read-stats.html 210.79 kB │ gzip: 46.88 kB dist/test-bundle-api-read.js 211.80 kB │ gzip: 37.36 kB dist/api-read-stats.html 211.39 kB │ gzip: 46.93 kB dist/test-bundle-api-read.cjs 138.54 kB │ gzip: 30.51 kB ✓ built in 769ms vite v4.4.7 building for production... ✓ 449 modules transformed. dist/react-read-stats.html 302.29 kB │ gzip: 56.83 kB dist/test-bundle-react-read.js 316.93 kB │ gzip: 66.53 kB dist/react-read-stats.html 306.22 kB │ gzip: 56.92 kB dist/test-bundle-react-read.cjs 213.27 kB │ gzip: 55.67 kB ✓ built in 1.13s vite v4.4.7 building for production... ✓ 983 modules transformed. dist/shopify-read-stats.html 515.87 kB │ gzip: 77.42 kB dist/test-bundle-shopify-read.js 636.23 kB │ gzip: 125.20 kB dist/shopify-read-stats.html 516.37 kB │ gzip: 77.42 kB dist/test-bundle-shopify-read.cjs 447.28 kB │ gzip: 106.73 kB ✓ built in 2.29s ``` 5% bundle size reduction
1 parent d8f647d commit b18375e

File tree

3 files changed

+13
-22
lines changed

3 files changed

+13
-22
lines changed

packages/api-client-core/package.json

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -30,22 +30,21 @@
3030
"dependencies": {
3131
"@urql/core": "^4.0.10",
3232
"cross-fetch": "^3.1.5",
33-
"tiny-graphql-query-compiler": "^0.2.2",
3433
"graphql": "~16.6.0",
3534
"graphql-ws": "^5.13.1",
3635
"isomorphic-ws": "^5.0.0",
37-
"lodash.clonedeep": "^4.5.0",
36+
"klona": "^2.0.6",
37+
"tiny-graphql-query-compiler": "^0.2.2",
3838
"ws": "^8.13.0"
3939
},
4040
"devDependencies": {
41-
"tiny-graphql-query-compiler": "*",
42-
"@types/lodash.clonedeep": "^4.5.6",
4341
"@types/node": "^16.11.7",
4442
"conditional-type-checks": "^1.0.6",
4543
"gql-tag": "^1.0.1",
44+
"nock": "^13.3.1",
4645
"react": "^18.2.0",
4746
"react-dom": "^18.2.0",
48-
"nock": "^13.3.1",
47+
"tiny-graphql-query-compiler": "workspace:*",
4948
"type-fest": "^3.3.0",
5049
"typescript": "5.0.4"
5150
}

packages/api-client-core/src/GadgetRecord.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import cloneDeep from "lodash.clonedeep";
1+
import { klona as cloneDeep } from "klona";
22
import type { Jsonify } from "type-fest";
33
import { isEqual, toPrimitiveObject } from "./support.js";
44

pnpm-lock.yaml

Lines changed: 8 additions & 16 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)