The tools, which are in a beta release stage, feature such capabilities as a tree view, for richer views of props; component searching; and a side pane, for showing context of a component.
"Perhaps the biggest reason [for new tools] was to create a defined API for dealing with internals, so that other tools could benefit as well and not have to depend on implementation details," said project participant Jared Forsyth, in the React blog, this week. " This gives us more freedom to refactor things internally without worrying about breaking tooling." The tools are much less coupled to the Chrome browser, according to Forsyth.
Programming with React is akin to working with a game engine, with screens cleared at the beginning of each frame and redrawn, as opposed to a traditional data-binding approach, React team member Pete Hunt explained in an InfoWorld interview in 2014. Hunt described React as having "a fundamentally different mental model for building user interfaces." Used as the "View" part of the Model-View-Controller pattern, React abstracts the DOM, with the intention of providing a simpler programming model and better performance.
Installing the tools requires users to disable the Chrome Web store version of React tools. The new tools can be accessed at this GitHub page.