Roman

Такой вариант подойдет ?

let scene, camera, renderer;
let path, tubeGeometry;
const molecules = [];
const moleculeCount = 2000;
const moleculeGeometry = new THREE.SphereGeometry(0.05, 16, 16);
const moleculeMaterial = new THREE.MeshBasicMaterial({ color: 0x3076e2 });
const canvas = document.getElementById("myCanvas");
const tubeRadius = canvas.offsetWidth / 176;
const segmentCount = 400; // Увеличили количество сегментов для еще большей плавности
const rotationAngle = Math.PI / 3.5; // 45 degrees in radians
const speedCoefficient = 0.00005; // Еще медленнее движение
let clock = new THREE.Clock();
const fps = 60; // Частоту кадров оставляем на 60
let interval = 1000 / fps;
let lastTime = 0;

function init() {
  // Устанавливаем сцену, камеру и рендерер
  scene = new THREE.Scene();
  scene.background = new THREE.Color(0xffffff);
  camera = new THREE.PerspectiveCamera(75, 1, 0.1, 1000);
  renderer = new THREE.WebGLRenderer({ canvas: canvas });
  renderer.setSize(600, 600);

  createOvalPath();
  createMolecules();
  updateCameraPosition();

  window.addEventListener("resize", onWindowResize, false);
  onWindowResize();

  animate(0);
}

function createOvalPath() {
  // Создаем эллиптическую трубу пропорциональную размеру canvas
  const canvasSize = Math.min(
    renderer.domElement.width,
    renderer.domElement.height
  );
  const a = canvasSize / 35;
  const b = canvasSize / 70;
  const points = [];

  for (let i = 0; i <= segmentCount; i++) {
    const angle = (i / segmentCount) * Math.PI * 2;
    const x = a * Math.cos(angle);
    const y = b * Math.sin(angle);
    const z = 0;

    const rotatedX = x * Math.cos(rotationAngle) - z * Math.sin(rotationAngle);
    const rotatedZ = x * Math.sin(rotationAngle) + z * Math.cos(rotationAngle);

    points.push(new THREE.Vector3(rotatedX - canvasSize / 80, y, rotatedZ));
  }

  path = new THREE.CatmullRomCurve3(points);
  tubeGeometry = new THREE.TubeGeometry(path, 400, tubeRadius, 16, true);
}

function createMolecules() {
  molecules.length = 0;

  for (let i = 0; i < moleculeCount; i++) {
    const molecule = new THREE.Mesh(moleculeGeometry, moleculeMaterial);
    scene.add(molecule);
    molecules.push({
      mesh: molecule,
      position: Math.random(),
      speed: Math.random() * 0.05 + 0.01 // Еще медленное движение
    });
  }
}

function updateCameraPosition() {
  const canvasSize = Math.min(
    renderer.domElement.width,
    renderer.domElement.height
  );
  camera.position.z = canvasSize / 33;
}

function onWindowResize() {
  const canvasSize = Math.min(window.innerWidth, window.innerHeight);
  renderer.setSize(canvasSize, canvasSize);
  camera.aspect = 1;
  camera.updateProjectionMatrix();

  createOvalPath();
  updateCameraPosition();
}

function animate(time) {
  requestAnimationFrame(animate);

  const delta = clock.getDelta();

  if (time - lastTime >= interval) {
    lastTime = time;

    molecules.forEach((molecule) => {
      molecule.position += molecule.speed * delta;
      if (molecule.position > 1) molecule.position -= 1;

      const pointOnPath = path.getPointAt(molecule.position);

      molecule.mesh.position.lerp(pointOnPath, 0.05);
    });

    renderer.render(scene, camera);
  }
}

init();

function changeSVGValuesPeriodically() {
  let height = 300;
  let decreasing = true; 
  const interval = setInterval(() => {
    console.log("Current height:", height);

    let gradientColor;
    if (height >= 0 && height < 100) {
      gradientColor = "#FF0000";
    } else if (height >= 100 && height < 200) {
      gradientColor = "#FF6600"; 
    } else {
      gradientColor = "#003822"; 
    }

    if (decreasing) {
      height -= 2;
      if (height <= 0) {
        decreasing = false;
      }
    } else {
      height += 2;
      if (height >= 300) {
        decreasing = true;
      }
    }

    const svgElement = document.querySelector('.line svg');
    const rectElement = document.querySelector('.line rect');
    const imgElement = document.querySelector('.img');
    svgElement.setAttribute('height', height);
    svgElement.setAttribute('viewBox', `0 0 10 ${height}`);
    const gradientElement = document.querySelector('#paint0_linear_1633_114613');
    gradientElement.querySelector('stop').setAttribute('stop-color', gradientColor);
    gradientElement.querySelector('stop').setAttribute('offset', height / 300);
    rectElement.setAttribute('height', height);
    imgElement.style.height = `${height}px`;
  }, 40); 
}

changeSVGValuesPeriodically();

Скачай скрипт aos на свой сервер и запрашивай его в header

1. Написать слайдер самому (времени дали мало);

Зачем писать если уже есть готовые мощные инструменты?
https://swiperjs.com/
https://swiperjs.com/demos

Создаешь второй массив где постоянно вычеркиваешь выпадающее число и делаешь не полный рандом а рандом из второго массива (массива из которого вечеркиваешь числа)

Вы вообще пробовали хоть немного поковыряться в коде , все же логично
let showPerClick = 2;
а далее https://qna.habr.com/q/277777

Обратитесь в саппорт виджета, они куда лучше знают как работает их детище