Скачать event loop explorer - Скачать исходный код event loop explorer

event loop explorer

Данные веб-сайта

v1.9.3

Скачать

Event Loop Explorer

О проекте

Event Loop Explorer - это инструмент, который помогает понять, как Code JavaScript выполняется в браузере. Он визуализирует стек вызовов, веб -API, задачи, микротаски и рендеринг.

Скриншоты:

событие

Демонстрация:

Не стесняйтесь попробовать это здесь: https://vault-developer.github.io/event-loop-explorer/

Известные ограничения и упрощения:

Код JavaScript анализируется на AST с использованием анализатора Acorn, а затем генерируется порядок событий. Все примеры по умолчанию работают, как и ожидалось, вы можете попытаться изменить код и посмотреть, как он работает. Однако не все случаи покрыты. Async/wait, сложные обещания, SetInterval, операторы назначения не будут работать, как ожидалось.
Фаза рендеринга обычно запускается каждые 16,66 мс (60 кадров в секунду), но в этом проекте она упрощается до каждого второго круга цикла событий. Мы считаем каждый круг как 360 мс для простоты, поэтому фаза рендеринга запускается каждые 720 мс.
Пользовательский интерфейс не подходит для мобильных устройств, используйте только настольные устройства.

Вклад:

Если вы хотите внести свой вклад, не стесняйтесь разворачивать этот репозиторий и создавать запрос на тягу.
В разделе «Планы на будущее» есть много тем.
Есть вопрос или идея?
Не стесняйтесь поднять его на нашей сессии дискуссии?

Запустить локально:

 git clone [email protected]:vault-developer/event-loop-explorer.git

cd event-loop-explorer

yarn install

yarn dev

Планы на будущее:

Исправить отставание анимации в цикле Event Loop;
Добавить функциональность шага вперед;
Добавить действие GitHub, чтобы проверить PRS;
Сделайте мобильный макет более удобным для пользователя;
добавить синтаксис проверки кода;
Проверьте случаи ребра JS, включая new Promise((res) => {res(console.log(4))}) ;
Добавить переключатель в консоли, чтобы переключаться между консоли.
Добавить модульные тесты;
Очистите код, удалите Todos;