‹ Reports
The Dispatch

OSS Report: facebook/react


React Project Faces Challenges with React 19 Transition Amidst Active Development

React, a leading JavaScript library for building user interfaces developed by Facebook, is experiencing significant user-reported issues with its upcoming React 19 release. The concerns primarily revolve around hooks, performance discrepancies, and the integration of custom elements, indicating potential hurdles for developers upgrading to this version.

Recent Activity

The recent issues and pull requests (PRs) highlight several key challenges and ongoing efforts within the React project. Notably, issues such as #30953 and #30799 reflect difficulties with TypeScript definitions and infinite refetching in React 19. Compatibility problems with eslint v9 (#30932) and asynchronous rendering bugs (#30886) further emphasize the complexity of the transition to the new version.

Development Team and Recent Activity

  1. Josh Story (gnoff)

    • Commits:
    • Initiated work on render scheduling (#30961).
    • Corrected stylesheet insertion logic (#28255).
    • Fixed pending chunk tracking (#30958).
    • Disabled experimental feature (#30952).
  2. Sebastian Markbåge (sebmarkbage)

    • Commits:
    • Refactored profiler code (#30957).
    • Improved profiler performance (#30942).
    • Enhanced prerendering functionality (#30950).
  3. Hendrik Liebau (unstubbable)

    • Commits:
    • Updated async module handling (#30959).
  4. 春希与子晴 (sweetliquid)

    • Commits:
    • Collaborated on stylesheet insertion fix (#28255).
  5. Jan Kassens (kassens)

    • Commits:
    • Ensured cleanup of insertion effects (#30954).
  6. Rick Hanlon (rickhanlonii)

    • Commits:
    • Co-authored insertion effects cleanup.
  7. Michael Vitousek (mvitousek)

    • Focused on compiler improvements.
  8. Joseph Savona (josephsavona)

    • Worked on compiler enhancements.

The team is actively addressing performance and reliability issues, particularly in rendering systems like Flight and profiling tools.

Of Note

Quantified Reports

Quantify Issues



Recent GitHub Issues Activity

Timespan Opened Closed Comments Labeled Milestones
7 Days 7 11 10 0 1
30 Days 29 31 81 1 1
90 Days 121 95 338 8 1
1 Year 371 199 1308 30 1
All Time 13115 12461 - - -

Like all software activity quantification, these numbers are imperfect but sometimes useful. Comments, Labels, and Milestones refer to those issues opened in the timespan in question.

Quantify commits



Quantified Commit Activity Over 30 Days

Developer Avatar Branches PRs Commits Files Changes
Sebastian Markbåge 3 55/54/0 72 184 77079
Andrew Clark 3 7/7/0 17 102 37223
Joseph Savona 21 36/28/4 96 232 26280
Michael Vitousek 14 14/6/4 36 91 12673
Mofei Zhang 3 7/7/0 9 169 10168
Ricky 2 0/0/0 3 48 7148
Josh Story 2 11/11/0 19 64 4722
None (dependabot[bot]) 7 9/0/2 7 9 4046
lauren 4 9/7/0 13 51 844
Ruslan Lesiutin 1 9/8/1 8 24 647
Sam Zhou 2 2/2/0 4 41 373
Jan Kassens 1 1/1/0 1 13 371
Hendrik Liebau 1 1/1/0 1 8 368
ling1726 1 1/1/0 1 3 73
Alex Hunt 1 0/0/0 1 2 28
Benoit Girard 1 0/0/0 1 2 12
Sebastian "Sebbie" Silbermann 1 4/2/0 2 2 4
Rune Botten 1 1/1/0 1 1 2
Riccardo Cipolleschi (cipolleschi) 1 1/0/0 1 1 2
春希与子晴 1 0/0/0 1 1 2
Brendan Abbott (brendo) 0 1/0/0 0 0 0
Derick Blacido (dconer) 0 1/0/1 0 0 0
Alexander Savelyev (vordgi) 0 3/0/1 0 0 0
Sathya Gunasekaran (gsathya) 0 1/0/0 0 0 0
BIKI DAS (Biki-das) 0 2/0/0 0 0 0
None (alen1238) 0 1/0/1 0 0 0
Jack Pope (jackpope) 0 1/0/0 0 0 0
Samuel Susla (sammy-SC) 0 1/0/0 0 0 0
LoganDark (LoganDark) 0 1/0/0 0 0 0
John Paul (RJohnPaul) 0 1/0/1 0 0 0
Ravi (Ravi80595) 0 1/0/0 0 0 0
Hyein Jeong (happyhyep) 0 2/0/2 0 0 0
Chen Reuven (ChenReuven) 0 1/0/0 0 0 0
Rizwan (rizwan-r-r) 0 1/0/1 0 0 0
michael faith (michaelfaith) 0 1/0/0 0 0 0
Arman Tang (Arman19941113) 0 1/0/1 0 0 0
Chandan Panigrahi (chandan-git04) 0 1/0/1 0 0 0
Shashank yadahalli (its-shashankY) 0 1/0/1 0 0 0
None (Aayushkrprasad) 0 1/0/1 0 0 0
None (Princefuzyfzr6) 0 1/0/1 0 0 0
None (shubhanshu7532) 0 1/0/1 0 0 0
None (db-efficienteng) 0 1/0/1 0 0 0
Kalhara Batangala (KalharaBatangala) 0 1/0/1 0 0 0
Voltaged (VoltagedDebunked) 0 1/0/1 0 0 0
Tyler Scott Williams (coolsoftwaretyler) 0 2/0/2 0 0 0

PRs: created by that dev and opened/merged/closed-unmerged during the period

Detailed Reports

Report On: Fetch issues



Recent Activity Analysis

The React GitHub repository has seen significant recent activity, with 654 open issues and numerous discussions surrounding the upcoming React 19 release. Notably, several issues highlight concerns with the new features and changes introduced in this version, particularly regarding the handling of hooks, performance discrepancies, and the integration of custom elements. There is a clear trend of users experiencing unexpected behaviors with use() and Suspense, as well as challenges related to state management in complex scenarios.

Several issues also indicate a growing frustration with the removal of certain features like findDOMNode, which has prompted discussions about alternative solutions for accessing DOM elements. The community is actively engaging with these changes, suggesting workarounds and expressing concerns about the implications for existing codebases.

Issue Details

Recently Created Issues

  1. Issue #30953: [React 19] Cannot find name 'dialog'

    • Created: 3 days ago
    • Updated: 1 day ago
    • Priority: High
    • Status: Open
    • Summary: Users report that the new dialog element is not recognized in TypeScript definitions for React 19.
  2. Issue #30932: cannot upgrade eslint to v9 due to eslint-plugin-react-hooks peer dependencies

    • Created: 5 days ago
    • Updated: 1 day ago
    • Priority: Medium
    • Status: Unconfirmed
    • Summary: Compatibility issues between eslint v9 and eslint-plugin-react-hooks are preventing upgrades.
  3. Issue #30898: [DevTools Bug] The "path" argument must be of type string. Received undefined

    • Created: 9 days ago
    • Updated: 3 days ago
    • Priority: Medium
    • Status: Unconfirmed
    • Summary: A bug encountered when using DevTools in a React Native app.
  4. Issue #30886: Bug: First render doesn't create DOM nodes before next JavaScript is executed in script

    • Created: 10 days ago
    • Updated: 5 days ago
    • Priority: Medium
    • Status: Unconfirmed
    • Summary: Issues with asynchronous rendering in React 18 affecting DOM node creation timing.
  5. Issue #30872: Bug: Footer Unknown Text Found

    • Created: 11 days ago
    • Updated: 6 days ago
    • Priority: Low
    • Status: Unconfirmed
    • Summary: An issue regarding unexpected text appearing in the footer of a React application.

Recently Updated Issues

  1. Issue #30799: [React 19] Upgrading React causes infinite refetching

    • Last Updated: 11 days ago
    • Priority: High
    • Status: Open
  2. Issue #30782: [Compiler Bug]: eslint-plugin-react-compiler errors when updating initialization of ref.current

    • Last Updated: 11 days ago
    • Priority: Medium
    • Status: Open
  3. Issue #30754: [DevTools Bug]: Inconsistent behavior; React dev tools does not recognize a react website; 'service worker(inactive)'

    • Last Updated: 22 days ago
    • Priority: Medium
    • Status: Open
  4. Issue #30687: Bug: Object.keys inside the Shallow Equal can be improved

    • Last Updated: 32 days ago
    • Priority: Low
    • Status: Open
  5. Issue #30605: Bug: SetState Calls not being batched inside Promise calls/micro Task

    • Last Updated: 41 days ago
    • Priority: High
    • Status: Open

Themes and Commonalities

The recent issues reflect several key themes:

  • The transition to React 19 has introduced various complications, particularly around hooks and state management.
  • Users are encountering difficulties with compatibility between libraries (e.g., ESLint) and new versions of React.
  • There are ongoing discussions about deprecated features and how they impact existing codebases.
  • Performance issues are frequently mentioned, especially concerning how components behave under different rendering conditions (e.g., Suspense).

This analysis indicates that while there is excitement around new features in React, there are also significant challenges that need to be addressed to ensure smooth transitions for developers upgrading their applications.

Report On: Fetch pull requests



Overview

The analysis of the pull requests (PRs) for the React project reveals a diverse range of enhancements, bug fixes, and optimizations aimed at improving the framework's functionality and developer experience. The current state shows a significant number of open PRs, indicating ongoing development and community engagement.

Summary of Pull Requests

  1. PR #30964: Added comments to clarify key handling in JSX and createElement. This PR enhances documentation for better understanding of key reuse in JSX.

  2. PR #30960: Introduced enableComponentPerformanceTrack flag to gate a new timeline profiler. This change aims to improve performance tracking in React's experimental builds.

  3. PR #30956: Draft PR for JSX outlining which separates nested JSX into a function. This could enhance readability and maintainability of JSX code.

  4. PR #30944: Bumped express from 4.17.1 to 4.20.0 in /fixtures/dom. This is a routine dependency update that may include important security fixes.

  5. PR #30941: Similar to #30944, this PR bumps express from 4.16.2 to 4.20.0 but in a different fixture directory.

  6. PR #30940: Another bump for express, this time from 4.16.2 to 4.20.0 in /fixtures/packaging/brunch/prod.

  7. PR #30939: Bumped express from 4.15.4 to 4.20.0 in /fixtures/attribute-behavior.

  8. PR #30937: Bumped express from 4.14.0 to 4.20.0 in /fixtures/fiber-debugger.

  9. PR #30924: Fixed error message for event handler messages, clarifying the context for developers.

  10. PR #30922: Implemented support for hoisted and recursive functions in the compiler, enhancing function handling capabilities.

  11. PR #30917: Allowed all hooks to take callbacks accessing refs while banning direct ref value arguments, improving safety in hook usage.

  12. PR #30880: Fixed value formatting of proxies of class instances, addressing issues with how class instance proxies were represented.

  13. PR #30877: Fixed higher priority lane call and added tests for fiber lane functionality.

  14. PR #30791: Reproduced a false positive violation related to ref-in-render scenarios, indicating ongoing efforts to refine error handling.

  15. PR #30810: Added tests for suppress reset property, enhancing form behavior control.

  16. PR #30815: Inferred optional manual memo dependencies during memoization processes.

  17. PR #30805: Introduced hidden-connected mode for Activity, allowing passive effects to remain connected.

  18. PR #30728: Implemented logic to prevent cache resets on size changes, addressing potential bugs related to state management.

  19. PR #30752: Fixed issues with controlled number fields upon action, ensuring values are retained correctly across interactions.

  20. PR #30736: Supported nesting in existing RSC renderers, enhancing rendering capabilities within React's architecture.

  21. PR #30728: Introduced a suppressReset prop to control form reset behavior after actions are completed.

  22. PR #30600: Bumped webpack from 5.x versions as part of routine maintenance and security updates.

  23. PR #30597: Chore PR focusing on fixing typos and documentation improvements across the codebase.

  24. PR #30596 & PR #30564: Refactor efforts aimed at improving console patching mechanisms within React DevTools.

  25. Multiple PRs related to ESLint plugin updates, such as adding flat config support and improving error handling in hooks.

Analysis of Pull Requests

The current set of open pull requests indicates an active development cycle within the React project, with contributions spanning various aspects of the framework—from core functionality improvements to dependency management and documentation enhancements.

Common Themes

  1. Performance Improvements:

    • Several PRs focus on performance optimizations, such as the introduction of flags like enableComponentPerformanceTrack (#30960) and the implementation of JSX inlining optimizations (#30867). These changes aim to reduce runtime overhead and improve user experience by making React applications more efficient.
  2. Refinement of Error Handling:

    • Multiple contributions address error messages and validation logic (e.g., PRs #30924, #30810). By clarifying error messages or ensuring that invalid arguments are properly handled, these changes enhance developer experience by providing clearer guidance when issues arise.
  3. Dependency Management:

    • A significant number of PRs involve updating dependencies (e.g., multiple instances of updating express and webpack). This reflects a commitment to maintaining security standards and ensuring compatibility with the latest library versions.
  4. Documentation Enhancements:

    • Contributions like those seen in PRs (#30823) focus on improving documentation examples or fixing typos, which is crucial for onboarding new developers and maintaining clarity within the project's extensive documentation.
  5. Community Engagement and Collaboration:

    • The discussions within PR comments reveal a collaborative environment where contributors actively engage with each other’s work (e.g., discussions around test cases or implementation details). This collaborative spirit is essential for fostering innovation and ensuring high-quality contributions.

Notable Anomalies

  • Some PRs have been marked as drafts or are labeled with "DoNotCommit," indicating ongoing work or experimentation rather than finalized contributions (#30862). This suggests that while there is significant activity, not all contributions are ready for production use.
  • There are instances where contributors express confusion regarding existing tests or expected behaviors (e.g., discussions around controlled inputs). This highlights potential gaps in documentation or understanding that could be addressed through better onboarding practices or clearer guidelines.

Old Pull Requests

  • A few older pull requests remain open without recent activity, which may indicate areas where contributors have lost interest or where additional review is needed (#29080). It would be beneficial for maintainers to periodically review these older contributions to either merge them if they are still relevant or close them if they are no longer applicable.

Conclusion

Overall, the current landscape of pull requests within the React repository showcases an engaged community focused on enhancing both performance and usability while maintaining robust documentation practices. The diverse range of topics being addressed reflects ongoing efforts to adapt React to modern development needs while ensuring stability and clarity for its users.

Report On: Fetch commits



Repo Commits Analysis

Development Team and Recent Activity

Team Members and Their Recent Activities

  1. Josh Story (gnoff)

    • Recent Commits:
    • [Flight] Start initial work immediately (#30961): Initiated work on render and prerender scheduling behavior to optimize performance.
    • Fix nodeName to UPPERCASE in insertStylesheetIntoRoot (#28255): Corrected a condition in the stylesheet insertion logic.
    • [Flight] properly track pendingChunks when changing environment names (#30958): Fixed an issue with pending chunk tracking during environment name changes.
    • disable enableSiblingPrerendering in experimental channel (#30952): Disabled a feature until further testing is completed.
    • Collaboration: Worked closely with other team members on various features, particularly focusing on the Flight rendering system.
  2. Sebastian Markbåge (sebmarkbage)

    • Recent Commits:
    • [Fiber] Profiler - Use two separate functions instead of branch by flag (#30957): Refactored profiler code for clarity and performance.
    • [Fiber] Set profiler values to doubles (#30942): Adjusted initialization of profiler values to improve performance.
    • [Fizz] Add resumeAndPrerender to Static Rendering (#30950): Implemented functionality for resuming prerendering.
    • Collaboration: Engaged in discussions and code reviews with peers, focusing on performance optimizations and feature enhancements.
  3. Hendrik Liebau (unstubbable)

    • Recent Commits:
    • [Flight] Respect async flag in client manifest (#30959): Updated server reference metadata handling for async modules.
    • Collaboration: Worked alongside Josh Story on the async handling feature.
  4. 春希与子晴 (sweetliquid)

    • Recent Commits:
    • Fix nodeName to UPPERCASE in insertStylesheetIntoRoot (#28255): Addressed a bug related to stylesheet insertion logic.
    • Collaboration: Collaborated with Josh Story on the same fix.
  5. Jan Kassens (kassens)

    • Recent Commits:
    • Call cleanup of insertion effects when hidden (#30954): Ensured cleanup of insertion effects when components are removed offscreen.
    • Collaboration: Co-authored with Rick Hanlon on this commit.
  6. Rick Hanlon (rickhanlonii)

    • Recent Commits:
    • Co-authored the commit related to cleanup of insertion effects with Jan Kassens.
  7. Michael Vitousek (mvitousek)

    • Recent Commits:
    • Various commits focusing on compiler improvements and optimizations, including type inference and memoization strategies.
  8. Joseph Savona (josephsavona)

    • Recent Commits:
    • Focused on compiler enhancements, particularly around error handling and type validation.

Patterns and Themes

  • The recent activity indicates a strong focus on improving performance and reliability within the React framework, particularly concerning the Flight rendering system and profiling capabilities.
  • Collaboration among team members is evident, with multiple co-authored commits showcasing teamwork in addressing bugs and implementing new features.
  • There is a notable emphasis on refactoring existing code for clarity and efficiency, particularly in the profiler and rendering logic.
  • The team is actively working on enhancing the developer experience through better error handling, type validation, and support for new features like async module handling.

Conclusions

The development team is actively engaged in refining the React library's performance and usability. Their collaborative efforts are directed towards optimizing rendering processes, improving profiling tools, and ensuring robust handling of asynchronous operations. This ongoing commitment to quality enhancement reflects a proactive approach to software development within the React ecosystem.