chore: cleanup

This commit is contained in:
amhsirak
2025-01-06 02:01:07 +05:30
parent ba0d84934b
commit 2a568ed631

View File

@@ -4,13 +4,11 @@ import { useGlobalInfoStore } from "../../context/globalInfo";
import { useActionContext } from '../../context/browserActions'; import { useActionContext } from '../../context/browserActions';
import { FrontendPerformanceMonitor } from '../../../perf/performance'; import { FrontendPerformanceMonitor } from '../../../perf/performance';
// Lazy load components that aren't always needed
const DatePicker = React.lazy(() => import('./DatePicker')); const DatePicker = React.lazy(() => import('./DatePicker'));
const Dropdown = React.lazy(() => import('./Dropdown')); const Dropdown = React.lazy(() => import('./Dropdown'));
const TimePicker = React.lazy(() => import('./TimePicker')); const TimePicker = React.lazy(() => import('./TimePicker'));
const DateTimeLocalPicker = React.lazy(() => import('./DateTimeLocalPicker')); const DateTimeLocalPicker = React.lazy(() => import('./DateTimeLocalPicker'));
// High-performance RAF scheduler
class RAFScheduler { class RAFScheduler {
private queue: Set<() => void> = new Set(); private queue: Set<() => void> = new Set();
private isProcessing: boolean = false; private isProcessing: boolean = false;
@@ -56,7 +54,6 @@ class RAFScheduler {
} }
} }
// Enhanced event debouncer with priority queue
class EventDebouncer { class EventDebouncer {
private highPriorityQueue: Array<() => void> = []; private highPriorityQueue: Array<() => void> = [];
private lowPriorityQueue: Array<() => void> = []; private lowPriorityQueue: Array<() => void> = [];
@@ -150,19 +147,16 @@ interface CanvasProps {
} }
const Canvas = React.memo(({ width, height, onCreateRef }: CanvasProps) => { const Canvas = React.memo(({ width, height, onCreateRef }: CanvasProps) => {
// Core refs and state
const canvasRef = useRef<HTMLCanvasElement>(null); const canvasRef = useRef<HTMLCanvasElement>(null);
const { socket } = useSocketStore(); const { socket } = useSocketStore();
const { setLastAction } = useGlobalInfoStore(); const { setLastAction } = useGlobalInfoStore();
const { getText, getList } = useActionContext(); const { getText, getList } = useActionContext();
// Performance optimization instances
const scheduler = useRef(new RAFScheduler()); const scheduler = useRef(new RAFScheduler());
const debouncer = useRef(new EventDebouncer(scheduler.current)); const debouncer = useRef(new EventDebouncer(scheduler.current));
const measurementCache = useRef(new MeasurementCache(50)); const measurementCache = useRef(new MeasurementCache(50));
const performanceMonitor = useRef(new FrontendPerformanceMonitor()); const performanceMonitor = useRef(new FrontendPerformanceMonitor());
// Consolidated refs
const refs = useRef({ const refs = useRef({
getText, getText,
getList, getList,
@@ -171,7 +165,6 @@ const Canvas = React.memo(({ width, height, onCreateRef }: CanvasProps) => {
context: null as CanvasRenderingContext2D | null, context: null as CanvasRenderingContext2D | null,
}); });
// Optimized state management
const [state, dispatch] = React.useReducer((state: any, action: any) => { const [state, dispatch] = React.useReducer((state: any, action: any) => {
switch (action.type) { switch (action.type) {
case 'BATCH_UPDATE': case 'BATCH_UPDATE':
@@ -186,7 +179,6 @@ const Canvas = React.memo(({ width, height, onCreateRef }: CanvasProps) => {
dateTimeLocalInfo: null dateTimeLocalInfo: null
}); });
// Optimized coordinate calculation
const getEventCoordinates = useCallback((event: MouseEvent): { x: number; y: number } => { const getEventCoordinates = useCallback((event: MouseEvent): { x: number; y: number } => {
if (!canvasRef.current) return { x: 0, y: 0 }; if (!canvasRef.current) return { x: 0, y: 0 };
@@ -202,7 +194,6 @@ const Canvas = React.memo(({ width, height, onCreateRef }: CanvasProps) => {
}; };
}, []); }, []);
// High-performance mouse handler
const handleMouseEvent = useCallback((event: MouseEvent) => { const handleMouseEvent = useCallback((event: MouseEvent) => {
if (!socket || !canvasRef.current) return; if (!socket || !canvasRef.current) return;
@@ -247,7 +238,6 @@ const Canvas = React.memo(({ width, height, onCreateRef }: CanvasProps) => {
} }
}, [socket, getEventCoordinates]); }, [socket, getEventCoordinates]);
// Optimized keyboard handler
const handleKeyboardEvent = useCallback((event: KeyboardEvent) => { const handleKeyboardEvent = useCallback((event: KeyboardEvent) => {
if (!socket) return; if (!socket) return;
@@ -303,12 +293,11 @@ const Canvas = React.memo(({ width, height, onCreateRef }: CanvasProps) => {
useEffect(() => { useEffect(() => {
const intervalId = setInterval(() => { const intervalId = setInterval(() => {
console.log('Performance Report:', performanceMonitor.current.getPerformanceReport()); console.log('Performance Report:', performanceMonitor.current.getPerformanceReport());
}, 20000); // Reduced frequency }, 20000);
return () => clearInterval(intervalId); return () => clearInterval(intervalId);
}, []); }, []);
// Socket events
useEffect(() => { useEffect(() => {
if (!socket) return; if (!socket) return;