Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/luizbizzio/refreshrate

๐Ÿ–ฅ๏ธ๐Ÿ”ƒ Refresh Rate Test: A real-time tool to monitor your screen's refresh rate and FPS. It visualizes performance with ghost count animations, helping you optimize display settings for the smoothest visual experience.
https://github.com/luizbizzio/refreshrate

animation app check color display fps frame hardware info monitor monitoring performance pixel refresh-rate resolution screen settings test web website

Last synced: 19 days ago
JSON representation

๐Ÿ–ฅ๏ธ๐Ÿ”ƒ Refresh Rate Test: A real-time tool to monitor your screen's refresh rate and FPS. It visualizes performance with ghost count animations, helping you optimize display settings for the smoothest visual experience.

Awesome Lists containing this project

README

        

# Refresh Rate Test ๐Ÿ–ฅ๏ธ๐Ÿ”ƒ
## Overview ๐Ÿš€

[Refresh Rate Test](https://refreshrate.app) is your go-to tool for real-time monitoring of your screen's refresh rate and performance metrics. Whether you're a gamer, developer, or just curious about your display's capabilities, our app helps you optimize your settings for the smoothest visual experience.

- **๐Ÿ“ฑ Cross-Platform:** Works seamlessly on both mobile and desktop devices.
- **๐ŸŒ Offline Access:** Install as a web app and use it without an internet connection.
- **๐ŸŽจ Customizable:** Personalize your experience with adjustable settings and themes.




Desktop Screenshot ย 
Mobile Screenshot


---

## Features ๐Ÿš€

- **๐Ÿ” Real-Time Monitoring:** Instantly track FPS, refresh rate, and more.
- **โœจ Interactive Animations:** Visual elements that respond to your screen's performance.
- **๐ŸŽ›๏ธ Custom Controls:** Adjust background colors, decimal places, and update intervals.
- **๐Ÿ“ฅ Offline Mode:** Use the app without an internet connection by installing it as a web app.
- **๐Ÿ“ฑ Responsive Design:** Optimized for both mobile and desktop browsers for a perfect fit on any device.

---

## Usage ๐Ÿ–ฅ๏ธ

1. **๐Ÿ”— Access the Tool:**
- Open [https://refreshrate.app](https://refreshrate.app) on your device.

2. **๐Ÿ› ๏ธ Navigate the Interface:**
- **โœจ Animations:** Watch visual elements react to your screen's refresh rate.
- **๐Ÿ‘ป Ghost Count:** Observe the number of ghost images to assess your monitor's performance.
- **๐ŸŽ›๏ธ Controls:** Customize settings like background color, decimal places, and update intervals to suit your preferences.

3. **๐Ÿ”ฒ Fullscreen Mode:**
- Click the **Enter Fullscreen** button to maximize the view and enhance your monitoring experience.

4. **๐Ÿ“ฅ Offline Access:**
- Install the web app to continue using **Refresh Rate App** without an internet connection.

---

## How It Works ๐Ÿงช

### Ghost Count Magic ๐Ÿ‘ป

Ever wondered how smooth your screen feels? **Refresh Rate Test** uses our **Ghost Count** feature to show you in a fun and visual way! Hereโ€™s how it works:

- **๐Ÿ‘ป Ghost Images:** Imagine a ball moving across your screen, leaving behind faint, transparent copies of itself. These are the "ghost" images!

- **๐Ÿ”„ Refresh Rate (Hz):**
- **Higher Refresh Rates (e.g., 144Hz):** Your screen updates 144 times every second! More updates mean the ball moves smoothly, leaving lots of ghost images.
- **Lower Refresh Rates (e.g., 60Hz):** Your screen updates 60 times every second. Fewer updates mean fewer ghost images.

- **๐ŸŽฎ Frames Per Second (FPS):**
- **Higher FPS:** The app renders more frames each second, creating more ghost images for fluid motion.
- **Lower FPS:** Fewer frames per second result in fewer ghost images, making motion look choppy.

---

### The Science Behind the Fun ๐Ÿง 

Letโ€™s break it down with some simple math and examples!

1. **Understanding Refresh Rate (Hz):**
- **Definition:** How many times your screen updates every second.
- **Example for 60Hz:**
- **Total Time in a Second:** 1000 milliseconds (ms).
- **Time per Refresh:** 1000ms / 60Hz โ‰ˆ **16.67ms** per refresh.

2. **Frames Per Second (FPS):**
- **Definition:** How many frames the app renders each second.
- **Example for 60FPS:**
- **Frame Duration:** 1000ms / 60FPS โ‰ˆ **16.67ms** per frame.

3. **Traversal Time Options:**
- **Traversal Time:** How quickly the ball moves across the screen.
- **Options:** 50ms, 100ms, 250ms, 500ms, and **1000ms**.

---

### Dynamic Ghost Count Options ๐ŸŽฏ

**Refresh Rate Test** lets you choose how fast the ball crosses the screen. Here's what happens:

- **๐Ÿ”น Example on a 60Hz Screen with 60FPS:**
- **1000ms Traversal Time:**
- **Calculation:** 1000ms / 16.67ms per frame โ‰ˆ **60 ghosts**
- **What It Means:** The ball takes 1 second to cross, leaving 60 ghost imagesโ€”one for each frame.
- **50ms Traversal Time:**
- **Calculation:** 50ms / 16.67ms per frame โ‰ˆ **3 ghosts**
- **What It Means:** The ball crosses the screen in 50ms, leaving only 3 ghost images for a snappier motion.

- **๐Ÿ”น Example on a 90Hz Screen with 90FPS:**
- **1000ms Traversal Time:**
- **Calculation:** 1000ms / 11.11ms per frame โ‰ˆ **90 ghosts**
- **What It Means:** The ball takes 1 second to cross, leaving 90 ghost images.
- **50ms Traversal Time:**
- **Calculation:** 50ms / 11.11ms per frame โ‰ˆ **5 ghosts**
- **What It Means:** The ball crosses the screen in 50ms, leaving 5 ghost images.

### Quick Example Scenarios ๐Ÿงฎ

| **Traversal Time** | **Monitor Refresh Rate (Hz)** | **FPS** | **Number of Ghosts** | **Time Represented** |
|--------------------|-------------------------------|---------|-----------------------|-----------------------|
| 50ms | 60Hz | 60FPS | 3 | 50ms |
| 1000ms | 60Hz | 60FPS | 60 | 1000ms (1 second) |
| 50ms | 240Hz | 240FPS | 120 | 50ms |
| 1000ms | 240Hz | 240FPS | 240 | 1000ms (1 second) |

### Takeaway ๐Ÿ’ก

- **More Ghosts = Smoother Motion:** Higher refresh rates and FPS create more ghost images, making motion appear fluid.
- **Fewer Ghosts = Snappier Motion:** Faster traversal times with fewer ghosts make animations look quicker and more responsive.

By adjusting the traversal time, you can see how your monitor's refresh rate and the app's FPS work together to create different visual experiences. Itโ€™s like having a little ghost tracker showing you exactly how smooth your display is!

---

## License ๐Ÿ“„

This project is licensed under the **Apache License 2.0** - see the [LICENSE](LICENSE) file for details.