Skip to content

React Utils - v1.0.3

Compare
Choose a tag to compare
@ItsJonQ ItsJonQ released this 22 Nov 00:42
· 26 commits to master since this release

Add renderSpy component

screen recording 2018-11-21 at 01 03 pm

This update adds a new HOC utility called renderSpy, which reports on the
mount/unmount/render cycles of a React component - very handy for
debugging performance!

Inspired by React's performance tools and react-performance.

Examples

import React from 'react'
import renderSpy from '@helpscout/react-utils/dist/renderSpy'

class Napoleon extends React.Component {
  ...
}

export const renderSpy()(Napoleon)

Potential logs:

Napoleon Mounted

Napoleon Rendered
Changes: ['votedForPedro']
Previous: { votedForPedro: false }
Next: { votedForPedro: true }

Napoleon Unmounted

Note!! I decided to roll my own performance spy tool instead of using ReactPerformance.measure because I couldn't get that library to work with our projects :(. Not sure why!