Skip to content

Commit a048d5c

Browse files
committed
README: add TOC, update file sizes for 0.8.0
1 parent 4756389 commit a048d5c

File tree

1 file changed

+15
-3
lines changed

1 file changed

+15
-3
lines changed

README.md

+15-3
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,19 @@
44
![Github Workflow Status](https://github.com/rob2d/use-viewport-sizes/actions/workflows/node.js.yml/badge.svg)
55
[![NPM](https://img.shields.io/npm/l/use-viewport-sizes.svg)](https://github.com/rob2d/use-viewport-sizes/blob/master/LICENSE)
66

7-
a tiny TS-compatible React hook which allows you to track visible window viewport size in your components w/ an optional debounce, throttle or custom memo function for updates for optimal rendering.
7+
A lightweight, TypeScript-compatible React hook for tracking viewport sizes in your components. Includes optional debounce, throttle, and custom memoization for optimized rendering.
8+
9+
## Table of Contents
10+
- [Installation](#installation)
11+
- [Benefits](#benefits)
12+
- [Usage](#usage)
13+
- [Basic Use-case](#basic-use-case)
14+
- [Measure/Update only on one dimension](#measureupdate-only-on-one-dimension)
15+
- [With Throttling](#with-throttling)
16+
- [With Debouncing](#with-debouncing)
17+
- [Only update vpW/vpH passed on specific conditions](#only-update-vpwvph-passed-on-specific-conditions)
18+
- [Support](#support)
19+
- [License](#license)
820

921
## Installation ##
1022

@@ -13,7 +25,7 @@ npm install -D use-viewport-sizes
1325
```
1426

1527
## Benefits ##
16-
- extremely lightweight and zero dependencies -- adds **2.04kb** after gzip.
28+
- extremely lightweight and zero dependencies -- adds **2.38kb** pre gzip, and **1.09kb** after gzip.
1729
- only one `window.onresize` handler used to subscribe to any changes in an unlimited number of components no matter the use-cases.
1830
- optional debounce to delay updates until user stops dragging their window for a moment; this can make expensive components with size-dependent calculations run much faster and your app feel smoother.
1931
- debouncing does not create new handlers or waste re-renders in your component; the results are also pooled from only one resize result.
@@ -125,4 +137,4 @@ Otherwise, if this was useful and you'd like to show your support, no donations
125137

126138
## License ##
127139

128-
- Open Source **[MIT license](http://opensource.org/licenses/mit-license.php)**
140+
Open Source **[MIT license](http://opensource.org/licenses/mit-license.php)**

0 commit comments

Comments
 (0)