Перейти к содержимому

O Event Loop Não É Mágica: Por que sua UI trava mesmo com Promises?

Prof. Gabriel Gadelha

0:00 / 0:00

O Event Loop Não É Mágica: Por que sua UI trava mesmo com Promises?

50 просмотров · 10 часов назад
Prof. Gabriel Gadelha
1,67 тыс. подписчиков
50 просмотров · 10 часов назад
O Event Loop não é mágica. Entenda por que sua interface trava mesmo com Promises JavaScript e como o navegador gerencia o processamento. Nesta aula, desmistificamos a execução de código JavaScript assíncrono abrindo o funcionamento interno do motor de execução. Você verá na prática a diferença entre o que entra na Microtask Queue e o que vai para a Task Queue, utilizando exemplos reais que provam a ordem exata de processamento das suas chamadas. Muitos desenvolvedores acreditam que as Promises resolvem todos os problemas de travamento, mas entender o Event Loop é o que separa quem apenas usa a linguagem de quem domina sua arquitetura. Vamos analisar diagramas e fluxos de execução para garantir que seu código não bloqueie a UI por desconhecimento das regras de prioridade. Sem atalhos superficiais e sem explicações mágicas: compreenda o que o navegador faz a cada milissegundo e como as decisões de concorrência afetam a experiência do seu usuário. 📌 O que você vai aprender neste vídeo: • A ilusão do paralelismo: por que assíncrono não significa multi-thread no browser • A anatomia do motor: Call Stack, Web APIs, Task Queue e Microtask Queue • Por que Promise.resolve().then() tem prioridade absoluta sobre o setTimeout(0) • Microtask Starvation: o erro silencioso que congela UIs e zera o Core Web Vitals (INP) • A conexão com o React: por que o React Fiber e o startTransition foram inventados 🕒 Capítulos (Timestamps): 00:00 O enigma do setTimeout(0) vs Promise 02:10 A grande ilusão: a thread única da Web 04:00 As quatro engrenagens: Call Stack, Web APIs e as Filas 05:50 Entenda o Event Loop 06:40 Investigação prática: por que a Promise ganha a corrida? 10:45 O crime da performance: Microtask Starvation na prática 13:50 A Engenharia do React: como o React Fiber evita travar o Event Loop 15:55 Síntese dos fundamentos e introdução ao Vídeo 04 (O DOM por baixo dos panos) 💬 Deixe seu comentário: Você já enfrentou em produção algum travamento severo de tela causado por funções assíncronas que pareciam inofensivas? Compartilhe seu caso aqui embaixo! 🔔 Inscreva-se no canal e acompanhe a playlist completa: do JavaScript puro à arquitetura avançada de Front-end com React e Next.js.