Skip to content

Conversation

@tomerqodo
Copy link

Benchmark PR langgenius#30318

Type: Corrupted (contains bugs)

Original PR Title: refactor(web): organize devtools components
Original PR Description: ### Summary
This PR refactors the devtools organization in the web module, standardizing the folder structure and implementing a consistent loading pattern across all tools.

Key Changes

  • Standardized Devtools Organization: Organized devtools into dedicated sub-folders (react-scan, tanstack) with encapsulated logic.
  • Implemented "Loader" Pattern:
    • Introduced Loader components (e.g., ReactScanLoader, TanStackDevtoolsLoader) that handle environment checks (IS_DEV), lazy loading (lazy), and Suspense wrapping.
    • This keeps the implementation files focused and ensures heavy devtools libraries are only loaded in development mode.
  • Cleaned up Global Contexts: Simplified web/context/query-client.tsx and web/app/layout.tsx by offloading devtools initialization and lazy loading logic to the respective loader components.
  • Improved Barrel Exports: Simplified web/app/components/devtools/index.ts using clean exports, making the module easier to consume.

Rationale

  • Better Encapsulation: Tool-specific configurations (like React Scan hacks) and dependencies are now isolated within their folders.
  • Optimized Bundle Size: Standardized lazy loading ensures devtools are split into separate chunks and not included in the main production bundle.
  • Maintainability: Consistent folder structure across all devtools makes the codebase more predictable and easier to extend.
    Original PR URL: refactor(web): organize devtools components langgenius/dify#30318

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants