refactor: Improve tile management and WebSocket message processing architecture#70
Merged
Merged
Conversation
- Introduced a new tileStore using zustand for managing tile data, including tiles, renderTiles, and related state. - Replaced local state management for tiles with store selectors to enhance performance and maintainability. - Updated tile manipulation functions to utilize the store, improving the clarity and efficiency of tile updates. - Refactored CanvasDashboard and CanvasRenderComponent to retrieve tileSize and tiles directly from the store, streamlining component logic.
- Updated the Play component to replace the moveCursor function with padtiles for handling tile padding based on cursor movement. - Refactored the CanvasRenderComponent to apply padding before animations, improving the responsiveness of tile updates. - Enhanced the tileStore to include the new padtiles function, allowing for more flexible tile manipulation based on direction. - Added new direction types to the position definitions for better clarity in tile padding operations.
…nent - Introduced useCallback for tile processing functions to enhance performance and prevent unnecessary re-renders. - Refactored the replaceTiles and createWorkerPromises functions to utilize zustand store for improved state management. - Updated the handleWebSocketMessage function to integrate a new message handler for better organization and clarity. - Added console logs for performance tracking during tile updates, aiding in debugging and optimization efforts.
…processing - Introduced a new custom hook, useMessageHandler, to centralize and streamline WebSocket message handling in the Play component. - Replaced the deprecated useMessageProcess hook, enhancing clarity and organization of message processing logic. - Updated the Play component to utilize the new message handler, improving maintainability and performance. - Refactored tile processing logic to leverage the new handler for better integration with WebSocket events.
…component - Moved the FILL_CHAR constant to the tileStore for better accessibility across components. - Updated the Play component to import FILL_CHAR from the tileStore, improving code organization and maintainability. - Removed redundant import statements to streamline the Play component's dependencies.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
개요
타일 관리 시스템과 WebSocket 메시지 처리 로직을 리팩토링하여 코드 구조를 개선하고 유지보수성을 향상시켰습니다.
주요 변경사항
1. Zustand 스토어를 통한 타일 상태 관리 통합 (627d066)
useTileStore를 통해 타일 상태를 중앙화useTiles,useRenderTiles등)2. 타일 패딩 로직 개선 (a2625b6)
moveCursor함수를padtiles로 대체3. 타일 처리 및 상태 관리 최적화 (3263fc2)
applyTileChanges로 통합4. WebSocket 메시지 처리 개선 (b760d49)
useMessageHandler커스텀 훅 구현5. 상수 중앙화 및 import 정리 (e7d0013)
FILL_CHAR상수를tileStore.ts로 중앙화기술적 개선사항
테스트