text: // !--------------------------------------------------------------------------------------------------
  import './style.css'
  import * as THREE from "three";
  // !--------------------------------------------------------------------------------------------------
  let fps_cap = 30;
  
  // setup vars
  const scene = new THREE.Scene();
  const camera = new THREE.PerspectiveCamera(
    75, // fov
    window.innerWidth / window.innerHeight, // aspect ratio
    0.1,  // near
    10000 // far
  );
  
  // setup renderer
  const renderer = new THREE.WebGLRenderer({
    canvas: document.querySelector('#bg'),
  });
  
  renderer.setPixelRatio( window.setPixelRatio );
  renderer.setSize(window.innerWidth, window.innerHeight);
  // !--------------------------------------------------------------------------------------------------
  // MATERIALS
  const material1 = new THREE.MeshBasicMaterial( { color: 0x000080, wireframe: true } );
  const material2 = new THREE.MeshBasicMaterial( { color: 0x800000, wireframe: false } );
  
  // MESHES
  const torus_geometry0 = new THREE.TorusGeometry(2, 0.2, 20, 50);
  const torus0 = new THREE.Mesh( torus_geometry0, material1 );
  
  const torus_geometry1= new THREE.TorusGeometry(3, 0.2, 20, 50);
  const torus1 = new THREE.Mesh( torus_geometry1, material1 );
  
  const torus_geometry2 = new THREE.TorusGeometry(4, 0.2, 20, 50);
  const torus2 = new THREE.Mesh( torus_geometry2, material1 );
  
  const sphere_geometry = new THREE.SphereGeometry(0.75, 62, 62, 62);
  const sphere = new THREE.Mesh( sphere_geometry, material2 );
  // !--------------------------------------------------------------------------------------------------
  // FUNCS
  function AddParticles()
  {
    const star_geometry = new THREE.SphereGeometry(0.15, 10, 10);
    const star_material = new THREE.MeshBasicMaterial( { color: 0xFFFFFF } );
    const star = new THREE.Mesh (star_geometry, star_material );
  
    const [x, y, z] = Array(3).fill().map(() => THREE.MathUtils.randFloatSpread( 150 ));
    star.position.set(x, y, z);
    scene.add(star)
  }
  
  
  function MoveCamera()
  {
    const t = document.body.getBoundingClientRect().top;
  
    camera.position.z = t * -0.01 + 3.3;
    camera.rotation.x = t * 0.002;
  }
  
  function HandleScroll(scroll)
  {
    if (scroll >= 4000)
    {
      // freeze frame of bg canvas thing
    }
    else
    {
      try {   document.querySelector( '#welcome' ).style.fontSize = (  100 - ( scroll / 10 + 48 )  ) + "px";   } 
      catch (ex) {}
  
      MoveCamera();
    }
  }
  
  
  function PrepareScene()
  {
    // add objs to scene
    scene.add( torus0 );
    scene.add( torus1 );
    scene.add( torus2 );
    scene.add( sphere );
  
    // add particles
    Array(200).fill().forEach(AddParticles);
  
    // scene bg (dont even uncomment this lol)
    // scene.background = new THREE.TextureLoader().load('./assets/img.jpg');
    // scene.background.repeat = true;
  
    // set rotation start for 3 torus
    torus0.rotation.x = Math.random();
    torus0.rotation.y = Math.random();
    torus0.rotation.z = Math.random();
  
    torus1.rotation.x = Math.random();
    torus1.rotation.y = Math.random();
    torus1.rotation.z = Math.random();
  
    torus2.rotation.x = Math.random();
    torus2.rotation.y = Math.random();
    torus2.rotation.z = Math.random();
  
  
    // prepare camera
    camera.position.x = 0;
    camera.position.y = 0;
    camera.position.z = 3.3;
  
    MoveCamera();
  }
  
  
  const animate = function ()
  {
    if (fps_cap >= 5)
      setTimeout(function() {requestAnimationFrame( animate )}, 1000 / fps_cap);
    else
      fps_cap = 5;
  
    // code below
  
    torus0.rotation.x += 0.01;
    torus0.rotation.y += 0.003;
    torus0.rotation.z += 0.01;
  
    torus1.rotation.x += 0.002;
    torus1.rotation.y += 0.005;
    torus1.rotation.z += 0.002;
  
    torus2.rotation.x += 0.005;
    torus2.rotation.y += 0.0005;
    torus2.rotation.z += 0.005;
    
    // code above
    renderer.render(scene, camera);
  }
  
  
  function main()
  {
    var t0 = performance.now() // begin loading time
    
    // ---------------
    PrepareScene();
    animate();
    // ---------------
  
    // calc loading time
    var t1 = performance.now() // end time
    console.log("Loading time: " + (t1 - t0) + " ms") // loading time
  }
  // !--------------------------------------------------------------------------------------------------
  window.addEventListener("scroll", (event) => {HandleScroll(window.scrollY)});
  main();
  