|
1 | | -# React Performance Hooks |
2 | | - |
3 | | -[](https://www.npmjs.com/package/@better-hooks/performance) |
4 | | - |
5 | | - |
6 | | - |
7 | | - |
8 | | - |
9 | | - |
10 | | -> Debounce and throttle your functions to gain performance boost! |
11 | | -
|
12 | | -- [Better Typed](https://github.com/BetterTyped) |
13 | | - |
14 | | -## Features |
15 | | - |
16 | | -- :rocket: Simple, fast and light |
17 | | -- :factory: Debounce and Throttle |
18 | | -- 🪗 Lifecycle events handling |
19 | | - |
20 | | -## Install |
| 1 | +# 🎊 React Performance Hooks |
| 2 | + |
| 3 | +<p> |
| 4 | + <a href="https://bettertyped.com/"> |
| 5 | + <img src="https://custom-icon-badges.demolab.com/static/v1?label=&message=BetterTyped&color=333&logo=BT" /> |
| 6 | + </a> |
| 7 | + <a href="https://github.com/BetterTyped/react-performance-hooks"> |
| 8 | + <img src="https://custom-icon-badges.demolab.com/github/stars/BetterTyped/react-performance-hooks?logo=star&color=118ab2" /> |
| 9 | + </a> |
| 10 | + <a href="https://github.com/BetterTyped/react-performance-hooks/blob/main/License.md"> |
| 11 | + <img src="https://custom-icon-badges.demolab.com/github/license/BetterTyped/react-performance-hooks?logo=law&color=yellow" /> |
| 12 | + </a> |
| 13 | + <a href="https://github.com/semantic-release/semantic-release"> |
| 14 | + <img src="https://custom-icon-badges.demolab.com/badge/semver-commitzen-e10079?logo=semantic-release&color=e76f51" /> |
| 15 | + </a> |
| 16 | + <a href="https://github.com/BetterTyped/react-performance-hooks"> |
| 17 | + <img src="https://custom-icon-badges.demolab.com/badge/typescript-%23007ACC.svg?logo=typescript&logoColor=white" /> |
| 18 | + </a> |
| 19 | + <a href="https://www.npmjs.com/package/@better-hooks/performance"> |
| 20 | + <img src="https://custom-icon-badges.demolab.com/bundlephobia/min/@better-hooks/performance?color=64BC4B&logo=package" /> |
| 21 | + </a> |
| 22 | + <a href="https://www.npmjs.com/package/@better-hooks/performance"> |
| 23 | + <img src="https://custom-icon-badges.demolab.com/npm/v/@better-hooks/performance.svg?logo=npm&color=E10098" /> |
| 24 | + </a> |
| 25 | +</p> |
| 26 | + |
| 27 | +## About |
| 28 | + |
| 29 | +Debounce and throttle your functions to gain performance boost! |
| 30 | + |
| 31 | +## Key Features |
| 32 | + |
| 33 | +🔮 **Simple usage** |
| 34 | + |
| 35 | +🚀 **Fast and light** |
| 36 | + |
| 37 | +✨ **Debounce and Throttle** |
| 38 | + |
| 39 | +## Installation |
21 | 40 |
|
22 | 41 | ```bash |
23 | 42 | npm install --save @better-hooks/performance |
|
29 | 48 | yarn add @better-hooks/performance |
30 | 49 | ``` |
31 | 50 |
|
32 | | -## useDebounce |
| 51 | +--- |
| 52 | + |
| 53 | +## Examples |
| 54 | + |
| 55 | +#### useDebounce |
33 | 56 |
|
34 | 57 | This hook allows debouncing of the given function. |
35 | 58 |
|
@@ -61,7 +84,7 @@ const MyComponent: React.FC = ({ delay }) => { |
61 | 84 |
|
62 | 85 | ``` |
63 | 86 |
|
64 | | -## useThrottle |
| 87 | +#### useThrottle |
65 | 88 |
|
66 | 89 | This hook allows debouncing of the given function. |
67 | 90 |
|
|
0 commit comments