https://github.com/jeetiss/react-gifs

react tools for GIFs
https://github.com/jeetiss/react-gifs

Last synced: 2 days ago
JSON representation

react tools for GIFs

• Host: GitHub
• URL: https://github.com/jeetiss/react-gifs
• Owner: jeetiss
• Created: 2021-02-28T19:53:58.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2021-09-03T07:29:33.000Z (about 3 years ago)
• Last Synced: 2024-09-04T18:23:28.522Z (29 days ago)
• Language: JavaScript
• Homepage: https://jeetiss.github.io/react-gifs/
• Size: 1.43 MB
• Stars: 33
• Watchers: 4
• Forks: 7
• Open Issues: 3
• Metadata Files:
  • Readme: readme.md

Awesome Lists containing this project

README

        
# react gifs

Set of react tools for GIF rendering



  





  





  



## Features

- __small__ : Just 4.99 KB gzipped code

- __modular__ : Use hooks and components that you need

- __fast__ : Uses web workers for parsing

## Getting Started

```

npm install @react-gifs/tools

```

```js

import { useWorkerParser, usePlayerState, usePlayback, Canvas } from "@react-gifs/tools";

const Gif = (src) => {

  // default state

  const [state, update] = usePlayerState();

  //  load and parse gif

  useWorkerParser(src, update);

  // updates current index

  usePlayback(state, () => update(({ index }) => ({ index: index + 1 })));

  // render frames

  return ;

};

```

## Demos

- [gh-pages](https://jeetiss.github.io/react-gifs/)