https://github.com/chakrihacker/babel-plugin-wrap-profiler

Babel Plugin that wraps profiler to each component in your code base
https://github.com/chakrihacker/babel-plugin-wrap-profiler

Last synced: 3 months ago
JSON representation

Babel Plugin that wraps profiler to each component in your code base

• Host: GitHub
• URL: https://github.com/chakrihacker/babel-plugin-wrap-profiler
• Owner: chakrihacker
• Created: 2021-10-09T17:18:12.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2021-10-17T05:52:29.000Z (over 3 years ago)
• Last Synced: 2024-10-06T03:41:06.294Z (4 months ago)
• Language: JavaScript
• Size: 85.9 KB
• Stars: 5
• Watchers: 2
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# babel-plugin-wrap-profiler

A Babel plugin that wraps components with [Profiler](https://reactjs.org/docs/profiler.html).

# Usage

## Install

For Yarn

```bash

yarn add -D babel-plugin-wrap-profiler

```

For npm 

```bash

npm install --save-dev babel-plugin-wrap-profiler

```

## Configure Babel

```js

// In your .babelrc

{

    "plugins": [

        "babel-plugin-wrap-profiler"

    ]

}

```

## Log Profiler Results

```js

// In your code

import React from 'react';

import { logComponents } from "babel-plugin-wrap-profiler/lib/profiler-utils";

const Component = () => {

    return (

        

            Log Components

        

    );

};

```

# Credits

- Thanks to [CoinBase](https://blog.coinbase.com/optimizing-react-native-7e7bf7ac3a34) for the inspiration.

- Jamie for [Babel plugin](https://github.com/jamiebuilds/babel-handbook/blob/master/translations/en/plugin-handbook.md) handbook