From 07524d58dfc18cd151198777289b6ccaa4239039 Mon Sep 17 00:00:00 2001 From: Russell Dempsey <1173416+SgtPooki@users.noreply.github.com> Date: Wed, 5 Jun 2024 10:37:48 -0700 Subject: [PATCH 1/5] fix: add purgecss webpack plugin --- package-lock.json | 38 ++++++++++++++++++++++++++++++++++++++ package.json | 1 + webpack.config.js | 5 +++++ 3 files changed, 44 insertions(+) diff --git a/package-lock.json b/package-lock.json index d743c414..f65317f7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -45,6 +45,7 @@ "npm-run-all": "^4.1.5", "patch-package": "^8.0.0", "playwright": "^1.43.1", + "purgecss-webpack-plugin": "^6.0.0", "rimraf": "^5.0.5", "style-loader": "^3.3.4", "terser-webpack-plugin": "^5.3.10", @@ -25278,6 +25279,43 @@ "node": ">=6" } }, + "node_modules/purgecss": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/purgecss/-/purgecss-6.0.0.tgz", + "integrity": "sha512-s3EBxg5RSWmpqd0KGzNqPiaBbWDz1/As+2MzoYVGMqgDqRTLBhJW6sywfTBek7OwNfoS/6pS0xdtvChNhFj2cw==", + "dev": true, + "dependencies": { + "commander": "^12.0.0", + "glob": "^10.3.10", + "postcss": "^8.4.4", + "postcss-selector-parser": "^6.0.7" + }, + "bin": { + "purgecss": "bin/purgecss.js" + } + }, + "node_modules/purgecss-webpack-plugin": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/purgecss-webpack-plugin/-/purgecss-webpack-plugin-6.0.0.tgz", + "integrity": "sha512-Y96Tt3w0LhNUbd/xVbSQAMqdz9RtwOJ3A+OeVnqJzzkab7qzqSh537ym36JOtr7WVNev9LXHbXZUxCGJROrKgw==", + "dev": true, + "dependencies": { + "purgecss": "^6.0.0", + "webpack": ">=5.0.0" + }, + "peerDependencies": { + "webpack": ">=5.0.0" + } + }, + "node_modules/purgecss/node_modules/commander": { + "version": "12.1.0", + "resolved": "https://registry.npmjs.org/commander/-/commander-12.1.0.tgz", + "integrity": "sha512-Vw8qHK3bZM9y/P10u3Vib8o/DdkvA2OtPtZvD871QKjy74Wj1WSKFILMPRPSdUSx5RFK1arlJzEtA4PkFgnbuA==", + "dev": true, + "engines": { + "node": ">=18" + } + }, "node_modules/pvtsutils": { "version": "1.3.5", "resolved": "https://registry.npmjs.org/pvtsutils/-/pvtsutils-1.3.5.tgz", diff --git a/package.json b/package.json index 6532bd82..e5c16f91 100644 --- a/package.json +++ b/package.json @@ -78,6 +78,7 @@ "npm-run-all": "^4.1.5", "patch-package": "^8.0.0", "playwright": "^1.43.1", + "purgecss-webpack-plugin": "^6.0.0", "rimraf": "^5.0.5", "style-loader": "^3.3.4", "terser-webpack-plugin": "^5.3.10", diff --git a/webpack.config.js b/webpack.config.js index eb751fcd..7846344b 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -2,8 +2,10 @@ import { execSync } from 'child_process' import path from 'node:path' import { fileURLToPath } from 'node:url' import CopyWebpackPlugin from 'copy-webpack-plugin' +import { sync as globSync } from 'glob' import HtmlWebpackPlugin from 'html-webpack-plugin' import MiniCssExtractPlugin from 'mini-css-extract-plugin' +import { PurgeCSSPlugin } from 'purgecss-webpack-plugin' import TerserPlugin from 'terser-webpack-plugin' import webpack from 'webpack' import BundleAnalyzerPlugin from 'webpack-bundle-analyzer' @@ -234,6 +236,9 @@ const common = { new MiniCssExtractPlugin({ filename: 'ipfs-sw-[name]-[contenthash].css', chunkFilename: 'ipfs-sw-[id]-[contenthash].css' + }), + new PurgeCSSPlugin({ + paths: globSync(`${paths.distTsc}/**/*`, { nodir: true }) }) ], From 747016cc59ece3c37e4fdcd58c3d0a8fc7b9269d Mon Sep 17 00:00:00 2001 From: Russell Dempsey <1173416+SgtPooki@users.noreply.github.com> Date: Wed, 5 Jun 2024 11:09:41 -0700 Subject: [PATCH 2/5] fix: keep only woff2 font, remove purgeCss --- package-lock.json | 38 -------------------------------------- package.json | 1 - webpack.config.js | 7 +------ 3 files changed, 1 insertion(+), 45 deletions(-) diff --git a/package-lock.json b/package-lock.json index f65317f7..d743c414 100644 --- a/package-lock.json +++ b/package-lock.json @@ -45,7 +45,6 @@ "npm-run-all": "^4.1.5", "patch-package": "^8.0.0", "playwright": "^1.43.1", - "purgecss-webpack-plugin": "^6.0.0", "rimraf": "^5.0.5", "style-loader": "^3.3.4", "terser-webpack-plugin": "^5.3.10", @@ -25279,43 +25278,6 @@ "node": ">=6" } }, - "node_modules/purgecss": { - "version": "6.0.0", - "resolved": "https://registry.npmjs.org/purgecss/-/purgecss-6.0.0.tgz", - "integrity": "sha512-s3EBxg5RSWmpqd0KGzNqPiaBbWDz1/As+2MzoYVGMqgDqRTLBhJW6sywfTBek7OwNfoS/6pS0xdtvChNhFj2cw==", - "dev": true, - "dependencies": { - "commander": "^12.0.0", - "glob": "^10.3.10", - "postcss": "^8.4.4", - "postcss-selector-parser": "^6.0.7" - }, - "bin": { - "purgecss": "bin/purgecss.js" - } - }, - "node_modules/purgecss-webpack-plugin": { - "version": "6.0.0", - "resolved": "https://registry.npmjs.org/purgecss-webpack-plugin/-/purgecss-webpack-plugin-6.0.0.tgz", - "integrity": "sha512-Y96Tt3w0LhNUbd/xVbSQAMqdz9RtwOJ3A+OeVnqJzzkab7qzqSh537ym36JOtr7WVNev9LXHbXZUxCGJROrKgw==", - "dev": true, - "dependencies": { - "purgecss": "^6.0.0", - "webpack": ">=5.0.0" - }, - "peerDependencies": { - "webpack": ">=5.0.0" - } - }, - "node_modules/purgecss/node_modules/commander": { - "version": "12.1.0", - "resolved": "https://registry.npmjs.org/commander/-/commander-12.1.0.tgz", - "integrity": "sha512-Vw8qHK3bZM9y/P10u3Vib8o/DdkvA2OtPtZvD871QKjy74Wj1WSKFILMPRPSdUSx5RFK1arlJzEtA4PkFgnbuA==", - "dev": true, - "engines": { - "node": ">=18" - } - }, "node_modules/pvtsutils": { "version": "1.3.5", "resolved": "https://registry.npmjs.org/pvtsutils/-/pvtsutils-1.3.5.tgz", diff --git a/package.json b/package.json index e5c16f91..6532bd82 100644 --- a/package.json +++ b/package.json @@ -78,7 +78,6 @@ "npm-run-all": "^4.1.5", "patch-package": "^8.0.0", "playwright": "^1.43.1", - "purgecss-webpack-plugin": "^6.0.0", "rimraf": "^5.0.5", "style-loader": "^3.3.4", "terser-webpack-plugin": "^5.3.10", diff --git a/webpack.config.js b/webpack.config.js index 7846344b..024791c1 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -2,10 +2,8 @@ import { execSync } from 'child_process' import path from 'node:path' import { fileURLToPath } from 'node:url' import CopyWebpackPlugin from 'copy-webpack-plugin' -import { sync as globSync } from 'glob' import HtmlWebpackPlugin from 'html-webpack-plugin' import MiniCssExtractPlugin from 'mini-css-extract-plugin' -import { PurgeCSSPlugin } from 'purgecss-webpack-plugin' import TerserPlugin from 'terser-webpack-plugin' import webpack from 'webpack' import BundleAnalyzerPlugin from 'webpack-bundle-analyzer' @@ -236,9 +234,6 @@ const common = { new MiniCssExtractPlugin({ filename: 'ipfs-sw-[name]-[contenthash].css', chunkFilename: 'ipfs-sw-[id]-[contenthash].css' - }), - new PurgeCSSPlugin({ - paths: globSync(`${paths.distTsc}/**/*`, { nodir: true }) }) ], @@ -272,7 +267,7 @@ const common = { { test: /\.(?:ico|gif|png|jpg|jpeg)$/i, type: 'asset/resource' }, // Fonts and SVGs: Inline files - { test: /\.(woff(2)?|eot|ttf|otf|svg|)$/, type: 'asset/inline' }, + { test: /\.(woff2|svg|)$/, type: 'asset/inline' }, { test: /\.(sa|sc|c)ss$/i, use: [ From 273afc88b48d80a73fca7ba405e2e893fb7bcb0c Mon Sep 17 00:00:00 2001 From: Daniel N <2color@users.noreply.github.com> Date: Tue, 11 Jun 2024 13:25:53 +0200 Subject: [PATCH 3/5] chore: don't inline source maps in prod builds --- webpack.config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/webpack.config.js b/webpack.config.js index 024791c1..74bf1e40 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -60,7 +60,7 @@ const paths = { */ const prod = { mode: 'production', - devtool: 'inline-source-map', + devtool: 'source-map', performance: { hints: false, maxEntrypointSize: 512000, From ca3532362db5eadc26a8f7a3466abd1a3c3d37d8 Mon Sep 17 00:00:00 2001 From: Daniel N <2color@users.noreply.github.com> Date: Tue, 11 Jun 2024 13:44:45 +0200 Subject: [PATCH 4/5] chore: do not inline any fonts --- webpack.config.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/webpack.config.js b/webpack.config.js index 74bf1e40..092769df 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -266,8 +266,8 @@ const common = { // Images: Copy image files to build folder { test: /\.(?:ico|gif|png|jpg|jpeg)$/i, type: 'asset/resource' }, - // Fonts and SVGs: Inline files - { test: /\.(woff2|svg|)$/, type: 'asset/inline' }, + // Inline SVGs + { test: /\.(svg|)$/, type: 'asset/inline' }, { test: /\.(sa|sc|c)ss$/i, use: [ From 2044c77c70db1d44d9393a9017d8b3a2fe7717bf Mon Sep 17 00:00:00 2001 From: Daniel N <2color@users.noreply.github.com> Date: Tue, 11 Jun 2024 17:55:41 +0200 Subject: [PATCH 5/5] ci: add lighthouse checks into build --- .github/workflows/main.yml | 14 ++++++++++++++ .gitignore | 1 + .lighthouserc.json | 23 +++++++++++++++++++++++ 3 files changed, 38 insertions(+) create mode 100644 .lighthouserc.json diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml index c7f6fe10..0be8708b 100644 --- a/.github/workflows/main.yml +++ b/.github/workflows/main.yml @@ -37,6 +37,20 @@ jobs: - run: npm run --if-present dep-check - run: npm run --if-present doc-check + lighthouse: + needs: build + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v3 + - uses: actions/setup-node@v3 + with: + node-version: 18 + - run: npm install && npm install -g @lhci/cli@0.13.x + - run: lhci autorun + env: + LHCI_GITHUB_APP_TOKEN: ${{ secrets.LHCI_GITHUB_APP_TOKEN }} + + test-node: needs: build runs-on: ${{ matrix.os }} diff --git a/.gitignore b/.gitignore index ffd04799..4e4279db 100644 --- a/.gitignore +++ b/.gitignore @@ -226,3 +226,4 @@ playwright-report .coverage test-e2e/fixtures/data/test-repo test-e2e/fixtures/data/gateway-conformance-fixtures +.lighthouseci diff --git a/.lighthouserc.json b/.lighthouserc.json new file mode 100644 index 00000000..a48fb7a3 --- /dev/null +++ b/.lighthouserc.json @@ -0,0 +1,23 @@ +{ + "ci": { + "collect": { + "staticDistDir": "./dist" + }, + "assert": { + "preset": "lighthouse:no-pwa", + "assertions": { + "color-contrast": "off", + "csp-xss": "off", + "font-display": "off", + "is-crawlable": "off", + "link-text": "off", + "maskable-icon": "off", + "splash-screen": "off", + "themed-omnibox": "off", + "total-byte-weight": "off", + "first-meaningful-paint": "off", + "unused-css-rules": "off" + } + } + } +}