SlideShare a Scribd company logo
JavaScript Event Loop
Not yo mama’s multithreaded approach.
slidesha.re/ZPC2nD
Who is Thomas Hunter?
• Web developer for 8+ years
• Dow, Ford, Quicken, Startup, Barracuda
• Started development with PHP & MySQL
• Became a Node.js fanboy
• Writing a book on Backbone.js for Packt
• @tlhunter | me@thomashunter.name
What does MultiThreaded mean?
• Makes use of separate CPU Cores as “Threads”
• Uses a single process within the Operating System
• True concurrency
• Can have Race Conditions (simultaneous memory use)
• “Hard” to get it right
• Ran out of Ghz, hardware adds more cores
JavaScript is SingleThreaded
• Makes use of a single CPU core
• CPU intensive work is never “concurrent”
• Easier to pull off, as in less technical difficulties
Technical Implementation
• Stack:
• Functions to run and available variables
• More added as code is run
• Stuff guaranteed to run in order
• Heap:
• “Chaotic” listing of objects
• Queue:
• Gets added to stack when stack empty
• setTimeout and setInterval added here
Credit: Mozilla Developer Network
http://mzl.la/Y5Dh2x
Example Code-run
console.log("Adding code to the queue");
setTimeout(function() { // Added somewhere in Heap
console.log("Running next code from queue");
}, 0);
function a(x) { // Added somewhere in Heap
console.log("a() frame added to stack");
b(x);
console.log("a() frame removed from stack");
}
function b(y) { // Added somewhere in Heap
console.log("b() frame added to stack");
console.log("Value passed in is " + y);
console.log("b() frame removed from stack");
}
console.log("Starting work for this stack");
a(42);
console.log("Ending work for this stack");
Adding code to the queue
Starting work for this stacka() frame added to stackb()frame added to stackValue passed in is 42b() frameremoved from stacka() frame removed fromstackEnding work for this stackRunning next codefrom queue
Your App is Mostly Asleep
• Node.js:All I/O is non-blocking
• E.g. it gets thrown into the Queue
• Browser:Wait for a click to happen
• PHP:Wait for a MySQL query to run
• These show how slow I/O can be →
L1-Cache 3 cyclesL2-Cache
14 cyclesRAM 250
cyclesDisk 41,000,000
Network 240,000,000
Sequential vs Parallel
• Traditional web apps perform each I/O Sequentially
• With an Event Loop, they can be run in Parallel
• Since most time is wasted doing I/O, very inefficient
Non JS Event Loops
• Event Loops can be implemented in other languages
• However, JavaScript was built this way, feels “natural”
• Examples:
• Ruby: EventMachine
• Python:Twisted & Tornado
• PHP: ReactPHP
!JS Event Loop Examples
require 'eventmachine'
module Echo
def post_init
puts "Someone Connected"
end
def receive_data data
send_data "#{data}"
close_connection if data =~ /quit/if
end
end
EventMachine.run {
EventMachine.start_server "127.0.0.1", 8081, Echo
}
var net = require('net');
var server = net.createServer(function (socket) {
console.log('Someone Connected');
socket.pipe(socket);
});
server.listen(1337, '127.0.0.1');
EventMachine in Ruby Node.js
Event Loops are Awesome!
• No race conditions
• Typical web apps spend their time waiting on I/O
• No funky syntax; it just works
• Perform I/O operations “in parallel” easily
• Stateful web applications are easy compared to PHP
• Long run apps, don’t need web servers, shared data...
Event Loops aren’t Awesome!
• CPU intensive work will block your process
• You can offload work to different processes (Node.js)
• It isn’t making use of those 8 cores you’ve got
• You can use the Multi-node module though (Node.js)
• Memory leaks are possible, not so with PHP
• You can program better and prevent it though ;-)
Web Workers
• You can use MultiThreaded JavaScript in your browser
• IE10, Firefox 3.5, Chrome 4, Safari 4, Opera 10.6
• var worker = new Worker('task.js');
• Use Message Passing to share data
• You share simple JSON data, not complex objects
• Prevents deadlocks/race conditions because of this
Conclusion
• Great for I/O bound applications (most web apps)
• Horrible for CPU bound applications (do it in C ;)
• Appears to be a single multi-threaded process
• “Fakes” concurrency
• thomashunter.name @tlhunter slidesha.re/ZPC2nD

More Related Content

What's hot

Debugging Effectively
Debugging EffectivelyDebugging Effectively
Debugging EffectivelyColin O'Dell
 
REST APIs with Spring
REST APIs with SpringREST APIs with Spring
REST APIs with SpringJoshua Long
 
Introduction to Apache Camel
Introduction to Apache CamelIntroduction to Apache Camel
Introduction to Apache CamelClaus Ibsen
 
Nodejs Explained with Examples
Nodejs Explained with ExamplesNodejs Explained with Examples
Nodejs Explained with ExamplesGabriele Lana
 
Node.js Tutorial for Beginners | Node.js Web Application Tutorial | Node.js T...
Node.js Tutorial for Beginners | Node.js Web Application Tutorial | Node.js T...Node.js Tutorial for Beginners | Node.js Web Application Tutorial | Node.js T...
Node.js Tutorial for Beginners | Node.js Web Application Tutorial | Node.js T...Edureka!
 
Introduction to RxJS
Introduction to RxJSIntroduction to RxJS
Introduction to RxJSBrainhub
 
Building RESTful applications using Spring MVC
Building RESTful applications using Spring MVCBuilding RESTful applications using Spring MVC
Building RESTful applications using Spring MVCIndicThreads
 
Advance Java Topics (J2EE)
Advance Java Topics (J2EE)Advance Java Topics (J2EE)
Advance Java Topics (J2EE)slire
 
Asynchronous javascript
 Asynchronous javascript Asynchronous javascript
Asynchronous javascriptEman Mohamed
 
Spring boot
Spring bootSpring boot
Spring bootsdeeg
 
Spring Boot and REST API
Spring Boot and REST APISpring Boot and REST API
Spring Boot and REST API07.pallav
 
Introduction to Node.js
Introduction to Node.jsIntroduction to Node.js
Introduction to Node.jsVikash Singh
 
Spring boot Introduction
Spring boot IntroductionSpring boot Introduction
Spring boot IntroductionJeevesh Pandey
 
Introduction to java
Introduction to java Introduction to java
Introduction to java Sandeep Rawat
 

What's hot (20)

Angular 2 observables
Angular 2 observablesAngular 2 observables
Angular 2 observables
 
Debugging Effectively
Debugging EffectivelyDebugging Effectively
Debugging Effectively
 
Introduction to spring boot
Introduction to spring bootIntroduction to spring boot
Introduction to spring boot
 
REST APIs with Spring
REST APIs with SpringREST APIs with Spring
REST APIs with Spring
 
Node.js Basics
Node.js Basics Node.js Basics
Node.js Basics
 
NodeJS for Beginner
NodeJS for BeginnerNodeJS for Beginner
NodeJS for Beginner
 
Introduction to Apache Camel
Introduction to Apache CamelIntroduction to Apache Camel
Introduction to Apache Camel
 
Nodejs Explained with Examples
Nodejs Explained with ExamplesNodejs Explained with Examples
Nodejs Explained with Examples
 
Node.js Tutorial for Beginners | Node.js Web Application Tutorial | Node.js T...
Node.js Tutorial for Beginners | Node.js Web Application Tutorial | Node.js T...Node.js Tutorial for Beginners | Node.js Web Application Tutorial | Node.js T...
Node.js Tutorial for Beginners | Node.js Web Application Tutorial | Node.js T...
 
Introduction to RxJS
Introduction to RxJSIntroduction to RxJS
Introduction to RxJS
 
Building RESTful applications using Spring MVC
Building RESTful applications using Spring MVCBuilding RESTful applications using Spring MVC
Building RESTful applications using Spring MVC
 
Advance Java Topics (J2EE)
Advance Java Topics (J2EE)Advance Java Topics (J2EE)
Advance Java Topics (J2EE)
 
Asynchronous javascript
 Asynchronous javascript Asynchronous javascript
Asynchronous javascript
 
Spring boot
Spring bootSpring boot
Spring boot
 
Spring Boot and REST API
Spring Boot and REST APISpring Boot and REST API
Spring Boot and REST API
 
Introduction to Node.js
Introduction to Node.jsIntroduction to Node.js
Introduction to Node.js
 
React native
React nativeReact native
React native
 
Maven Introduction
Maven IntroductionMaven Introduction
Maven Introduction
 
Spring boot Introduction
Spring boot IntroductionSpring boot Introduction
Spring boot Introduction
 
Introduction to java
Introduction to java Introduction to java
Introduction to java
 

Viewers also liked

Understanding the Single Thread Event Loop
Understanding the Single Thread Event LoopUnderstanding the Single Thread Event Loop
Understanding the Single Thread Event LoopTorontoNodeJS
 
Extending built in objects
Extending built in objectsExtending built in objects
Extending built in objectsMuhammad Ahmed
 
A Deeper look into Javascript Basics
A Deeper look into Javascript BasicsA Deeper look into Javascript Basics
A Deeper look into Javascript BasicsMindfire Solutions
 
Js interpreter interpreted
Js interpreter interpretedJs interpreter interpreted
Js interpreter interpretedMartha Schumann
 
Advanced Object-Oriented JavaScript
Advanced Object-Oriented JavaScriptAdvanced Object-Oriented JavaScript
Advanced Object-Oriented JavaScriptecker
 
Node.js in action
Node.js in actionNode.js in action
Node.js in actionSimon Su
 
Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)
Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)
Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)raja kvk
 

Viewers also liked (9)

Understanding the Single Thread Event Loop
Understanding the Single Thread Event LoopUnderstanding the Single Thread Event Loop
Understanding the Single Thread Event Loop
 
Event loop
Event loopEvent loop
Event loop
 
Extending built in objects
Extending built in objectsExtending built in objects
Extending built in objects
 
Array
ArrayArray
Array
 
A Deeper look into Javascript Basics
A Deeper look into Javascript BasicsA Deeper look into Javascript Basics
A Deeper look into Javascript Basics
 
Js interpreter interpreted
Js interpreter interpretedJs interpreter interpreted
Js interpreter interpreted
 
Advanced Object-Oriented JavaScript
Advanced Object-Oriented JavaScriptAdvanced Object-Oriented JavaScript
Advanced Object-Oriented JavaScript
 
Node.js in action
Node.js in actionNode.js in action
Node.js in action
 
Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)
Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)
Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)
 

Similar to JavaScript Event Loop

introduction to node.js
introduction to node.jsintroduction to node.js
introduction to node.jsorkaplan
 
Introduction to Node.js: What, why and how?
Introduction to Node.js: What, why and how?Introduction to Node.js: What, why and how?
Introduction to Node.js: What, why and how?Christian Joudrey
 
Basic Understanding and Implement of Node.js
Basic Understanding and Implement of Node.jsBasic Understanding and Implement of Node.js
Basic Understanding and Implement of Node.jsGary Yeh
 
FITC - Node.js 101
FITC - Node.js 101FITC - Node.js 101
FITC - Node.js 101Rami Sayar
 
Introduction to Node.js
Introduction to Node.jsIntroduction to Node.js
Introduction to Node.jsRichard Lee
 
Scalable server component using NodeJS & ExpressJS
Scalable server component using NodeJS & ExpressJSScalable server component using NodeJS & ExpressJS
Scalable server component using NodeJS & ExpressJSAndhy Koesnandar
 
Node.js 101 with Rami Sayar
Node.js 101 with Rami SayarNode.js 101 with Rami Sayar
Node.js 101 with Rami SayarFITC
 
Practical Use of MongoDB for Node.js
Practical Use of MongoDB for Node.jsPractical Use of MongoDB for Node.js
Practical Use of MongoDB for Node.jsasync_io
 
Node.js introduction
Node.js introductionNode.js introduction
Node.js introductionPrasoon Kumar
 
Node.js: The What, The How and The When
Node.js: The What, The How and The WhenNode.js: The What, The How and The When
Node.js: The What, The How and The WhenFITC
 
"You Don't Know NODE.JS" by Hengki Mardongan Sihombing (Urbanhire)
"You Don't Know NODE.JS" by Hengki Mardongan Sihombing (Urbanhire)"You Don't Know NODE.JS" by Hengki Mardongan Sihombing (Urbanhire)
"You Don't Know NODE.JS" by Hengki Mardongan Sihombing (Urbanhire)Tech in Asia ID
 
Nodejs a-practical-introduction-oredev
Nodejs a-practical-introduction-oredevNodejs a-practical-introduction-oredev
Nodejs a-practical-introduction-oredevFelix Geisendörfer
 
Nodejs - Should Ruby Developers Care?
Nodejs - Should Ruby Developers Care?Nodejs - Should Ruby Developers Care?
Nodejs - Should Ruby Developers Care?Felix Geisendörfer
 
NodeJS Concurrency
NodeJS ConcurrencyNodeJS Concurrency
NodeJS Concurrencypgriess
 
Firefox Crash Reporting (@ Open Source Bridge)
Firefox Crash Reporting (@ Open Source Bridge)Firefox Crash Reporting (@ Open Source Bridge)
Firefox Crash Reporting (@ Open Source Bridge)lauraxthomson
 
Crash reports pycodeconf
Crash reports pycodeconfCrash reports pycodeconf
Crash reports pycodeconflauraxthomson
 
Evented Ruby VS Node.js
Evented Ruby VS Node.jsEvented Ruby VS Node.js
Evented Ruby VS Node.jsNitin Gupta
 

Similar to JavaScript Event Loop (20)

introduction to node.js
introduction to node.jsintroduction to node.js
introduction to node.js
 
Introduction to Node.js: What, why and how?
Introduction to Node.js: What, why and how?Introduction to Node.js: What, why and how?
Introduction to Node.js: What, why and how?
 
Basic Understanding and Implement of Node.js
Basic Understanding and Implement of Node.jsBasic Understanding and Implement of Node.js
Basic Understanding and Implement of Node.js
 
FITC - Node.js 101
FITC - Node.js 101FITC - Node.js 101
FITC - Node.js 101
 
Introduction to Node.js
Introduction to Node.jsIntroduction to Node.js
Introduction to Node.js
 
Scalable server component using NodeJS & ExpressJS
Scalable server component using NodeJS & ExpressJSScalable server component using NodeJS & ExpressJS
Scalable server component using NodeJS & ExpressJS
 
Node.js 101 with Rami Sayar
Node.js 101 with Rami SayarNode.js 101 with Rami Sayar
Node.js 101 with Rami Sayar
 
Practical Use of MongoDB for Node.js
Practical Use of MongoDB for Node.jsPractical Use of MongoDB for Node.js
Practical Use of MongoDB for Node.js
 
Node.js introduction
Node.js introductionNode.js introduction
Node.js introduction
 
Node.js: The What, The How and The When
Node.js: The What, The How and The WhenNode.js: The What, The How and The When
Node.js: The What, The How and The When
 
"You Don't Know NODE.JS" by Hengki Mardongan Sihombing (Urbanhire)
"You Don't Know NODE.JS" by Hengki Mardongan Sihombing (Urbanhire)"You Don't Know NODE.JS" by Hengki Mardongan Sihombing (Urbanhire)
"You Don't Know NODE.JS" by Hengki Mardongan Sihombing (Urbanhire)
 
Nodejs a-practical-introduction-oredev
Nodejs a-practical-introduction-oredevNodejs a-practical-introduction-oredev
Nodejs a-practical-introduction-oredev
 
Node azure
Node azureNode azure
Node azure
 
Nodejs - Should Ruby Developers Care?
Nodejs - Should Ruby Developers Care?Nodejs - Should Ruby Developers Care?
Nodejs - Should Ruby Developers Care?
 
NodeJS Concurrency
NodeJS ConcurrencyNodeJS Concurrency
NodeJS Concurrency
 
Node and Azure
Node and AzureNode and Azure
Node and Azure
 
Firefox Crash Reporting (@ Open Source Bridge)
Firefox Crash Reporting (@ Open Source Bridge)Firefox Crash Reporting (@ Open Source Bridge)
Firefox Crash Reporting (@ Open Source Bridge)
 
Nodejs - A quick tour (v6)
Nodejs - A quick tour (v6)Nodejs - A quick tour (v6)
Nodejs - A quick tour (v6)
 
Crash reports pycodeconf
Crash reports pycodeconfCrash reports pycodeconf
Crash reports pycodeconf
 
Evented Ruby VS Node.js
Evented Ruby VS Node.jsEvented Ruby VS Node.js
Evented Ruby VS Node.js
 

Recently uploaded

Measures in SQL (a talk at SF Distributed Systems meetup, 2024-05-22)
Measures in SQL (a talk at SF Distributed Systems meetup, 2024-05-22)Measures in SQL (a talk at SF Distributed Systems meetup, 2024-05-22)
Measures in SQL (a talk at SF Distributed Systems meetup, 2024-05-22)Julian Hyde
 
AI revolution and Salesforce, Jiří Karpíšek
AI revolution and Salesforce, Jiří KarpíšekAI revolution and Salesforce, Jiří Karpíšek
AI revolution and Salesforce, Jiří KarpíšekCzechDreamin
 
Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...
Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...
Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...Product School
 
Key Trends Shaping the Future of Infrastructure.pdf
Key Trends Shaping the Future of Infrastructure.pdfKey Trends Shaping the Future of Infrastructure.pdf
Key Trends Shaping the Future of Infrastructure.pdfCheryl Hung
 
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024Tobias Schneck
 
How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...Product School
 
PLAI - Acceleration Program for Generative A.I. Startups
PLAI - Acceleration Program for Generative A.I. StartupsPLAI - Acceleration Program for Generative A.I. Startups
PLAI - Acceleration Program for Generative A.I. StartupsStefano
 
Search and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical FuturesSearch and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical FuturesBhaskar Mitra
 
IoT Analytics Company Presentation May 2024
IoT Analytics Company Presentation May 2024IoT Analytics Company Presentation May 2024
IoT Analytics Company Presentation May 2024IoTAnalytics
 
Designing Great Products: The Power of Design and Leadership by Chief Designe...
Designing Great Products: The Power of Design and Leadership by Chief Designe...Designing Great Products: The Power of Design and Leadership by Chief Designe...
Designing Great Products: The Power of Design and Leadership by Chief Designe...Product School
 
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...Product School
 
Exploring UiPath Orchestrator API: updates and limits in 2024 🚀
Exploring UiPath Orchestrator API: updates and limits in 2024 🚀Exploring UiPath Orchestrator API: updates and limits in 2024 🚀
Exploring UiPath Orchestrator API: updates and limits in 2024 🚀DianaGray10
 
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...Product School
 
WSO2CONMay2024OpenSourceConferenceDebrief.pptx
WSO2CONMay2024OpenSourceConferenceDebrief.pptxWSO2CONMay2024OpenSourceConferenceDebrief.pptx
WSO2CONMay2024OpenSourceConferenceDebrief.pptxJennifer Lim
 
Essentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with ParametersEssentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with ParametersSafe Software
 
Demystifying gRPC in .Net by John Staveley
Demystifying gRPC in .Net by John StaveleyDemystifying gRPC in .Net by John Staveley
Demystifying gRPC in .Net by John StaveleyJohn Staveley
 
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered QualitySoftware Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered QualityInflectra
 
Introduction to Open Source RAG and RAG Evaluation
Introduction to Open Source RAG and RAG EvaluationIntroduction to Open Source RAG and RAG Evaluation
Introduction to Open Source RAG and RAG EvaluationZilliz
 
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...CzechDreamin
 
Salesforce Adoption – Metrics, Methods, and Motivation, Antone Kom
Salesforce Adoption – Metrics, Methods, and Motivation, Antone KomSalesforce Adoption – Metrics, Methods, and Motivation, Antone Kom
Salesforce Adoption – Metrics, Methods, and Motivation, Antone KomCzechDreamin
 

Recently uploaded (20)

Measures in SQL (a talk at SF Distributed Systems meetup, 2024-05-22)
Measures in SQL (a talk at SF Distributed Systems meetup, 2024-05-22)Measures in SQL (a talk at SF Distributed Systems meetup, 2024-05-22)
Measures in SQL (a talk at SF Distributed Systems meetup, 2024-05-22)
 
AI revolution and Salesforce, Jiří Karpíšek
AI revolution and Salesforce, Jiří KarpíšekAI revolution and Salesforce, Jiří Karpíšek
AI revolution and Salesforce, Jiří Karpíšek
 
Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...
Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...
Unsubscribed: Combat Subscription Fatigue With a Membership Mentality by Head...
 
Key Trends Shaping the Future of Infrastructure.pdf
Key Trends Shaping the Future of Infrastructure.pdfKey Trends Shaping the Future of Infrastructure.pdf
Key Trends Shaping the Future of Infrastructure.pdf
 
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
Kubernetes & AI - Beauty and the Beast !?! @KCD Istanbul 2024
 
How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...
 
PLAI - Acceleration Program for Generative A.I. Startups
PLAI - Acceleration Program for Generative A.I. StartupsPLAI - Acceleration Program for Generative A.I. Startups
PLAI - Acceleration Program for Generative A.I. Startups
 
Search and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical FuturesSearch and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical Futures
 
IoT Analytics Company Presentation May 2024
IoT Analytics Company Presentation May 2024IoT Analytics Company Presentation May 2024
IoT Analytics Company Presentation May 2024
 
Designing Great Products: The Power of Design and Leadership by Chief Designe...
Designing Great Products: The Power of Design and Leadership by Chief Designe...Designing Great Products: The Power of Design and Leadership by Chief Designe...
Designing Great Products: The Power of Design and Leadership by Chief Designe...
 
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
From Siloed Products to Connected Ecosystem: Building a Sustainable and Scala...
 
Exploring UiPath Orchestrator API: updates and limits in 2024 🚀
Exploring UiPath Orchestrator API: updates and limits in 2024 🚀Exploring UiPath Orchestrator API: updates and limits in 2024 🚀
Exploring UiPath Orchestrator API: updates and limits in 2024 🚀
 
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
 
WSO2CONMay2024OpenSourceConferenceDebrief.pptx
WSO2CONMay2024OpenSourceConferenceDebrief.pptxWSO2CONMay2024OpenSourceConferenceDebrief.pptx
WSO2CONMay2024OpenSourceConferenceDebrief.pptx
 
Essentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with ParametersEssentials of Automations: Optimizing FME Workflows with Parameters
Essentials of Automations: Optimizing FME Workflows with Parameters
 
Demystifying gRPC in .Net by John Staveley
Demystifying gRPC in .Net by John StaveleyDemystifying gRPC in .Net by John Staveley
Demystifying gRPC in .Net by John Staveley
 
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered QualitySoftware Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
Software Delivery At the Speed of AI: Inflectra Invests In AI-Powered Quality
 
Introduction to Open Source RAG and RAG Evaluation
Introduction to Open Source RAG and RAG EvaluationIntroduction to Open Source RAG and RAG Evaluation
Introduction to Open Source RAG and RAG Evaluation
 
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...
 
Salesforce Adoption – Metrics, Methods, and Motivation, Antone Kom
Salesforce Adoption – Metrics, Methods, and Motivation, Antone KomSalesforce Adoption – Metrics, Methods, and Motivation, Antone Kom
Salesforce Adoption – Metrics, Methods, and Motivation, Antone Kom
 

JavaScript Event Loop

  • 1. JavaScript Event Loop Not yo mama’s multithreaded approach. slidesha.re/ZPC2nD
  • 2. Who is Thomas Hunter? • Web developer for 8+ years • Dow, Ford, Quicken, Startup, Barracuda • Started development with PHP & MySQL • Became a Node.js fanboy • Writing a book on Backbone.js for Packt • @tlhunter | me@thomashunter.name
  • 3. What does MultiThreaded mean? • Makes use of separate CPU Cores as “Threads” • Uses a single process within the Operating System • True concurrency • Can have Race Conditions (simultaneous memory use) • “Hard” to get it right • Ran out of Ghz, hardware adds more cores
  • 4. JavaScript is SingleThreaded • Makes use of a single CPU core • CPU intensive work is never “concurrent” • Easier to pull off, as in less technical difficulties
  • 5. Technical Implementation • Stack: • Functions to run and available variables • More added as code is run • Stuff guaranteed to run in order • Heap: • “Chaotic” listing of objects • Queue: • Gets added to stack when stack empty • setTimeout and setInterval added here Credit: Mozilla Developer Network http://mzl.la/Y5Dh2x
  • 6. Example Code-run console.log("Adding code to the queue"); setTimeout(function() { // Added somewhere in Heap console.log("Running next code from queue"); }, 0); function a(x) { // Added somewhere in Heap console.log("a() frame added to stack"); b(x); console.log("a() frame removed from stack"); } function b(y) { // Added somewhere in Heap console.log("b() frame added to stack"); console.log("Value passed in is " + y); console.log("b() frame removed from stack"); } console.log("Starting work for this stack"); a(42); console.log("Ending work for this stack"); Adding code to the queue Starting work for this stacka() frame added to stackb()frame added to stackValue passed in is 42b() frameremoved from stacka() frame removed fromstackEnding work for this stackRunning next codefrom queue
  • 7. Your App is Mostly Asleep • Node.js:All I/O is non-blocking • E.g. it gets thrown into the Queue • Browser:Wait for a click to happen • PHP:Wait for a MySQL query to run • These show how slow I/O can be → L1-Cache 3 cyclesL2-Cache 14 cyclesRAM 250 cyclesDisk 41,000,000 Network 240,000,000
  • 8. Sequential vs Parallel • Traditional web apps perform each I/O Sequentially • With an Event Loop, they can be run in Parallel • Since most time is wasted doing I/O, very inefficient
  • 9. Non JS Event Loops • Event Loops can be implemented in other languages • However, JavaScript was built this way, feels “natural” • Examples: • Ruby: EventMachine • Python:Twisted & Tornado • PHP: ReactPHP
  • 10. !JS Event Loop Examples require 'eventmachine' module Echo def post_init puts "Someone Connected" end def receive_data data send_data "#{data}" close_connection if data =~ /quit/if end end EventMachine.run { EventMachine.start_server "127.0.0.1", 8081, Echo } var net = require('net'); var server = net.createServer(function (socket) { console.log('Someone Connected'); socket.pipe(socket); }); server.listen(1337, '127.0.0.1'); EventMachine in Ruby Node.js
  • 11. Event Loops are Awesome! • No race conditions • Typical web apps spend their time waiting on I/O • No funky syntax; it just works • Perform I/O operations “in parallel” easily • Stateful web applications are easy compared to PHP • Long run apps, don’t need web servers, shared data...
  • 12. Event Loops aren’t Awesome! • CPU intensive work will block your process • You can offload work to different processes (Node.js) • It isn’t making use of those 8 cores you’ve got • You can use the Multi-node module though (Node.js) • Memory leaks are possible, not so with PHP • You can program better and prevent it though ;-)
  • 13. Web Workers • You can use MultiThreaded JavaScript in your browser • IE10, Firefox 3.5, Chrome 4, Safari 4, Opera 10.6 • var worker = new Worker('task.js'); • Use Message Passing to share data • You share simple JSON data, not complex objects • Prevents deadlocks/race conditions because of this
  • 14. Conclusion • Great for I/O bound applications (most web apps) • Horrible for CPU bound applications (do it in C ;) • Appears to be a single multi-threaded process • “Fakes” concurrency • thomashunter.name @tlhunter slidesha.re/ZPC2nD

Editor's Notes

  1. Old school colloquialism, ya dig it?
  2. Why I’m credible (OR AM I?!)
  3. Explain multithreaded, how it is the true way to to do concurrent programming, and the best way to make use of systems with multiple cores (which is pretty much every system these days), but also allude to the difficulty of doing so.
  4. Describe how it is definitely not multithreaded, has downfalls of not making use of multiple CPUs, but kinda appears to be concurrent, and that it is easier to implement technologically.
  5. If you run the code: function a(x) { b(x+1); } function b(y) { alert(y); } a(12); Those all get added as “frames” within the current stack. Once you do something with a callback that gets executed after I/O happens, or a DOM event, that code is actually added to the Queue. When the current stack is complete it grabs the next item in the queue (if it’s ready). The heap doesn’t really matter, it’s just where the browser throws stuff in RAM.
  6. Run the code on the left (either in Node or your browser) and you’ll see the code on the right. The setTimeout automatically adds the execution to the next queue. The a() b() function calls are added to the stack since they’re running right now. Notice how the order isn’t exactly what you would expect. The setTimeout(), if this were a MultiThreaded application, would likely run immediately some of the times and maybe half way through execution other times.
  7. I mention PHP/MySQL a lot since I used it for several years, but the same applies to most single core languages. Basically, your app is almost always waiting on other shit to happen, unless you’re crunching a ton of numbers. Web apps are all I/O bound! Grab this remote RSS feed, talk to a database, send an email, you name it. The math parts and concatenating strings are super fast. The graph on the right shows just how intense this is.
  8. I adapted this diagram from a CodeSchool tutorial, it does a great job showing how stuff executes seemingly in parallel. Since I/O isn’t CPU bound, it can be done at the same time. The Sequential I/O section represents a PHP or Ruby or any other traditionally built application. The Parallel I/O section represents an application that is either MultiThreaded or using an EventLoop with non blocking I/O.
  9. You can implement event loops in other languages, but it won’t be pretty since you’ll need to use some specific syntax for registering callbacks. JS is cool though because this is built in, it’s just how it works, it feels au naturale. Maybe mention Node.js using LibUV, which relies on lower level utilities to tell it when to “wake” up.
  10. Here’s an Apples to Oranges comparison of EventLoops. Both of these examples were taken from their respective homepages (slightly tweaked for verbiage). I don’t know Ruby at all, and I honestly don’t know if these do the same things. This is just meant to show that most languages can implement an EventLoop, even when it’s not built in. The Ruby code is a little more terse, since it’s not “native”. You also have to be careful when building scripts this way, as the libraries you use should have non-blocking I/O.
  11. A race condition is when two bits of code running on different CPUs write to the same memory at the same moment. Who wins? If X = 10; thread 1 tries to add 2 to it, and thread 2 tries to add 3 to it, simultaneously, the value will become 12 or 13, not 15. Stateful apps in PHP requires the use of Memcache or a database. Node.js can simply use local variables. Parallel cURL requests can be done with a complex library, but in Node.js one can simply use callbacks.
  12. Mention the cons of single threaded event loops (as well as ways to fix it since I’m biased). Multi-node can spin up several processes for handling HTTP traffic, you prolly want to set it to the number of CPUs you have. Memory leaks can happen since your app is always running. PHP runs for a moment and then dies, Node.js can run for weeks. Perhaps mention ways to mitigate issues.
  13. Browser support looks pretty good, feel free to use it today. Node.js doesn’t have the Worker() object available, but there are plenty of alternatives.
  14. Not sure if this slide should stay, it duplicates information from one and two slides previous.