Commits on Sep 11, 2024

1. Optimize React components and hooks for better performance - ChatConv… …

   …ersation: Memoize isLoadingMessage calculation and onSubmit function - OllamaModelsRepository: Memoize columns array and handleSortingChange function - ChatLayout: Memoize refetchInterval, activesInboxes, and archivesInboxes - useWebSocketMessage: Optimize useEffect dependencies and memoize wsMessage - SheetProject: Memoize table object and optimize WebSocket useEffect dependencies These changes aim to reduce unnecessary re-renders and calculations, potentially improving the overall performance of the application.
   
   This commit focuses on improving the performance of several key components
   and hooks in our application by implementing React optimization techniques.
   
   ChatConversation:
   - Memoized the isLoadingMessage calculation using useMemo to prevent
     unnecessary recalculations on re-renders.
   - Wrapped the onSubmit function with useCallback to ensure it's not
     recreated on every render, potentially reducing unnecessary re-renders
     of child components.
   - Optimized the useEffect for setting firstMessageWorkflow by using a more
     specific dependency array.
   
   OllamaModelsRepository:
   - Memoized the columns array using useMemo to prevent recreation on each render.
   - Implemented useCallback for the handleSortingChange function to optimize
     performance when passed as a prop to child components.
   - Split the useEffect for installedOllamaModelsMap and selectedTagMap setup
     into separate effects for better separation of concerns.
   
   ChatLayout:
   - Memoized the refetchInterval function using useCallback to prevent
     unnecessary recreations.
   - Implemented useMemo for activesInboxes and archivesInboxes calculations
     to optimize performance, especially beneficial if the inboxes array is large.
   
   useWebSocketMessage:
   - Optimized the useEffect dependencies by only including necessary parts
     of the auth object, reducing unnecessary effect runs.
   - Memoized the WebSocket message creation using useMemo to prevent
     unnecessary recalculations.
   
   SheetProject:
   - Memoized the table object using useMemo to prevent unnecessary recreation
     on each render, potentially improving performance in data-heavy scenarios.
   - Optimized the WebSocket useEffect dependencies by only including necessary
     parts of the auth object.
   
   These optimizations aim to reduce unnecessary re-renders, calculations, and
   effect runs throughout the application. By implementing these React best
   practices, we expect to see improved performance, especially in scenarios
   with large datasets or frequent updates.This commit focuses on improving the performance of several key components
   and hooks in our application by implementing React optimization techniques.
   
   ChatConversation:
   - Memoized the isLoadingMessage calculation using useMemo to prevent
     unnecessary recalculations on re-renders.
   - Wrapped the onSubmit function with useCallback to ensure it's not
     recreated on every render, potentially reducing unnecessary re-renders
     of child components.
   - Optimized the useEffect for setting firstMessageWorkflow by using a more
     specific dependency array.
   
   OllamaModelsRepository:
   - Memoized the columns array using useMemo to prevent recreation on each render.
   - Implemented useCallback for the handleSortingChange function to optimize
     performance when passed as a prop to child components.
   - Split the useEffect for installedOllamaModelsMap and selectedTagMap setup
     into separate effects for better separation of concerns.
   
   ChatLayout:
   - Memoized the refetchInterval function using useCallback to prevent
     unnecessary recreations.
   - Implemented useMemo for activesInboxes and archivesInboxes calculations
     to optimize performance, especially beneficial if the inboxes array is large.
   
   useWebSocketMessage:
   - Optimized the useEffect dependencies by only including necessary parts
     of the auth object, reducing unnecessary effect runs.
   - Memoized the WebSocket message creation using useMemo to prevent
     unnecessary recalculations.
   
   SheetProject:
   - Memoized the table object using useMemo to prevent unnecessary recreation
     on each render, potentially improving performance in data-heavy scenarios.
   - Optimized the WebSocket useEffect dependencies by only including necessary
     parts of the auth object.
   
   These optimizations aim to reduce unnecessary re-renders, calculations, and
   effect runs throughout the application. By implementing these React best
   practices, we expect to see improved performance, especially in scenarios
   with large datasets or frequent updates.

   

   maskoff7 committed Sep 11, 2024
   Configuration menu

   • View commit details
   • Copy full SHA for ffcae0f
   • Browse repository at this point

   Copy the full SHA

   ffcae0f View commit details

   Browse the repository at this point in the history