# Google Pixel Watch Running Threejs Realistic Water with Caustics as a Watch Face

> People sometimes ask me, "How do you get such good performance in your projects?" The answer is that I set very high constraints.

Canonical page: https://andersonmancini.dev/videos/google-pixel-watch-running-threejs-realistic-water-with

Published: 2024-11-07 · Duration: 1:13 · Category: Tutorials · Tags: three.js, react-three-fiber, tutorial

Watch: [YouTube](https://www.youtube.com/watch?v=c_3iN28pAso) · [Subscribe to the channel](https://www.youtube.com/@AndersonMancini?sub_confirmation=1)

Subscribe to my newsletter:

People sometimes ask me, "How do you get such good performance in your projects?" The answer is that I set very high constraints.

Here, you can see my Realistic Water with Caustics project running in the browser on a Google Pixel Watch 2. It's not React Native. It's not an app. It's just a website that behaves like a watch face. Everything works exactly the same on the computer—the interactivity, camera movements, and even the caustics calculation. I ended up making a dedicated, unpublished version for this device, and of course, I took the opportunity to make a beautiful watch face with it. It's totally useless, but a…

It's essential to have high constraints because this allows me to understand what parameters define good performance. By making my projects work on my watch, I know that it will be possible to make them work on very low-end devices.

It's amazing what threejs and react three fiber can do together!

## Links from the video

- [Live demo](https://andersonmancini.dev/)

## Related projects

- [Realistic Water](https://andersonmancini.dev/projects/realistic-water.md) — WebGL pool simulation with caustics