Use preact instead of react, reducing bundle size for >100KB

Signed-off-by: Egor Savkin <es@m-labs.hk>

package-lock.json

@@ -19,6 +19,7 @@
         "bootstrap": "^5.3.0",
         "jquery": "^3.7.0",
         "json-logic-js": "^2.0.2",
+        "preact": "^10.19.3",
         "prop-types": "^15.8.1",
         "react": "^18.2.0",
         "react-bootstrap": "^2.9.1",
@@ -3992,6 +3993,16 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/preact": {
+      "version": "10.19.3",
+      "resolved": "https://registry.npmjs.org/preact/-/preact-10.19.3.tgz",
+      "integrity": "sha512-nHHTeFVBTHRGxJXKkKu5hT8C/YWBkPso4/Gad6xuj5dbptt9iF9NZr9pHbPhBrnT2klheu7mHTxTZ/LjwJiEiQ==",
+      "dev": true,
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/preact"
+      }
+    },
     "node_modules/prop-types": {
       "version": "15.8.1",
       "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",

package.json

@@ -32,7 +32,8 @@
     "json-logic-js": "^2.0.2",
     "zustand": "^4.4.7",
     "@uidotdev/usehooks":"^2.4.1",
-    "webpack-preprocessor-loader": "^1.3.0"
+    "webpack-preprocessor-loader": "^1.3.0",
+    "preact": "^10.19.3"
   },
   "babel": {
     "presets": [

webpack.config.js

@@ -36,6 +36,12 @@ module.exports = {
     },
     resolve: {
         extensions: ['.tsx', '.ts', '.js', '.jsx'],
+        "alias": {
+            "react": "preact/compat",
+            "react-dom/test-utils": "preact/test-utils",
+            "react-dom": "preact/compat",     // Must be below test-utils
+            "react/jsx-runtime": "preact/jsx-runtime"
+        },
     },
     //devtool: "inline-source-map",
     //mode: "development"