tangled
alpha
login
or
join now
cherry.computer
/
website
My personal site
cherry.computer
htmx
tailwind
axum
askama
0
fork
atom
overview
issues
pulls
pipelines
Maintain animation speed regardless of frametime
cherry.computer
3 years ago
4fabebbb
72979e0b
+9
-4
1 changed file
expand all
collapse all
unified
split
frontend
src
ts
logo.ts
+9
-4
frontend/src/ts/logo.ts
···
7
7
import { FontLoader } from "./three/FontLoader.js";
8
8
import { TextGeometry } from "./three/TextGeometry.js";
9
9
10
10
+
let previous: DOMHighResTimeStamp;
11
11
+
10
12
const scene = new Scene();
11
13
const camera = new PerspectiveCamera(40, 25 / 10, 0.1, 1000);
12
14
camera.zoom = 0.05;
···
38
40
camera.position.y = 1.9;
39
41
camera.position.z = 15;
40
42
41
41
-
function render() {
42
42
-
requestAnimationFrame(render);
43
43
+
function render(now: DOMHighResTimeStamp) {
44
44
+
const elapsed = now - (previous ?? now);
45
45
+
previous = now;
43
46
44
47
if (text) {
45
45
-
text.rotation.y += 0.1;
48
48
+
text.rotation.y += elapsed * 0.006;
46
49
}
47
50
48
51
renderer.render(scene, camera);
52
52
+
53
53
+
requestAnimationFrame(render);
49
54
}
50
55
51
51
-
render();
56
56
+
requestAnimationFrame(render);