# Insane Performance Issues (tragic)
**URL:** https://discourse.threejs.org/t/insane-performance-issues-tragic/77492
**Category:** Questions
**Tags:** performance, game-engine
**Created:** [February 3, 2025, 2:47pm UTC](https://discourse.threejs.org/t/insane-performance-issues-tragic/77492 "2025-02-03T14:47:11Z")
**Posts on this page:** 3
**Page:** 1
### Author:  [@MTSyntho](https://discourse.threejs.org/u/MTSyntho)
#### Post date: [February 3, 2025, 2:47pm UTC](https://discourse.threejs.org/t/insane-performance-issues-tragic/77492/1 "2025-02-03T14:47:11Z")
Yesterday, I was working on my game engine, built on three.js, and decided to add the ability to read project files, although through doing so, the engine cant even reach 1fps anymore.
It does a fetch request to 2 or 3 json files, each containing different information about the project, after fetching, it reads them, and calls a bunch of functions (gzjs.functionname) to do various things, like creating a sky, adding shadows, tonemapping, and adding objects into the scene. Before adding this project loading feature, everything worked flawlessly, with decent performance (around 40-50fps which i’d planned to optimize later)
i wish i could provide a code-snippet but problem is idk what file is causing this, i can only guide you to the files i’ve modified and added
> **[GitHub - MTSyntho/glunzunk-engine: Glunzunk Engine is a free 3D Game Engine for...](https://github.com/MTSyntho/glunzunk-engine)**
>
> Glunzunk Engine is a free 3D Game Engine for Windows, MacOS, Linux and Android, it has a web build for any platform that Glunzunk Engine isn't avaliable on.
changed files:
```
scripts/editor/init.js
scripts/editor/loadproject.js (might wanna take a look at this)
scripts/engine/glunzunk.js
scripts/engine/gzjs/gzjs.objects.js
```
added files:
```
scripts/engine/gzjs/gzjs.fog.js
scripts/engine/gzjs/gzjs.lighting.js
scripts/engine/gzjs/gzjs.shadow.js
scripts/engine/gzjs/gzjs.sky.js
scripts/engine/gzjs/gzjs.tonemapping.js
```
Testing the engine on mobile seems to pose no issues whatsoever 🧐
If you wanna test the project out for yourself, you may check it out here ^^
[https://mtsyntho.github.io/glunzunk-engine](https://mtsyntho.github.io/glunzunk-engine)
---
### Author:  [@manthrax](https://discourse.threejs.org/u/manthrax)
#### Post date: [February 5, 2025, 1:06am UTC](https://discourse.threejs.org/t/insane-performance-issues-tragic/77492/2 "2025-02-05T01:06:28Z")
You’re calling :
```javascript
renderer.setAnimationLoop( animate );
```
But then your animate function is also re-triggering itself:
```javascript
function animate() {
requestAnimationFrame(animate); //This is bad
renderer.render( scene, activeCamera );
}
```
Animate should just be:
```javascript
function animate() {
renderer.render( scene, activeCamera );
}
```
Either way can work, but they can’t work together.
Calling requestAnimationFrame(animate); is the Old way that animation loop worked, but this turned out to be bad for cases when multiple renders need to occur per frame (VR/AR) so setAnimationLoop was introduced. setAnimationLoop lets threejs decide when/how to rerender.
On a side note… you’re using a lot of css effects like drop shadows and stuff… those types of effects can nuke performance as well.
I don’t know if you’re using a bundler on this… some of the names looked obfuscated…
but… be really careful with bundler settings, that advertise “backward compatibility” because these can often introduce performance de-optimizations.
p.s.= Once you fix that animation loop… .try enabling antialias:true on your renderer as well.
```javascript
const renderer = new THREE.WebGLRenderer({ canvas: renderCanvas, antialias:true });
```
---
### Author:  [@MTSyntho](https://discourse.threejs.org/u/MTSyntho)
#### Post date: [February 5, 2025, 11:47am UTC](https://discourse.threejs.org/t/insane-performance-issues-tragic/77492/3 "2025-02-05T11:47:15Z")
Thank you soo much 🙏🙏