@patrick fix the smoothness of the animations please

src/js/animation/starBackground.js

@@ -1,14 +1,12 @@
 import Star from "./Star.js";
 import Meteor from "./Meteor.js";
 
-// State
 const starInstances = [];
 const meteorInstances = [];
 
-// Enhanced star creation with more stars
 function createStars() {
   const stars = document.getElementById("stars");
-  const count = 400; // More stars for richer background
+  const count = 400;
   stars.innerHTML = "";
   starInstances.length = 0;
 
@@ -18,7 +16,6 @@ function createStars() {
   }
 }
 
-// Inject required CSS for star animations
 function injectStarCSS() {
   const style = document.createElement("style");
   style.textContent = `
@@ -36,9 +33,8 @@ function injectStarCSS() {
   document.head.appendChild(style);
 }
 
-// More frequent meteor spawning with variable rates
 function trySpawnMeteor() {
-  const spawnChance = 0.12; // Increased spawn rate
+  const spawnChance = 0.12;
   if (Math.random() < spawnChance) {
     const stars = document.getElementById("stars");
     const newMeteor = new Meteor(stars);
@@ -46,7 +42,6 @@ function trySpawnMeteor() {
   }
 }
 
-// Enhanced animation loop
 function animateStars() {
   starInstances.forEach((star) => star.update());
 
@@ -60,7 +55,6 @@ function animateStars() {
   requestAnimationFrame(animateStars);
 }
 
-// Meteor burst effect
 function createMeteorBurst() {
   for (let i = 0; i < 3; i++) {
     setTimeout(() => {
@@ -71,20 +65,15 @@ function createMeteorBurst() {
   }
 }
 
-// Initialize everything
 function init() {
   injectStarCSS();
   createStars();
   animateStars();
 
-  // More frequent meteor spawning
   setInterval(trySpawnMeteor, 2000);
-
-  // Add occasional meteor bursts
   setInterval(createMeteorBurst, 15000);
 }
 
-// Start when DOM is ready
 if (document.readyState === "loading") {
   document.addEventListener("DOMContentLoaded", init);
 } else {