From b113a6c92b88431709b6fe0d3e3983bae33930fe Mon Sep 17 00:00:00 2001
From: Laurent Knoll <laurent.knoll@orange.com>
Date: Tue, 18 Oct 2022 17:54:00 +0200
Subject: [PATCH] Optimisation (bof bof) du packaging. Optimisation des
imports.
---
package-lock.json | 1 +
package.json | 3 +-
src/assets/images/here.svg | 16 +-----
src/bootstrap.scss | 53 ++++++++++++++++++++
src/data/coords/coords.tsx | 1 -
src/data/coords/transform/toEllipseFitter.ts | 2 +-
src/data/coords/transform/transformation.ts | 1 -
src/data/coords/vectorCoords.ts | 1 -
src/index.tsx | 20 ++++----
src/instruments/blobMask.ts | 3 ++
src/instruments/instrument.ts | 3 +-
src/lab.scss | 6 ++-
src/lab.tsx | 1 -
src/ui/steps/stepManager.tsx | 2 +-
webpack.common.js | 10 ++--
webpack.production.js | 5 ++
16 files changed, 87 insertions(+), 41 deletions(-)
create mode 100644 src/bootstrap.scss
diff --git a/package-lock.json b/package-lock.json
index 187b3b8..1b1fa08 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -46,6 +46,7 @@
"sass-loader": "^13.1.0",
"style-loader": "^2.0.0",
"svg-inline-loader": "^0.8.2",
+ "terser-webpack-plugin": "^5.3.6",
"ts-loader": "^9.2.6",
"ts-node": "^10.7.0",
"typescript": "^4.8.2",
diff --git a/package.json b/package.json
index 96958c8..a55a109 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
{
"name": "@verdi8/blob-analysis-lab-demo",
"version": "1.0.0",
- "description": "Un projet temporaire qick'n'dirty de démo d'analyse de photos de blobs",
+ "description": "Un projet éphémère d'analyse de photos de blobs",
"private": true,
"scripts": {
"serve": "webpack serve --open --config webpack.staging.js",
@@ -48,6 +48,7 @@
"sass-loader": "^13.1.0",
"style-loader": "^2.0.0",
"svg-inline-loader": "^0.8.2",
+ "terser-webpack-plugin": "^5.3.6",
"ts-loader": "^9.2.6",
"ts-node": "^10.7.0",
"typescript": "^4.8.2",
diff --git a/src/assets/images/here.svg b/src/assets/images/here.svg
index 274305f..89a04e9 100644
--- a/src/assets/images/here.svg
+++ b/src/assets/images/here.svg
@@ -1,18 +1,6 @@
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 131.05070243472312 88.27716039866368">
- <!-- svg-source:excalidraw -->
+ <!-- arrow by excalidraw -->
- <defs>
- <style>
- @font-face {
- font-family: "Virgil";
- src: url("https://excalidraw.com/Virgil.woff2");
- }
- @font-face {
- font-family: "Cascadia";
- src: url("https://excalidraw.com/Cascadia.woff2");
- }
- </style>
- </defs>
<rect x="0" y="0" width="131.05070243472312" height="88.27716039866368" fill="none"></rect>
<g stroke-linecap="round">
<g transform="translate(44.48445506720407 42.18917581060259) rotate(0 36.96977789509731 -15.50219226513667)">
@@ -29,7 +17,7 @@
</g>
</g>
<g transform="translate(10 52.27716039866368) rotate(0 34.5 13)">
- <text x="34.5" y="19" font-family="Virgil, Segoe UI Emoji" font-size="20px" text-anchor="middle" fill="black"
+ <text x="34.5" y="19" font-family="Indie Flower" font-size="20px" text-anchor="middle" fill="black"
style="white-space: pre;" direction="ltr">départ
</text>
</g>
diff --git a/src/bootstrap.scss b/src/bootstrap.scss
new file mode 100644
index 0000000..190b850
--- /dev/null
+++ b/src/bootstrap.scss
@@ -0,0 +1,53 @@
+// Optimisation de bootstrap : voir https://getbootstrap.com/docs/5.2/customize/optimize/
+
+@import "~bootstrap/scss/mixins/banner";
+@include bsBanner("");
+
+// scss-docs-start import-stack
+// Configuration
+@import "~bootstrap/scss/functions";
+@import "~bootstrap/scss/variables";
+@import "~bootstrap/scss/maps";
+@import "~bootstrap/scss/mixins";
+@import "~bootstrap/scss/utilities";
+
+
+// Layout & components
+@import "~bootstrap/scss/root";
+@import "~bootstrap/scss/reboot";
+@import "~bootstrap/scss/type";
+@import "~bootstrap/scss/images";
+@import "~bootstrap/scss/containers";
+@import "~bootstrap/scss/grid";
+//@import "~bootstrap/scss/tables";
+@import "~bootstrap/scss/forms";
+@import "~bootstrap/scss/buttons";
+@import "~bootstrap/scss/transitions";
+@import "~bootstrap/scss/dropdown";
+@import "~bootstrap/scss/button-group";
+@import "~bootstrap/scss/nav";
+@import "~bootstrap/scss/navbar";
+//@import "~bootstrap/scss/card";
+@import "~bootstrap/scss/accordion";
+//@import "~bootstrap/scss/breadcrumb";
+//@import "~bootstrap/scss/pagination";
+@import "~bootstrap/scss/badge";
+@import "~bootstrap/scss/alert";
+//@import "~bootstrap/scss/progress";
+@import "~bootstrap/scss/list-group";
+//@import "~bootstrap/scss/close";
+//@import "~bootstrap/scss/toasts";
+@import "~bootstrap/scss/modal";
+//@import "~bootstrap/scss/tooltip";
+//@import "~bootstrap/scss/popover";
+//@import "~bootstrap/scss/carousel";
+@import "~bootstrap/scss/spinners";
+//@import "~bootstrap/scss/offcanvas";
+@import "~bootstrap/scss/placeholders";
+
+// Helpers
+@import "~bootstrap/scss/helpers";
+
+// Utilities
+@import "~bootstrap/scss/utilities/api";
+// scss-docs-end import-stack
diff --git a/src/data/coords/coords.tsx b/src/data/coords/coords.tsx
index 4169b90..e387a32 100644
--- a/src/data/coords/coords.tsx
+++ b/src/data/coords/coords.tsx
@@ -1,5 +1,4 @@
import * as paper from "paper";
-import {PathCoords} from "./pathCoords";
/**
diff --git a/src/data/coords/transform/toEllipseFitter.ts b/src/data/coords/transform/toEllipseFitter.ts
index 62f08d1..f6e6de9 100644
--- a/src/data/coords/transform/toEllipseFitter.ts
+++ b/src/data/coords/transform/toEllipseFitter.ts
@@ -5,10 +5,10 @@ import {EllipseCoords} from "../ellipseCoords";
import {Coords} from "../coords";
import * as paper from "paper";
import {types} from "sass";
-import Color = types.Color;
import {Transformation} from "./transformation";
import {PathCoords} from "../pathCoords";
import {ImageDataWrapper} from "../../../render/ImageDataWrapper";
+
const HALFPI : number= 1.5707963267949;
/**
diff --git a/src/data/coords/transform/transformation.ts b/src/data/coords/transform/transformation.ts
index 9531036..ec74850 100644
--- a/src/data/coords/transform/transformation.ts
+++ b/src/data/coords/transform/transformation.ts
@@ -1,4 +1,3 @@
-
import {Coords} from "../coords";
/**
diff --git a/src/data/coords/vectorCoords.ts b/src/data/coords/vectorCoords.ts
index 40025b1..c04540d 100644
--- a/src/data/coords/vectorCoords.ts
+++ b/src/data/coords/vectorCoords.ts
@@ -1,4 +1,3 @@
-
import * as paper from "paper";
import {Coords} from "./coords";
diff --git a/src/index.tsx b/src/index.tsx
index c2d1eeb..8311ebe 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,25 +1,23 @@
-
import "./lab.scss"
// Init de font-awesome
// Voir https://fontawesome.com/v6/docs/apis/javascript/methods#dom-i2svg-params
-import { dom, library } from '@fortawesome/fontawesome-svg-core';
-import { fas } from '@fortawesome/free-solid-svg-icons';
-import { far } from '@fortawesome/free-regular-svg-icons';
+import {dom, library} from '@fortawesome/fontawesome-svg-core';
+import {fas} from '@fortawesome/free-solid-svg-icons';
+import {far} from '@fortawesome/free-regular-svg-icons';
+// Init de paper.js
+import * as paper from "paper";
+import * as ReactDOM from 'react-dom';
+import * as React from 'react';
+import {Lab} from './lab';
+
library.add(fas, far);
dom.i2svg();
dom.watch();
-// Init de paper.js
-import * as paper from "paper";
-
// Create an empty project and a view for the canvas:
paper.install(window);
-import * as ReactDOM from 'react-dom';
-import * as React from 'react';
-import { Lab } from './lab';
-
ReactDOM.render(
<React.StrictMode>
<Lab />
diff --git a/src/instruments/blobMask.ts b/src/instruments/blobMask.ts
index 2802750..ff696f1 100644
--- a/src/instruments/blobMask.ts
+++ b/src/instruments/blobMask.ts
@@ -119,6 +119,9 @@ export class BlobMask extends AbstractInstrument<PathCoords> implements Instrume
* Déplacement de la souris
*/
private onMouseDrag(event : paper.MouseEvent) : boolean {
+ if(event.modifiers) {
+
+ }
if(!this.active) {
return true;
}
diff --git a/src/instruments/instrument.ts b/src/instruments/instrument.ts
index bc1d9f9..ee05178 100644
--- a/src/instruments/instrument.ts
+++ b/src/instruments/instrument.ts
@@ -1,8 +1,7 @@
import * as paper from "paper";
-import {DEBUG_MODE, Lab} from "../lab";
+import {Lab} from "../lab";
import {Coords} from "../data/coords/coords";
import {PaperUtils} from "../utils/paperUtils";
-import {ToEllipseFitter} from "../data/coords/transform/toEllipseFitter";
/**
* Un instrument d'analyse
diff --git a/src/lab.scss b/src/lab.scss
index d586737..4ea8d7c 100644
--- a/src/lab.scss
+++ b/src/lab.scss
@@ -4,5 +4,7 @@
//$font-size-base: 0.9rem;
@import "~bootswatch/dist/flatly/variables";
-@import "~bootstrap/scss/bootstrap";
-@import "~bootswatch/dist/flatly/bootswatch";
\ No newline at end of file
+@import "bootstrap";
+@import "~bootswatch/dist/flatly/bootswatch";
+
+@import url("https://fonts.googleapis.com/css2?family=Indie+Flower");
diff --git a/src/lab.tsx b/src/lab.tsx
index fba2715..342dbbd 100644
--- a/src/lab.tsx
+++ b/src/lab.tsx
@@ -14,7 +14,6 @@ import {PathCoords} from "./data/coords/pathCoords";
import {DownloadStep} from "./ui/steps/downloadStep";
import {PaperUtils} from "./utils/paperUtils";
import {EllipseCoords} from "./data/coords/ellipseCoords";
-import Here from "./assets/images/here.svg";
import {Welcome} from "./ui/welcome";
/**
diff --git a/src/ui/steps/stepManager.tsx b/src/ui/steps/stepManager.tsx
index cdbff70..fd120f2 100644
--- a/src/ui/steps/stepManager.tsx
+++ b/src/ui/steps/stepManager.tsx
@@ -3,7 +3,7 @@
*/
import {Step, StepState} from "./step";
import * as React from "react";
-import {ReactElement, RefObject} from "react";
+import {ReactElement} from "react";
import {ArrayUtils} from "../../utils/arrayUtils";
import {Accordion} from "react-bootstrap";
diff --git a/webpack.common.js b/webpack.common.js
index 0ee829b..f5f2f2b 100644
--- a/webpack.common.js
+++ b/webpack.common.js
@@ -12,14 +12,14 @@ module.exports = {
use: 'ts-loader',
exclude: /node_modules/,
},
- // {
- // test: /\.svg$/,
- // use: 'svg-inline-loader?classPrefix=true'
- // },
{
test: /\.svg$/,
use: ['@svgr/webpack'],
},
+ {
+ test: /\.woff(2)?$/,
+ type: 'asset/inline',
+ },
{
test: /\.(css|scss)$/,
use: [
@@ -40,7 +40,7 @@ module.exports = {
]
},
resolve: {
- extensions: ['.css', '.js', '.ts', '.tsx']
+ extensions: ['.js', '.ts', '.tsx']
},
plugins: [
new webpackCommonJs.DefinePlugin({
diff --git a/webpack.production.js b/webpack.production.js
index d27822e..cdf1dcd 100644
--- a/webpack.production.js
+++ b/webpack.production.js
@@ -2,6 +2,7 @@
const { merge } = require('webpack-merge');
const webpack = require('webpack');
const common = require('./webpack.common');
+const TerserPlugin = require("terser-webpack-plugin");
module.exports = merge(common, {
mode: 'production',
@@ -10,6 +11,10 @@ module.exports = merge(common, {
})
],
+ optimization: {
+ minimize: true,
+ minimizer: [new TerserPlugin()],
+ },
performance: {
maxAssetSize: 3000000, // ~3Mo
maxEntrypointSize: 3000000, // ~3Mo
--
GitLab