https://github.com/akshitkrnagpal/use-size-performant

React hook to retrieve the size of an element
https://github.com/akshitkrnagpal/use-size-performant

react react-hooks resize-observer size

Last synced: 30 days ago
JSON representation

React hook to retrieve the size of an element

• Host: GitHub
• URL: https://github.com/akshitkrnagpal/use-size-performant
• Owner: akshitkrnagpal
• License: mit
• Created: 2020-11-26T22:03:32.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2020-12-07T09:12:52.000Z (over 5 years ago)
• Last Synced: 2025-05-28T22:11:29.323Z (about 1 year ago)
• Topics: react, react-hooks, resize-observer, size
• Language: TypeScript
• Homepage: https://www.npmjs.com/package/use-size-performant
• Size: 14.6 KB
• Stars: 0
• Watchers: 2
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# use-size-performant

> React hook to retrieve the size of an element

[![NPM](https://img.shields.io/npm/v/use-size-performant.svg)](https://www.npmjs.com/package/use-size-performant) 

## Installation

```

npm i use-size-performant

// or

yarn add use-size-performant

```

## Usage

### Using Ref

```js

import useSize from "use-size-performant";

const YourComponent = () => {

  const ref = useRef(null);

  const { height, width } = useSize(ref);

  return (

    


      
Height: {height}

      
Width: {width}

    

  );

};

```


### Using DOM elements

```js

import useSize from "use-size-performant";

const YourComponent = () => {

  const dom = document.querySelector('body');

  const { height, width } = useSize(dom);

  return (

    


      
Height: {height}

      
Width: {width}

    

  );

};

```


## License

MIT © [Akshit Kr Nagpal](https://github.com/akshitkrnagpal)