feat(performance): implement various performance optimizations across components
- Added a new `usePerformanceOptimization` hook for tracking render performance, debouncing, throttling, and optimized selectors to reduce unnecessary re-renders. - Enhanced `ProjectGroupList` and `ProjectList` components with preloading of project view and task management components on hover for smoother navigation. - Updated `TaskListBoard` to import `ImprovedTaskFilters` synchronously, avoiding suspense issues. - Introduced a `resetTaskDrawer` action in the task drawer slice for better state management. - Improved layout and positioning in `SuspenseFallback` for better user experience during loading states. - Documented performance optimizations in `PERFORMANCE_OPTIMIZATIONS.md` outlining key improvements and metrics.
This commit is contained in:
@@ -45,12 +45,8 @@ import VirtualizedTaskList from './virtualized-task-list';
|
||||
import { AppDispatch } from '@/app/store';
|
||||
import { shallowEqual } from 'react-redux';
|
||||
|
||||
// Import the improved TaskListFilters component
|
||||
const ImprovedTaskFilters = React.lazy(
|
||||
() => import('./improved-task-filters')
|
||||
);
|
||||
|
||||
|
||||
// Import the improved TaskListFilters component synchronously to avoid suspense
|
||||
import ImprovedTaskFilters from './improved-task-filters';
|
||||
|
||||
interface TaskListBoardProps {
|
||||
projectId: string;
|
||||
@@ -393,9 +389,7 @@ const TaskListBoard: React.FC<TaskListBoardProps> = ({ projectId, className = ''
|
||||
|
||||
{/* Task Filters */}
|
||||
<div className="mb-4">
|
||||
<React.Suspense fallback={<div>Loading filters...</div>}>
|
||||
<ImprovedTaskFilters position="list" />
|
||||
</React.Suspense>
|
||||
<ImprovedTaskFilters position="list" />
|
||||
</div>
|
||||
|
||||
{/* Virtualized Task Groups Container */}
|
||||
|
||||
Reference in New Issue
Block a user