DEV Community

Cover image for Event loop visualiser for lerners
Vault Developer
Vault Developer

Posted on

Event loop visualiser for lerners

Hey dev.to!

My name is Albert, I am a software engineer.
Sometimes I help junior developers on their professional growth journey.

While the event loop concept might be challenging for learners and beginners, it’s one of the fundamentals in the frontend.

This topic was explained in several conferences and even there were some interactive playgrounds (Andrew Dillon’s simulator mostly inspired me).

However, my idea was to add more dynamics and cover all important sections:

  • web api;
  • request animation frame;
  • macro tasks;
  • micro tasks;
  • callstack;

I decided to have fun and created a small pet project.

It aims to visualize event loop steps in a browser environment.
You can change the code in the editor or select one of the existing examples.
I hope you could find it useful! Have fun!

https://vault-developer.github.io/event-loop-explorer/

P.S. Given that it's just a simulation of browser behavior, it has some limitations. Feel free to check details in readme on github!

Project is published under MIT license, any contribution is warmly welcome.

Sentry blog image

How I fixed 20 seconds of lag for every user in just 20 minutes.

Our AI agent was running 10-20 seconds slower than it should, impacting both our own developers and our early adopters. See how I used Sentry Profiling to fix it in record time.

Read more

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Discover a treasure trove of wisdom within this insightful piece, highly respected in the nurturing DEV Community enviroment. Developers, whether novice or expert, are encouraged to participate and add to our shared knowledge basin.

A simple "thank you" can illuminate someone's day. Express your appreciation in the comments section!

On DEV, sharing ideas smoothens our journey and strengthens our community ties. Learn something useful? Offering a quick thanks to the author is deeply appreciated.

Okay