An Operation Interface for react-addons-perf Package
Switch branches/tags
Nothing to show
Clone or download

README.md

Chrome React Perf

Demo

Features

  • Automatically show result when stop
  • Stop recording when Perf tab is closed

Link to chrome store

https://chrome.google.com/webstore/detail/react-perf/hacmcodfllhbnekmghgdlplbdnahmhmm

How to get it work

  • Install the extension from Chrome Store
  • Expose Perf (make sure Perf.start() can run from console)

Expose Perf

Chrome React Perf rely on a global variable called Perf. There are several ways to do that.

  • use webpack's expose loader

    import 'expose?Perf!react-addons-perf'

    or

    loaders: [
      {
        test: require.resolve("react-addons-perf"),
        loader: "expose?Perf"
      }
    ],
  • assign it to window

    import Perf from 'react-addons-perf'
    window.Perf = Perf
  • If something goes wrong, open an issue or tweet me: @crysislinux.

Install dependencies

npm install

Start with Hot Reloading

npm run dev

Build production version

npm run build

FAQ

Roadmap

  • Start && Stop && Print
  • Get a better logo (Thanks to rubencodes)
  • Support multiple profiles
  • Save settings to localStorage