How to use the @welldone-software/why-did-you-render function in @welldone-software/why-did-you-render

To help you get started, we’ve selected a few @welldone-software/why-did-you-render examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github coodoo / xstate-examples / _old / fsm-service-3-actor / src / components / app.js View on Github external
import React, { useEffect, memo } from 'react'
import { useMachine } from '../xstate-custom/useMyMachine'
import { MainMachine, MainTypes } from '../fsm/mainMachine'
import Row from './row'

import './styles.css'

import { StateChart } from '@statecharts/xstate-viz'

import whyDidYouRender from '@welldone-software/why-did-you-render'
whyDidYouRender(React)

let uid = 0

const App = () => {
	const [state, send] = useMachine(MainMachine, { debug: false })

	const { songs, completed } = state.context

	// console.log(
	// 	'\n\n[Parent State] = ',
	// 	state.value,
	// 	'\n[context] = ',
	// 	state.context,
	// )

	const rows = songs.map((it, idx) => {
github coodoo / xstate-examples / _old / fsm-service-1-callback / src / app.js View on Github external
/* eslint-disable */
import React, { useEffect, useState, useMemo, useRef, useContext } from 'react'
import ReactDOM from 'react-dom'
import { useMachine } from '@xstate/react'
import CompressMachine from './machine'
import { dump } from './helpers'

import { StateChart } from '@statecharts/xstate-viz'

import './styles.css'

import whyDidYouRender from '@welldone-software/why-did-you-render'
whyDidYouRender(React)

const MyContext = React.createContext()

let uid = 0

const App = () => {
	const { state, send } = useContext(MyContext)

	const { songs } = state.context

	// console.log('\n[State] = ', state.value, '\n[context] = ', state.context)

	// console.log( '\n changed:', state )
	// dump(state.value)
	// console.log('\n[context] = ', state.context)
github coodoo / xstate-examples / _old / fsm-service-2-submachine / src / app.js View on Github external
/* eslint-disable */
import React, { useEffect, useState, useRef, memo } from 'react'
import ReactDOM from 'react-dom'
import { useMachine } from '@xstate/react'
import CompressMachine from './machine'
import WorkerMachine from './workerMachine'
import { dump } from './helpers'
import Row from './row'

import './styles.css'

import { StateChart } from '@statecharts/xstate-viz'

import whyDidYouRender from '@welldone-software/why-did-you-render'
whyDidYouRender(React)

const MyContext = React.createContext()

let uid = 0

const App = () => {

	const [state, send] = useMachine(CompressMachine)

	const { songs } = state.context

	const onUpdate = song => {
		send({
			type: 'update',
			data: song,
		})

@welldone-software/why-did-you-render

Monkey patches React to notify you about avoidable re-renders.

MIT
Latest version published 4 months ago

Package Health Score

83 / 100
Full package analysis