Deploy to Vercel
For the starry sky background animation on the page, I implemented the continuous movement effect using Three.js. Initially, you will see the constantly moving animation. However, to prevent this animation from affecting the user's reading experience, the movement speed slows down almost to a stop whenever there is any mouse interaction. It will only return to the fast movement once the user stops interacting for a while.
This background component is created using React and Canvas. Since animations are typically resource-intensive, I added the client:idle Client Directive to this component to ensure it doesn't impact the page's loading speed.
This theme is inspired by the Astro theme Mia. If you prefer a brighter style, you should check out this elegant theme.
The live demo site on the theme page is my personal blog, however if you want to see more example you can visit the same demo site as shown in the screenshots above here!
