Added code splitting for performance.

This commit is contained in:
Tom Butcher 2025-12-13 21:04:48 +00:00
parent 236f0606fd
commit 1486790292
5 changed files with 139 additions and 65 deletions

View File

@ -1,7 +1,15 @@
import { lazy } from 'react'
import { Route } from 'react-router-dom'
import SessionStorage from '../components/Dashboard/Developer/SessionStorage.jsx'
import AuthContextDebug from '../components/Dashboard/Developer/AuthContextDebug.jsx'
import ApiContextDebug from '../components/Dashboard/Developer/ApiContextDebug.jsx'
const SessionStorage = lazy(
() => import('../components/Dashboard/Developer/SessionStorage.jsx')
)
const AuthContextDebug = lazy(
() => import('../components/Dashboard/Developer/AuthContextDebug.jsx')
)
const ApiContextDebug = lazy(
() => import('../components/Dashboard/Developer/ApiContextDebug.jsx')
)
const DeveloperRoutes = [
<Route

View File

@ -1,19 +1,51 @@
import { lazy } from 'react'
import { Route } from 'react-router-dom'
import FilamentStocks from '../components/Dashboard/Inventory/FilamentStocks.jsx'
import FilamentStockInfo from '../components/Dashboard/Inventory/FilamentStocks/FilamentStockInfo.jsx'
import PartStocks from '../components/Dashboard/Inventory/PartStocks.jsx'
import PartStockInfo from '../components/Dashboard/Inventory/PartStocks/PartStockInfo.jsx'
import StockEvents from '../components/Dashboard/Inventory/StockEvents.jsx'
import StockAudits from '../components/Dashboard/Inventory/StockAudits.jsx'
import StockAuditInfo from '../components/Dashboard/Inventory/StockAudits/StockAuditInfo.jsx'
import PurchaseOrders from '../components/Dashboard/Inventory/PurchaseOrders.jsx'
import PurchaseOrderInfo from '../components/Dashboard/Inventory/PurchaseOrders/PurchaseOrderInfo.jsx'
import OrderItems from '../components/Dashboard/Inventory/OrderItems.jsx'
import OrderItemInfo from '../components/Dashboard/Inventory/OrderItems/OrderItemInfo.jsx'
import Shipments from '../components/Dashboard/Inventory/Shipments.jsx'
import ShipmentInfo from '../components/Dashboard/Inventory/Shipments/ShipmentInfo.jsx'
import InventoryOverview from '../components/Dashboard/Inventory/InventoryOverview.jsx'
const FilamentStocks = lazy(
() => import('../components/Dashboard/Inventory/FilamentStocks.jsx')
)
const FilamentStockInfo = lazy(
() =>
import('../components/Dashboard/Inventory/FilamentStocks/FilamentStockInfo.jsx')
)
const PartStocks = lazy(
() => import('../components/Dashboard/Inventory/PartStocks.jsx')
)
const PartStockInfo = lazy(
() => import('../components/Dashboard/Inventory/PartStocks/PartStockInfo.jsx')
)
const StockEvents = lazy(
() => import('../components/Dashboard/Inventory/StockEvents.jsx')
)
const StockAudits = lazy(
() => import('../components/Dashboard/Inventory/StockAudits.jsx')
)
const StockAuditInfo = lazy(
() =>
import('../components/Dashboard/Inventory/StockAudits/StockAuditInfo.jsx')
)
const PurchaseOrders = lazy(
() => import('../components/Dashboard/Inventory/PurchaseOrders.jsx')
)
const PurchaseOrderInfo = lazy(
() =>
import('../components/Dashboard/Inventory/PurchaseOrders/PurchaseOrderInfo.jsx')
)
const OrderItems = lazy(
() => import('../components/Dashboard/Inventory/OrderItems.jsx')
)
const OrderItemInfo = lazy(
() => import('../components/Dashboard/Inventory/OrderItems/OrderItemInfo.jsx')
)
const Shipments = lazy(
() => import('../components/Dashboard/Inventory/Shipments.jsx')
)
const ShipmentInfo = lazy(
() => import('../components/Dashboard/Inventory/Shipments/ShipmentInfo.jsx')
)
const InventoryOverview = lazy(
() => import('../components/Dashboard/Inventory/InventoryOverview.jsx')
)
const InventoryRoutes = [
<Route

View File

@ -1,42 +1,43 @@
import { lazy } from 'react'
import { Route } from 'react-router-dom'
import Filaments from '../components/Dashboard/Management/Filaments'
import FilamentInfo from '../components/Dashboard/Management/Filaments/FilamentInfo.jsx'
import Parts from '../components/Dashboard/Management/Parts.jsx'
import PartInfo from '../components/Dashboard/Management/Parts/PartInfo.jsx'
import Products from '../components/Dashboard/Management/Products.jsx'
import ProductInfo from '../components/Dashboard/Management/Products/ProductInfo.jsx'
import Vendors from '../components/Dashboard/Management/Vendors'
import VendorInfo from '../components/Dashboard/Management/Vendors/VendorInfo'
import Materials from '../components/Dashboard/Management/Materials'
import Couriers from '../components/Dashboard/Management/Couriers'
import CourierInfo from '../components/Dashboard/Management/Couriers/CourierInfo.jsx'
import CourierServices from '../components/Dashboard/Management/CourierServices'
import CourierServiceInfo from '../components/Dashboard/Management/CourierServices/CourierServiceInfo.jsx'
import Settings from '../components/Dashboard/Management/Settings'
import AuditLogs from '../components/Dashboard/Management/AuditLogs.jsx'
import NoteTypes from '../components/Dashboard/Management/NoteTypes.jsx'
import NoteTypeInfo from '../components/Dashboard/Management/NoteTypes/NoteTypeInfo.jsx'
import NoteInfo from '../components/Dashboard/Management/Notes/NoteInfo.jsx'
import Users from '../components/Dashboard/Management/Users.jsx'
import UserInfo from '../components/Dashboard/Management/Users/UserInfo.jsx'
import Hosts from '../components/Dashboard/Management/Hosts.jsx'
import HostInfo from '../components/Dashboard/Management/Hosts/HostInfo.jsx'
import DocumentSizes from '../components/Dashboard/Management/DocumentSizes.jsx'
import DocumentSizeInfo from '../components/Dashboard/Management/DocumentSizes/DocumentSizeInfo.jsx'
import DocumentTemplates from '../components/Dashboard/Management/DocumentTemplates.jsx'
import DocumentTemplateInfo from '../components/Dashboard/Management/DocumentTemplates/DocumentTemplateInfo.jsx'
import DocumentPrinters from '../components/Dashboard/Management/DocumentPrinters.jsx'
import DocumentPrinterInfo from '../components/Dashboard/Management/DocumentPrinters/DocumentPrinterInfo.jsx'
import DocumentJobs from '../components/Dashboard/Management/DocumentJobs.jsx'
import DocumentJobInfo from '../components/Dashboard/Management/DocumentJobs/DocumentJobInfo.jsx'
import DocumentTemplateDesign from '../components/Dashboard/Management/DocumentTemplates/DocumentTemplateDesign.jsx'
import Files from '../components/Dashboard/Management/Files.jsx'
import FileInfo from '../components/Dashboard/Management/Files/FileInfo.jsx'
import TaxRates from '../components/Dashboard/Management/TaxRates.jsx'
import TaxRateInfo from '../components/Dashboard/Management/TaxRates/TaxRateInfo.jsx'
import TaxRecords from '../components/Dashboard/Management/TaxRecords.jsx'
import TaxRecordInfo from '../components/Dashboard/Management/TaxRecords/TaxRecordInfo.jsx'
const Filaments = lazy(() => import('../components/Dashboard/Management/Filaments'))
const FilamentInfo = lazy(() => import('../components/Dashboard/Management/Filaments/FilamentInfo.jsx'))
const Parts = lazy(() => import('../components/Dashboard/Management/Parts.jsx'))
const PartInfo = lazy(() => import('../components/Dashboard/Management/Parts/PartInfo.jsx'))
const Products = lazy(() => import('../components/Dashboard/Management/Products.jsx'))
const ProductInfo = lazy(() => import('../components/Dashboard/Management/Products/ProductInfo.jsx'))
const Vendors = lazy(() => import('../components/Dashboard/Management/Vendors'))
const VendorInfo = lazy(() => import('../components/Dashboard/Management/Vendors/VendorInfo'))
const Materials = lazy(() => import('../components/Dashboard/Management/Materials'))
const Couriers = lazy(() => import('../components/Dashboard/Management/Couriers'))
const CourierInfo = lazy(() => import('../components/Dashboard/Management/Couriers/CourierInfo.jsx'))
const CourierServices = lazy(() => import('../components/Dashboard/Management/CourierServices'))
const CourierServiceInfo = lazy(() => import('../components/Dashboard/Management/CourierServices/CourierServiceInfo.jsx'))
const Settings = lazy(() => import('../components/Dashboard/Management/Settings'))
const AuditLogs = lazy(() => import('../components/Dashboard/Management/AuditLogs.jsx'))
const NoteTypes = lazy(() => import('../components/Dashboard/Management/NoteTypes.jsx'))
const NoteTypeInfo = lazy(() => import('../components/Dashboard/Management/NoteTypes/NoteTypeInfo.jsx'))
const NoteInfo = lazy(() => import('../components/Dashboard/Management/Notes/NoteInfo.jsx'))
const Users = lazy(() => import('../components/Dashboard/Management/Users.jsx'))
const UserInfo = lazy(() => import('../components/Dashboard/Management/Users/UserInfo.jsx'))
const Hosts = lazy(() => import('../components/Dashboard/Management/Hosts.jsx'))
const HostInfo = lazy(() => import('../components/Dashboard/Management/Hosts/HostInfo.jsx'))
const DocumentSizes = lazy(() => import('../components/Dashboard/Management/DocumentSizes.jsx'))
const DocumentSizeInfo = lazy(() => import('../components/Dashboard/Management/DocumentSizes/DocumentSizeInfo.jsx'))
const DocumentTemplates = lazy(() => import('../components/Dashboard/Management/DocumentTemplates.jsx'))
const DocumentTemplateInfo = lazy(() => import('../components/Dashboard/Management/DocumentTemplates/DocumentTemplateInfo.jsx'))
const DocumentPrinters = lazy(() => import('../components/Dashboard/Management/DocumentPrinters.jsx'))
const DocumentPrinterInfo = lazy(() => import('../components/Dashboard/Management/DocumentPrinters/DocumentPrinterInfo.jsx'))
const DocumentJobs = lazy(() => import('../components/Dashboard/Management/DocumentJobs.jsx'))
const DocumentJobInfo = lazy(() => import('../components/Dashboard/Management/DocumentJobs/DocumentJobInfo.jsx'))
const DocumentTemplateDesign = lazy(() => import('../components/Dashboard/Management/DocumentTemplates/DocumentTemplateDesign.jsx'))
const Files = lazy(() => import('../components/Dashboard/Management/Files.jsx'))
const FileInfo = lazy(() => import('../components/Dashboard/Management/Files/FileInfo.jsx'))
const TaxRates = lazy(() => import('../components/Dashboard/Management/TaxRates.jsx'))
const TaxRateInfo = lazy(() => import('../components/Dashboard/Management/TaxRates/TaxRateInfo.jsx'))
const TaxRecords = lazy(() => import('../components/Dashboard/Management/TaxRecords.jsx'))
const TaxRecordInfo = lazy(() => import('../components/Dashboard/Management/TaxRecords/TaxRecordInfo.jsx'))
const ManagementRoutes = [
<Route key='filaments' path='management/filaments' element={<Filaments />} />,

View File

@ -1,15 +1,35 @@
import { lazy } from 'react'
import { Route } from 'react-router-dom'
import ProductionOverview from '../components/Dashboard/Production/ProductionOverview'
import Printers from '../components/Dashboard/Production/Printers'
import ControlPrinter from '../components/Dashboard/Production/Printers/ControlPrinter.jsx'
import PrinterInfo from '../components/Dashboard/Production/Printers/PrinterInfo.jsx'
import Jobs from '../components/Dashboard/Production/Jobs.jsx'
import JobInfo from '../components/Dashboard/Production/Jobs/JobInfo.jsx'
import SubJobs from '../components/Dashboard/Production/SubJobs.jsx'
import SubJobInfo from '../components/Dashboard/Production/SubJobs/SubJobInfo.jsx'
import GCodeFiles from '../components/Dashboard/Production/GCodeFiles'
import GCodeFileInfo from '../components/Dashboard/Production/GCodeFiles/GCodeFileInfo.jsx'
const ProductionOverview = lazy(
() => import('../components/Dashboard/Production/ProductionOverview')
)
const Printers = lazy(
() => import('../components/Dashboard/Production/Printers')
)
const ControlPrinter = lazy(
() => import('../components/Dashboard/Production/Printers/ControlPrinter.jsx')
)
const PrinterInfo = lazy(
() => import('../components/Dashboard/Production/Printers/PrinterInfo.jsx')
)
const Jobs = lazy(() => import('../components/Dashboard/Production/Jobs.jsx'))
const JobInfo = lazy(
() => import('../components/Dashboard/Production/Jobs/JobInfo.jsx')
)
const SubJobs = lazy(
() => import('../components/Dashboard/Production/SubJobs.jsx')
)
const SubJobInfo = lazy(
() => import('../components/Dashboard/Production/SubJobs/SubJobInfo.jsx')
)
const GCodeFiles = lazy(
() => import('../components/Dashboard/Production/GCodeFiles')
)
const GCodeFileInfo = lazy(
() =>
import('../components/Dashboard/Production/GCodeFiles/GCodeFileInfo.jsx')
)
const ProductionRoutes = [
<Route

View File

@ -8,7 +8,20 @@ export default defineConfig({
base: './',
plugins: [react(), svgo(), svgr(), eslintPlugin()],
build: {
outDir: 'build'
outDir: 'build',
rollupOptions: {
output: {
manualChunks: {
antd: ['antd'],
codemirror: [
'@codemirror/lang-javascript',
'@codemirror/lang-python' /* etc */
],
three: ['three', 'gcode-preview'],
'react-vendor': ['react', 'react-dom', 'react-router-dom']
}
}
}
},
server: {
allowedHosts: ['dev.tombutcher.work'],