@burst/react-use-window-size

react custom hook to get the viewport size

Usage no npm install needed!

<script type="module">
  import burstReactUseWindowSize from 'https://cdn.skypack.dev/@burst/react-use-window-size';
</script>

README

@burst/react-use-window-size

React custom hook to get viewport width and height on init and resize

installation

npm i @burst/react-use-window-size

Example

import React from 'react'
import { useWindowSize } from '@burst/use-window-size'

const Component = () => {
  const { viewportWidth, viewportHeight, documentWidth, documentHeight } = useWindowSize()

  return (
    <div>
      {viewportWidth}x{viewportHeight}px
    </div>
  )
}

export default Component

Mobile check is done to prevent a resize event trigger when safari url bar change. So using orientationchange on mobile devices. A throttle is used to prevent too many resize events.