Skip to content

Commit f7ea7dd

Browse files
ioayioay
committed
Performance imrovements: webpack config(uglify & chunks), code refactor
1 parent 2d9982a commit f7ea7dd

Some content is hidden

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

83 files changed

+2973
-2436
lines changed

‎.babelrc.cjs‎

Lines changed: 18 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,20 @@
11
module.exports = {
2-
plugins: ["styled-jsx/babel"],
2+
compact: true,
3+
plugins: [
4+
"styled-jsx/babel",
5+
"@babel/plugin-syntax-dynamic-import",
6+
[
7+
"babel-plugin-styled-components",
8+
{
9+
minify: true,
10+
transpileTemplateLiterals: false,
11+
},
12+
],
13+
],
314
presets: ["@babel/preset-typescript", "@babel/react"],
4-
};
15+
env: {
16+
production: {
17+
plugins: ["transform-remove-console"],
18+
},
19+
},
20+
}

‎.env.defaults‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,4 +31,4 @@ SEASON_LENGTH_IN_WEEKS=8
3131
CONTRACT_DEPLOYMENT_BLOCK_NUMBER=553443
3232
SEASON_START_DATE="2023-10-26"
3333
SKIP_REACT_STRICT_MODE="false"
34-
SHOW_WAITLIST="true"
34+
SHOW_WAITLIST="true"

‎.eslintrc.cjs‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
module.exports = {
22
root: true,
33
extends: ["@thesis-co"],
4+
plugins: ["unused-imports"],
45
settings: {
56
"import/core-modules": ["styled-jsx/css"],
67
"import/resolver": {
@@ -25,6 +26,16 @@ module.exports = {
2526
ignore: ["jsx", "global"],
2627
},
2728
],
29+
"unused-imports/no-unused-imports": "error",
30+
"unused-imports/no-unused-vars": [
31+
"warn",
32+
{
33+
vars: "all",
34+
varsIgnorePattern: "^_",
35+
args: "after-used",
36+
argsIgnorePattern: "^_",
37+
},
38+
],
2839
},
2940
ignorePatterns: ["dist", "typechain"],
3041
}

‎package.json‎

Lines changed: 18 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -21,66 +21,67 @@
2121
"@reduxjs/toolkit": "^1.9.5",
2222
"@rocicorp/rails": "^0.8.0",
2323
"@rocicorp/reflect": "^0.38.202311200859",
24-
"@web3-onboard/core": "^2.21.0",
2524
"@web3-onboard/metamask": "^2.0.1",
2625
"@web3-onboard/react": "^2.8.11",
2726
"@web3-onboard/taho": "^2.0.5",
2827
"@web3-onboard/trezor": "^2.4.2",
2928
"@web3-onboard/walletconnect": "^2.4.4",
30-
"assert": "^2.0.0",
31-
"buffer": "^6.0.3",
3229
"classnames": "^2.3.2",
33-
"crypto-browserify": "^3.12.0",
3430
"emittery": "^1.0.1",
3531
"ethers": "^5",
3632
"gifler": "^0.1.0",
37-
"https-browserify": "^1.0.0",
3833
"konva": "^9.2.0",
39-
"lodash": "4.17.21",
40-
"os-browserify": "^0.3.0",
41-
"patch-package": "^8.0.0",
42-
"path-browserify": "^1.0.1",
34+
"lodash.debounce": "^4.0.8",
4335
"posthog-js": "^1.88.2",
44-
"process": "^0.11.10",
45-
"raf-schd": "^4.0.3",
4636
"react": "^18.2.0",
4737
"react-dom": "^18.2.0",
4838
"react-konva": "^18.2.10",
4939
"react-markdown": "^9.0.0",
5040
"react-redux": "^8.1.2",
5141
"react-router-dom": "^5",
5242
"rehype-external-links": "^3.0.0",
53-
"stream": "^0.0.2",
54-
"stream-browserify": "^3.0.0",
55-
"stream-http": "^3.2.0",
56-
"styled-jsx": "^5.1.2",
5743
"use-image": "^1.1.1",
58-
"util": "^0.12.5",
5944
"zod": "^3.22.4"
6045
},
6146
"devDependencies": {
6247
"@babel/core": "^7.22.9",
48+
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
6349
"@babel/preset-env": "^7.23.3",
6450
"@babel/preset-react": "^7.22.5",
6551
"@babel/preset-typescript": "^7.22.5",
6652
"@babel/register": "^7.22.15",
6753
"@thesis-co/eslint-config": "^0.5.0",
6854
"@thesis/prettier-config": "github:thesis/prettier-config",
6955
"@types/dotenv-webpack": "^7.0.4",
70-
"@types/raf-schd": "^4.0.1",
7156
"@types/react": "^18.2.14",
7257
"@types/react-dom": "^18.2.6",
7358
"@types/react-router-dom": "^5",
59+
"assert": "^2.0.0",
7460
"babel-loader": "^9.1.3",
61+
"babel-plugin-styled-components": "^2.1.4",
62+
"babel-plugin-transform-remove-console": "^6.9.4",
63+
"buffer": "^6.0.3",
7564
"copy-webpack-plugin": "^11.0.0",
65+
"crypto-browserify": "^3.12.0",
7666
"dotenv-defaults": "^5.0.2",
7767
"dotenv-webpack": "^8.0.1",
7868
"eslint": "^8.44.0",
69+
"eslint-plugin-unused-imports": "^3.0.0",
7970
"fork-ts-checker-webpack-plugin": "^8.0.0",
8071
"html-webpack-plugin": "^5.5.3",
72+
"https-browserify": "^1.0.0",
73+
"os-browserify": "^0.3.0",
74+
"patch-package": "^8.0.0",
75+
"path-browserify": "^1.0.1",
8176
"prettier": "^2.8.1",
77+
"process": "^0.11.10",
78+
"stream-browserify": "^3.0.0",
79+
"stream-http": "^3.2.0",
80+
"styled-jsx": "^5.1.2",
8281
"typescript": "^5.0.2",
82+
"util": "^0.12.5",
8383
"webpack": "^5.88.1",
84+
"webpack-bundle-analyzer": "^4.10.1",
8485
"webpack-cli": "^5.1.4",
8586
"webpack-dev-server": "^4.15.1",
8687
"webpack-merge": "^5.7.3"

‎src/App.tsx‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import React from "react"
2+
import { Web3OnboardProvider } from "@web3-onboard/react"
3+
import { Provider } from "react-redux"
4+
import web3Onboard from "shared/utils/web3Onboard"
5+
import { PostHogProvider } from "posthog-js/react"
6+
import { BrowserRouter as Router } from "react-router-dom"
7+
import GlobalStyles from "ui/GlobalStyles"
8+
import { POSTHOG_API_KEY, POSTHOG_API_OPTIONS } from "config/posthog"
9+
import Dapp from "ui/DApp/Dapp"
10+
import reduxStore from "./redux-state"
11+
12+
export default function App() {
13+
console.log("### App rendering")
14+
return (
15+
<>
16+
<GlobalStyles />
17+
<PostHogProvider apiKey={POSTHOG_API_KEY} options={POSTHOG_API_OPTIONS}>
18+
<Provider store={reduxStore}>
19+
<Web3OnboardProvider web3Onboard={web3Onboard}>
20+
<Router>
21+
<Dapp />
22+
</Router>
23+
</Web3OnboardProvider>
24+
</Provider>
25+
</PostHogProvider>
26+
</>
27+
)
28+
}

‎src/config/posthog.ts‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import { PostHogConfig } from "posthog-js"
2+
3+
export const { POSTHOG_API_KEY } = process.env
4+
5+
export const POSTHOG_API_OPTIONS: Partial<PostHogConfig> = {
6+
persistence: "localStorage",
7+
autocapture: false,
8+
capture_pageview: false,
9+
disable_session_recording: true,
10+
sanitize_properties(properties) {
11+
return {
12+
...properties,
13+
// The extension has set an expectation that the lib is set to
14+
// the analytics env.
15+
$lib: process.env.ANALYTICS_ENV,
16+
}
17+
},
18+
}

‎src/env.d.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,13 @@ declare module "*.mp4" {
3030
export = value
3131
}
3232

33+
declare module "*.webm" {
34+
const value: string
35+
export = value
36+
}
37+
38+
declare module "webpack-bundle-analyzer"
39+
3340
declare namespace NodeJS {
3441
interface ProcessEnv {
3542
NODE_ENV: "production" | "development" | "test"

‎src/index.tsx‎

Lines changed: 5 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,52 +1,16 @@
11
import React from "react"
2-
import ReactDOM from "react-dom/client"
3-
import { Web3OnboardProvider } from "@web3-onboard/react"
4-
import { Provider } from "react-redux"
5-
import web3Onboard from "shared/utils/web3Onboard"
6-
import { PostHogProvider } from "posthog-js/react"
7-
import { BrowserRouter as Router } from "react-router-dom"
8-
import DApp from "ui/DApps"
9-
import reduxStore from "./redux-state"
10-
11-
function DAppProviders() {
12-
return (
13-
<Provider store={reduxStore}>
14-
<Web3OnboardProvider web3Onboard={web3Onboard}>
15-
<PostHogProvider
16-
apiKey={process.env.POSTHOG_API_KEY}
17-
options={{
18-
persistence: "localStorage",
19-
autocapture: false,
20-
capture_pageview: false,
21-
disable_session_recording: true,
22-
sanitize_properties(properties) {
23-
return {
24-
...properties,
25-
// The extension has set an expectation that the lib is set to
26-
// the analytics env.
27-
$lib: process.env.ANALYTICS_ENV,
28-
}
29-
},
30-
}}
31-
>
32-
<Router>
33-
<DApp />
34-
</Router>
35-
</PostHogProvider>
36-
</Web3OnboardProvider>
37-
</Provider>
38-
)
39-
}
2+
import { createRoot } from "react-dom/client"
3+
import App from "./App"
404

415
const root = document.getElementById("root")
426

437
if (root) {
448
if (process.env.SKIP_REACT_STRICT_MODE === "true") {
45-
ReactDOM.createRoot(root).render(<DAppProviders />)
9+
createRoot(root).render(<App />)
4610
} else {
47-
ReactDOM.createRoot(root).render(
11+
createRoot(root).render(
4812
<React.StrictMode>
49-
<DAppProviders />
13+
<App />
5014
</React.StrictMode>
5115
)
5216
}

‎src/public/index.html‎

Lines changed: 13 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,20 @@
33
<head>
44
<meta charset="UTF-8" />
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<meta name="description" content="Enter the Subscape!">
67
<title>Subscape</title>
8+
<style>
9+
body {
10+
background: #142D2B;
11+
}
12+
</style>
13+
<link rel="preconnect" href="https://networkcheck.reflect-server.net" />
14+
<link rel="preconnect" href="https://rpc.tenderly.co" />
15+
<link rel="preconnect" href="https://track.customer.io" />
16+
<link rel="preconnect" href="https://featureflags.netlify.com" />
17+
</head>
18+
<body>
19+
<div id="root"></div>
720
<!-- Script for sending data to customer.io -->
821
<script type="text/javascript">
922
var _cio = _cio || [];
@@ -21,13 +34,5 @@
2134
})();
2235
</script>
2336
<!-- Script for sending data to customer.io -->
24-
<style>
25-
body {
26-
background: #142D2B;
27-
}
28-
</style>
29-
</head>
30-
<body>
31-
<div id="root"></div>
3237
</body>
3338
</html>

‎src/redux-state/slices/wallet.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { createSlice } from "@reduxjs/toolkit"
2-
import portrait from "shared/assets/portrait.png"
2+
import portrait from "shared/assets/portrait.webp"
33
import { ETH_ADDRESS, TAHO_ADDRESS } from "shared/constants"
44
import { TokenBalances, TransactionProgressStatus } from "shared/types"
55
import { getAllowanceTransactionID } from "shared/utils"

0 commit comments

Comments
 (0)