3. Making Things Easier with Coroutines!

This article is part of a series, here are all the other articles:

• Part 0: Introduction
• Part 1: Shaders: displacement map and Bloom
• Part 2: Making a Small Library for particles animation
• Part 3: Making Things Easier with Coroutines ⬅️

---

In this blog post, I’ll share how I enhanced my project by using coroutines¹ to simplify complex tasks, such as chaining animations and updating game states. In JavaScript, this is achievable through function generators, a powerful feature for writing asynchronous code in a readable way.

Let’s dive into an example, showing how I managed enemy waves using coroutines:

*createEnemies() {
    // For ten waves ... 
    for (let i = 0; i < 10; i++) {
      // Spawn enemies
      EntityFactory.createEnemies(i);
      // Then wait for the end of the wave
      // Internally, will check every second if they are still enemies
      yield this.waitEndOfWave(i);

      // End of wave: wait 2 s, then go next wave
      yield this.runner.waitSeconds(2);
    }
    console.log('Well done!')
  }

In this snippet, each yield` pauses the execution until a certain condition is met, like the end of a wave. this method simplifies the implementation of complex game logic, creating clear and manageable sequences of events.

Furthermore, these coroutines, including their sub-routines, are organized in the CoroutineRunner which is integrated into the game’s Entity Component System (ECS), as a system. This integration streamlines the process of managing various game states and interactions, enhancing the overall game development experience.

Final Thoughts:

Reflecting on the use of ECS, I find APE to be superior to ECSY, with a clearer API and better performance.

That’s all for the quick overview of the technical side of my project. I’ve enjoyed learning and using technologies like Three.js for graphics, developing a particle system, and go into coroutines and ECS for game logic management.

One last feature to mention is the mini-console. It’s a handy tool that displays console.log messages directly on the game screen. This feature is particularly useful for debugging on mobile devices².

I hope my experience with this project inspires you to embark on your own creative adventures. Remember, The key is to continuously learn, experiment, and enjoy the process!

Let’s keep in touch! I’m always open to discussing new ideas, sharing experiences, and potential collaborations. Feel free to connect with me!

1. From David Beazley’s talk ↩

2. Inspired from this StackOverflow answer ↩