Improve SEO in nginx.conf, index.html; update favicon and logos; embedded card now supported; Dockerfile slimmed and modernized

webpack.config.ts

@@ -7,6 +7,8 @@ import ForkTsCheckerWebpackPlugin from "fork-ts-checker-webpack-plugin";
 import TerserPlugin from "terser-webpack-plugin";
 import {Options as MDXOptions} from '@mdx-js/loader';
 import "webpack-dev-server";
+import CopyWebpackPlugin from "copy-webpack-plugin";
+import ImageMinimizerPlugin, {type CustomOptions, Minimizer} from "image-minimizer-webpack-plugin";
 
 const isProduction = process.env.NODE_ENV === "production";
 
@@ -15,7 +17,21 @@ const config: webpack.Configuration = {
   entry: "./src/index.tsx",
   optimization: {
     minimize: isProduction,
-    minimizer: [new TerserPlugin()]
+    minimizer: [
+      new TerserPlugin(),
+      // use Sharp lossless image compression
+      new ImageMinimizerPlugin({
+        minimizer: {
+          implementation: ImageMinimizerPlugin.sharpMinify,
+          options: {
+            encodeOptions: {
+              jpeg: { quality: 80 },
+              png: { compressionLevel: 8 }
+            }
+          },
+        } as Minimizer<CustomOptions>
+      })
+    ]
   },
   output: {
     path: path.resolve(import.meta.dirname, "build"),
@@ -51,9 +67,13 @@ const config: webpack.Configuration = {
                 loader: "@svgr/webpack",
                 options: {
                   prettier: false,
-                  svgo: false,
+                  svgo: true,
                   svgoConfig: {
-                    plugins: [{ removeViewBox: false }],
+                    multipass: true,
+                    plugins: [
+                      'preset-default',
+                      'prefixIds'
+                    ],
                   },
                   titleProp: true,
                   ref: true,
@@ -140,7 +160,18 @@ const config: webpack.Configuration = {
     new HtmlWebpackPlugin({
       template: path.resolve(import.meta.dirname, "public/index.html"),
       favicon: path.resolve(import.meta.dirname, "src/img/favicon.ico"),
-      inject: true,
+      inject: true
+    }),
+    // copy public files to build dir
+    new CopyWebpackPlugin({
+      patterns: [
+        {
+          from: 'public',
+          to: '.',
+          // html file is handled by HtmlWebpackPlugin
+          globOptions: { ignore: ['**/index.html'] }
+        }
+      ]
     }),
     new webpack.DefinePlugin({
       "process.env": JSON.stringify(process.env),
@@ -165,4 +196,4 @@ const config: webpack.Configuration = {
   },
 };
 
-export default config;
+export default config;