https://github.com/Hyuto/yolov5-tfjs

YOLOv5 right in your browser with tensorflow.js
https://github.com/Hyuto/yolov5-tfjs

object-detection react tensorflowjs webapp yolov5

Last synced: about 3 hours ago
JSON representation

YOLOv5 right in your browser with tensorflow.js

• Host: GitHub
• URL: https://github.com/Hyuto/yolov5-tfjs
• Owner: Hyuto
• Created: 2022-03-28T07:39:58.000Z (over 2 years ago)
• Default Branch: master
• Last Pushed: 2023-05-10T16:49:50.000Z (over 1 year ago)
• Last Synced: 2024-05-02T05:47:02.863Z (6 months ago)
• Topics: object-detection, react, tensorflowjs, webapp, yolov5
• Language: JavaScript
• Homepage: https://hyuto.github.io/yolov5-tfjs/
• Size: 8.83 MB
• Stars: 71
• Watchers: 4
• Forks: 25
• Open Issues: 2
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Object Detection using YOLOv5 and Tensorflow.js



  



![love](https://img.shields.io/badge/Made%20with-🖤-white)

![tensorflow.js](https://img.shields.io/badge/tensorflow.js-white?logo=tensorflow)

---

[**More Feature Version**](https://hyuto.github.io/showcase/yolov5-tfjs)

---

Object Detection application right in your browser. Serving YOLOv5 in browser using tensorflow.js

with `webgl` backend.

**Setup**

```bash

git clone https://github.com/Hyuto/yolov5-tfjs.git

cd yolov5-tfjs

yarn install #Install dependencies

```

**Scripts**

```bash

yarn start # Start dev server

yarn build # Build for productions

```

## Model

YOLOv5n model converted to tensorflow.js.

```

used model : yolov5n

size       : 7.5 Mb

```

**Use another model**

Use another YOLOv5 model.

1. Clone [yolov5](https://github.com/ultralytics/yolov5) repository

   ```bash

   git clone https://github.com/ultralytics/yolov5.git && cd yolov5

   ```

   Install `requirements.txt` first

   ```bash

   pip install -r requirements.txt

   ```

2. Export model to tensorflow.js format

   ```bash

   export.py --weights yolov5*.pt --include tfjs

   ```

3. Copy `yolov5*_web_model` to `./public`

4. Update `modelName` in `App.jsx` to new model name

   ```jsx

   ...

   // model configs

   const modelName = "yolov5*"; // change to new model name

   const classThreshold = 0.25;

   ...

   ```

5. Done! 😊

## Reference

https://github.com/ultralytics/yolov5