starred/f1-race-replay

Fork 0

mirror of https://github.com/IAmTomShaw/f1-race-replay.git synced 2026-05-09 16:35:49 +02:00

[GH-ISSUE #218] [Feature Request] Modern Desktop GUI implementation using Tauri & React (cross-platform) #47

New issue

Open

opened 2026-05-07 00:18:11 +02:00 by BreizhHardware · 5 comments

BreizhHardware commented

2026-05-07 00:18:11 +02:00

Owner

Originally created by @Peppe37 on GitHub (Feb 4, 2026).
Original GitHub issue: https://github.com/IAmTomShaw/f1-race-replay/issues/218

Problem Description

Currently, the tool is primarily CLI-based or uses a basic Python-integrated GUI. While powerful for developers, it lacks accessibility for "non-dev" users (amateur sim-racers, aspiring drivers) and doesn't offer the scalability of a modern, interactive telemetry dashboard.

Proposed Solution

I propose to introduce a Desktop GUI layer built with Tauri and React. This would allow the project to:

Be Distributable: Generate standalone installers (.exe, .dmg, .deb) for Windows, macOS, and Linux.
Be User-Friendly: A dedicated menu and visual interface for users who aren't comfortable with the command line.
Keep the Core Intact: The Python logic (FastF1 integration) remains the "engine," while Tauri acts as a lightweight bridge for the UI.

Key Features of the New GUI

Scalable Dashboard: Interactive charts (using Recharts/Plotly) for professional telemetry analysis (throttle, brake, steering angle).
Multi-session Management: A visual menu to browse through races and sessions without manual input.
Hybrid Approach: The CLI remains available for power users, while the GUI serves as a wrapper for visual analysis.

Why Tauri?

Performance: Much smaller bundle size and lower RAM usage compared to Electron.
Security: Better memory safety and isolation.
Modernity: Allows us to use React for a better and powerful UI experience.

Originally created by @Peppe37 on GitHub (Feb 4, 2026). Original GitHub issue: https://github.com/IAmTomShaw/f1-race-replay/issues/218 ## **Problem Description** Currently, the tool is primarily CLI-based or uses a basic Python-integrated GUI. While powerful for developers, it lacks accessibility for "non-dev" users (amateur sim-racers, aspiring drivers) and doesn't offer the scalability of a modern, interactive telemetry dashboard. ## **Proposed Solution** I propose to introduce a Desktop GUI layer built with Tauri and React. This would allow the project to: - Be Distributable: Generate standalone installers (.exe, .dmg, .deb) for Windows, macOS, and Linux. - Be User-Friendly: A dedicated menu and visual interface for users who aren't comfortable with the command line. - Keep the Core Intact: The Python logic (FastF1 integration) remains the "engine," while Tauri acts as a lightweight bridge for the UI. ## **Key Features of the New GUI** - Scalable Dashboard: Interactive charts (using Recharts/Plotly) for professional telemetry analysis (throttle, brake, steering angle). - Multi-session Management: A visual menu to browse through races and sessions without manual input. - Hybrid Approach: The CLI remains available for power users, while the GUI serves as a wrapper for visual analysis. ## **Why Tauri?** - Performance: Much smaller bundle size and lower RAM usage compared to Electron. - Security: Better memory safety and isolation. - Modernity: Allows us to use React for a better and powerful UI experience.

BreizhHardware commented

2026-05-07 00:18:12 +02:00

Author

Owner

@Lixander78 commented on GitHub (Feb 27, 2026):

Hey @IAmTomShaw and @Peppe37, I've been following the project and would love to help tackle this. I'm a junior developer with some Python experience but i am willing to work on this and for now we can implement this without breaking the current engine.

I’ve been doing some research on how we could make this work, and here’s what I was thinking.
We could package the Python code using PyInstaller and run it as a sidecar in Tauri. That way, we can keep all the FastF1 logic but still build the UI in React.

Then we could use FastAPI or a simple WebSocket server inside the Python sidecar where React app can just listen to for the live telemetry updates.

For the track map, I’ve seen that using SVG can get a bit laggy with 20+ cars moving at once. Maybe we could try using Canvas or PixiJS? It uses the GPU, so it should be easier to hit 60fps.

In the f1_data.py i see a lot of Pandas. I’ve been learning about Polars and NumPy lately, they’re supposed to be way faster for this kind of data processing. I’d love to try refactoring some of that to make the initial loading feel snappier.

At first I can put together a small 'proof of concept' if you think that’s a good direction. Let me know what you think!

@Lixander78 commented on GitHub (Feb 27, 2026): Hey @IAmTomShaw and @Peppe37, I've been following the project and would love to help tackle this. I'm a junior developer with some Python experience but i am willing to work on this and for now we can implement this without breaking the current engine. I’ve been doing some research on how we could make this work, and here’s what I was thinking. We could package the Python code using PyInstaller and run it as a sidecar in Tauri. That way, we can keep all the FastF1 logic but still build the UI in React. Then we could use FastAPI or a simple WebSocket server inside the Python sidecar where React app can just listen to for the live telemetry updates. For the track map, I’ve seen that using SVG can get a bit laggy with 20+ cars moving at once. Maybe we could try using Canvas or PixiJS? It uses the GPU, so it should be easier to hit 60fps. In the f1_data.py i see a lot of Pandas. I’ve been learning about Polars and NumPy lately, they’re supposed to be way faster for this kind of data processing. I’d love to try refactoring some of that to make the initial loading feel snappier. At first I can put together a small 'proof of concept' if you think that’s a good direction. Let me know what you think!

BreizhHardware commented

2026-05-07 00:18:12 +02:00

Author

Owner

@Peppe37 commented on GitHub (Feb 28, 2026):

Hi @Lixander78 and @IAmTomShaw ! I'm also a Python developer with quite a bit of experience. I can confirm that adapting the backend to FastAPI will be straightforward. I agree that Docker isn't the best fit for our target audience; building the backend as a Tauri Sidecar communicating via FastAPI is definitely the way to go.

I’m fully on board with the proposed stack: FastAPI, React, Tauri, TypeScript, and Vite. Regarding Pandas, I'd suggest keeping the current structure for now to keep the migration to Tauri as lean as possible, we can always optimize with Polars later if we hit bottlenecks.

On the frontend side, while I focus more on the backend, I really like your suggestion of using Canvas/PixiJS. It’s a much more robust way to ensure a smooth 60fps when rendering multiple cars compared to SVG.

I've already forked the repo to run some experiments and would love to help. I can start by focusing on the backend/API layer first and then help with the Tauri integration. Looking forward to your PoC!

@Peppe37 commented on GitHub (Feb 28, 2026): Hi @Lixander78 and @IAmTomShaw ! I'm also a Python developer with quite a bit of experience. I can confirm that adapting the backend to FastAPI will be straightforward. I agree that Docker isn't the best fit for our target audience; building the backend as a Tauri Sidecar communicating via FastAPI is definitely the way to go. I’m fully on board with the proposed stack: FastAPI, React, Tauri, TypeScript, and Vite. Regarding Pandas, I'd suggest keeping the current structure for now to keep the migration to Tauri as lean as possible, we can always optimize with Polars later if we hit bottlenecks. On the frontend side, while I focus more on the backend, I really like your suggestion of using Canvas/PixiJS. It’s a much more robust way to ensure a smooth 60fps when rendering multiple cars compared to SVG. I've already forked the repo to run some experiments and would love to help. I can start by focusing on the backend/API layer first and then help with the Tauri integration. Looking forward to your PoC!

BreizhHardware commented

2026-05-07 00:18:12 +02:00

Author

Owner

@Lixander78 commented on GitHub (Mar 1, 2026):

I've successfully implemented the integrated PoC.

Features implemented:

Orchestrator: A single run_poc.py script that manages the FastAPI sidecar and Tauri frontend lifecycle.

Telemetry Bridge: A FastAPI WebSocket server in src/services/bridge.py that hooks into the --telemetry TCP stream.

Installation

git checkout Tauri_React

Install Frontend dependencies

cd ui-v2
npm install
cd ..

Running the PoC

You can launch the entire integrated system with a single command using the orchestrator script:

Terminal 1: python main.py
(Wait until you see the cars moving in the Python window!)

Terminal 2: python run_poc.py

@Lixander78 commented on GitHub (Mar 1, 2026): <img width="2552" height="1354" alt="Image" src="https://github.com/user-attachments/assets/1aac0dac-445f-4b34-ab4a-52bf4badabfe" /> I've successfully implemented the integrated PoC. Features implemented: Orchestrator: A single run_poc.py script that manages the FastAPI sidecar and Tauri frontend lifecycle. Telemetry Bridge: A FastAPI WebSocket server in src/services/bridge.py that hooks into the --telemetry TCP stream. # Installation git checkout Tauri_React ## Install Frontend dependencies cd ui-v2 npm install cd .. ## Running the PoC You can launch the entire integrated system with a single command using the orchestrator script: Terminal 1: python main.py (Wait until you see the cars moving in the Python window!) Terminal 2: python run_poc.py

BreizhHardware commented

2026-05-07 00:18:12 +02:00

Author

Owner

@Peppe37 commented on GitHub (Mar 3, 2026):

@Lixander78 Great, where can I find the code to try?

@Peppe37 commented on GitHub (Mar 3, 2026): @Lixander78 Great, where can I find the code to try?

BreizhHardware commented

2026-05-07 00:18:13 +02:00

Author

Owner

@Lixander78 commented on GitHub (Mar 3, 2026):

Pull Request: https://github.com/IAmTomShaw/f1-race-replay/pull/240

or my fork https://github.com/Lixander78/f1-race-replay/tree/Tauri_React

@Lixander78 commented on GitHub (Mar 3, 2026): Pull Request: https://github.com/IAmTomShaw/f1-race-replay/pull/240 or my fork https://github.com/Lixander78/f1-race-replay/tree/Tauri_React