Javascript
Event Loop
@carlosxjm
@frontendce
We're hiring
Insta: @kdti.dev Github: @kdti Site: http://kdti.dev
Por que devemos entender o Event Loop?
O que é Event Loop?
Task Queue
Call Stack
Call Stack
function multiply (a, b) {
return a * b
}
function square (a) {
return multiply(a, a)
}
function printSquare (a) {
var s = square(a)
console.log(s)
}
printSquare(2)
Call Stack
function multiply (a, b) {
return a * b
}
function square (a) {
return multiply(a, a)
}
function printSquare (a) {
var s = square(a)
console.log(s)
}
printSquare(2)
main
Call Stack
function multiply (a, b) {
return a * b
}
function square (a) {
return multiply(a, a)
}
function printSquare (a) {
var s = square(a)
console.log(s)
}
printSquare(2)
main
printSquare
Call Stack
function multiply (a, b) {
return a * b
}
function square (a) {
return multiply(a, a)
}
function printSquare (a) {
var s = square(a)
console.log(s)
}
printSquare(2)
main
printSquare
square
Call Stack
function multiply (a, b) {
return a * b
}
function square (a) {
return multiply(a, a)
}
function printSquare (a) {
var s = square(a)
console.log(s)
}
printSquare(2)
main
printSquare
square
multiply
Call Stack
function multiply (a, b) {
return a * b
}
function square (a) {
return multiply(a, a)
}
function printSquare (a) {
var s = square(a)
console.log(s)
}
printSquare(2)
main
printSquare
square
multiply
Call Stack
function multiply (a, b) {
return a * b
}
function square (a) {
return multiply(a, a)
}
function printSquare (a) {
var s = square(a)
console.log(s)
}
printSquare(2)
main
printSquare
square
Call Stack
function multiply (a, b) {
return a * b
}
function square (a) {
return multiply(a, a)
}
function printSquare (a) {
var s = square(a)
console.log(s)
}
printSquare(2)
main
printSquare
console.log
Call Stack
function multiply (a, b) {
return a * b
}
function square (a) {
return multiply(a, a)
}
function printSquare (a) {
var s = square(a)
console.log(s)
}
printSquare(2)
main
Call Stack
function multiply (a, b) {
return a * b
}
function square (a) {
return multiply(a, a)
}
function printSquare (a) {
var s = square(a)
console.log(s)
}
printSquare(2)
Call Stack
function c () {
console.log(window.test.i)
}
function b () {
c()
}
function a () {
b()
}
a()
main
Call Stack
function c () {
console.log(window.test.i)
}
function b () {
c()
}
function a () {
b()
}
a()
main
a
b
c
Call Stack
function c () {
console.log(window.test.i)
}
function b () {
c()
}
function a () {
b()
}
a()
main
a
b
c
Call Stack
function a () {
a()
}
a()
main
Call Stack
function a () {
a()
}
a()
main
a
Call Stack
function a () {
a()
}
a()
main
a
a
a
a
a
a
a
a
a
Web APIs
setTimeout
Event Loop and render
Obrigado!
@carlosxjm
@frontendce