Learn how to create a game loop for an idle game in JavaScript by using delta time to smoothly increment values over time. Understand how to track total time elapsed, fix jarring increments, and prevent crashes when tabbing out. Explore the advantages of using requestAnimationFrame over setInterval and how interpolation can improve game rendering. Discover ways to structure a game loop for maintainability and the possibility of using a Web Worker for running update methods.

24m read timeFrom gist.github.com
Post cover image
Table of contents
Interval-Based Resource GeneratorsUh-oh.Stop! Delta time.Intervals: Totally improved recipe, now with more crunchy delta!A Little RefactorDeriving valueMaking no progress (or are we?)Shortening the intervalMore potentialImprovements: Better TimingImprovements: Maybe try another scheduler?Real Better Timing with Animation FramesThere’s always a tradeoff, and this one floats and pointsFixing itSeparate Rendering“Uh, I tabbed out and then your game crashed.”Bonus tip: calculating FPSDid I stutter?Cleaning UpAn ExampleWhere to go from here?I don't agree with this. It's too complex.
1 Comment

Sort: