Soumettre la recherche
Mettre en ligne
Async & Parallel in JavaScript
•
14 j'aime
•
5,133 vues
Eyal Vardi
Suivre
Async & Parallel in JavaScript - first draft
Lire moins
Lire la suite
Technologie
Business
Signaler
Partager
Signaler
Partager
1 sur 84
Recommandé
OOP in JavaScript
OOP in JavaScript
Eyal Vardi
Forms in AngularJS
Forms in AngularJS
Eyal Vardi
Backbone testing
Backbone testing
Crashlytics
AngularJS in practice
AngularJS in practice
jhoguet
Frontin like-a-backer
Frontin like-a-backer
Frank de Jonge
Be pragmatic, be SOLID (at Boiling Frogs, Wrocław)
Be pragmatic, be SOLID (at Boiling Frogs, Wrocław)
Krzysztof Menżyk
Building Robust jQuery Plugins
Building Robust jQuery Plugins
Jörn Zaefferer
Be pragmatic, be SOLID
Be pragmatic, be SOLID
Krzysztof Menżyk
Recommandé
OOP in JavaScript
OOP in JavaScript
Eyal Vardi
Forms in AngularJS
Forms in AngularJS
Eyal Vardi
Backbone testing
Backbone testing
Crashlytics
AngularJS in practice
AngularJS in practice
jhoguet
Frontin like-a-backer
Frontin like-a-backer
Frank de Jonge
Be pragmatic, be SOLID (at Boiling Frogs, Wrocław)
Be pragmatic, be SOLID (at Boiling Frogs, Wrocław)
Krzysztof Menżyk
Building Robust jQuery Plugins
Building Robust jQuery Plugins
Jörn Zaefferer
Be pragmatic, be SOLID
Be pragmatic, be SOLID
Krzysztof Menżyk
Taming Command Bus
Taming Command Bus
Krzysztof Menżyk
Min-Maxing Software Costs - Laracon EU 2015
Min-Maxing Software Costs - Laracon EU 2015
Konstantin Kudryashov
Mocking Demystified
Mocking Demystified
Marcello Duarte
How to test complex SaaS applications - The family july 2014
How to test complex SaaS applications - The family july 2014
Guillaume POTIER
PhpSpec 2.0 ilustrated by examples
PhpSpec 2.0 ilustrated by examples
Marcello Duarte
Geek Moot '09 -- Smarty 101
Geek Moot '09 -- Smarty 101
Ted Kulp
購物車程式架構簡介
購物車程式架構簡介
Jace Ju
Intro to Angular.JS Directives
Intro to Angular.JS Directives
Christian Lilley
Con5623 pdf 5623_001
Con5623 pdf 5623_001
Euegene Fedorenko
Functional Structures in PHP
Functional Structures in PHP
Marcello Duarte
CoffeeScript - A Rubyist's Love Affair
CoffeeScript - A Rubyist's Love Affair
Mark
Min-Maxing Software Costs
Min-Maxing Software Costs
Konstantin Kudryashov
November Camp - Spec BDD with PHPSpec 2
November Camp - Spec BDD with PHPSpec 2
Kacper Gunia
Moving a high traffic ZF1 Enterprise Application to SF2 - Lessons learned
Moving a high traffic ZF1 Enterprise Application to SF2 - Lessons learned
Baldur Rensch
Advanced php testing in action
Advanced php testing in action
Jace Ju
Forget about Index.php and build you applications around HTTP - PHPers Cracow
Forget about Index.php and build you applications around HTTP - PHPers Cracow
Kacper Gunia
jQuery & 10,000 Global Functions: Working with Legacy JavaScript
jQuery & 10,000 Global Functions: Working with Legacy JavaScript
Guy Royse
Paying off technical debt with PHPSpec
Paying off technical debt with PHPSpec
Lewis Wright
PHPSpec - the only Design Tool you need - 4Developers
PHPSpec - the only Design Tool you need - 4Developers
Kacper Gunia
Symfony World - Symfony components and design patterns
Symfony World - Symfony components and design patterns
Łukasz Chruściel
AngularJS - $http & $resource Services
AngularJS - $http & $resource Services
Eyal Vardi
AngularJS Animations
AngularJS Animations
Eyal Vardi
Contenu connexe
Tendances
Taming Command Bus
Taming Command Bus
Krzysztof Menżyk
Min-Maxing Software Costs - Laracon EU 2015
Min-Maxing Software Costs - Laracon EU 2015
Konstantin Kudryashov
Mocking Demystified
Mocking Demystified
Marcello Duarte
How to test complex SaaS applications - The family july 2014
How to test complex SaaS applications - The family july 2014
Guillaume POTIER
PhpSpec 2.0 ilustrated by examples
PhpSpec 2.0 ilustrated by examples
Marcello Duarte
Geek Moot '09 -- Smarty 101
Geek Moot '09 -- Smarty 101
Ted Kulp
購物車程式架構簡介
購物車程式架構簡介
Jace Ju
Intro to Angular.JS Directives
Intro to Angular.JS Directives
Christian Lilley
Con5623 pdf 5623_001
Con5623 pdf 5623_001
Euegene Fedorenko
Functional Structures in PHP
Functional Structures in PHP
Marcello Duarte
CoffeeScript - A Rubyist's Love Affair
CoffeeScript - A Rubyist's Love Affair
Mark
Min-Maxing Software Costs
Min-Maxing Software Costs
Konstantin Kudryashov
November Camp - Spec BDD with PHPSpec 2
November Camp - Spec BDD with PHPSpec 2
Kacper Gunia
Moving a high traffic ZF1 Enterprise Application to SF2 - Lessons learned
Moving a high traffic ZF1 Enterprise Application to SF2 - Lessons learned
Baldur Rensch
Advanced php testing in action
Advanced php testing in action
Jace Ju
Forget about Index.php and build you applications around HTTP - PHPers Cracow
Forget about Index.php and build you applications around HTTP - PHPers Cracow
Kacper Gunia
jQuery & 10,000 Global Functions: Working with Legacy JavaScript
jQuery & 10,000 Global Functions: Working with Legacy JavaScript
Guy Royse
Paying off technical debt with PHPSpec
Paying off technical debt with PHPSpec
Lewis Wright
PHPSpec - the only Design Tool you need - 4Developers
PHPSpec - the only Design Tool you need - 4Developers
Kacper Gunia
Symfony World - Symfony components and design patterns
Symfony World - Symfony components and design patterns
Łukasz Chruściel
Tendances
(20)
Taming Command Bus
Taming Command Bus
Min-Maxing Software Costs - Laracon EU 2015
Min-Maxing Software Costs - Laracon EU 2015
Mocking Demystified
Mocking Demystified
How to test complex SaaS applications - The family july 2014
How to test complex SaaS applications - The family july 2014
PhpSpec 2.0 ilustrated by examples
PhpSpec 2.0 ilustrated by examples
Geek Moot '09 -- Smarty 101
Geek Moot '09 -- Smarty 101
購物車程式架構簡介
購物車程式架構簡介
Intro to Angular.JS Directives
Intro to Angular.JS Directives
Con5623 pdf 5623_001
Con5623 pdf 5623_001
Functional Structures in PHP
Functional Structures in PHP
CoffeeScript - A Rubyist's Love Affair
CoffeeScript - A Rubyist's Love Affair
Min-Maxing Software Costs
Min-Maxing Software Costs
November Camp - Spec BDD with PHPSpec 2
November Camp - Spec BDD with PHPSpec 2
Moving a high traffic ZF1 Enterprise Application to SF2 - Lessons learned
Moving a high traffic ZF1 Enterprise Application to SF2 - Lessons learned
Advanced php testing in action
Advanced php testing in action
Forget about Index.php and build you applications around HTTP - PHPers Cracow
Forget about Index.php and build you applications around HTTP - PHPers Cracow
jQuery & 10,000 Global Functions: Working with Legacy JavaScript
jQuery & 10,000 Global Functions: Working with Legacy JavaScript
Paying off technical debt with PHPSpec
Paying off technical debt with PHPSpec
PHPSpec - the only Design Tool you need - 4Developers
PHPSpec - the only Design Tool you need - 4Developers
Symfony World - Symfony components and design patterns
Symfony World - Symfony components and design patterns
En vedette
AngularJS - $http & $resource Services
AngularJS - $http & $resource Services
Eyal Vardi
AngularJS Animations
AngularJS Animations
Eyal Vardi
AngulrJS Overview
AngulrJS Overview
Eyal Vardi
AngularJS Testing
AngularJS Testing
Eyal Vardi
AngularJS Directives
AngularJS Directives
Eyal Vardi
AngularJS Routing
AngularJS Routing
Eyal Vardi
AngularJS Architecture
AngularJS Architecture
Eyal Vardi
En vedette
(7)
AngularJS - $http & $resource Services
AngularJS - $http & $resource Services
AngularJS Animations
AngularJS Animations
AngulrJS Overview
AngulrJS Overview
AngularJS Testing
AngularJS Testing
AngularJS Directives
AngularJS Directives
AngularJS Routing
AngularJS Routing
AngularJS Architecture
AngularJS Architecture
Similaire à Async & Parallel in JavaScript
AMD & Require.js
AMD & Require.js
Eyal Vardi
Scope & Functions in ECMAScript 6.0
Scope & Functions in ECMAScript 6.0
Eyal Vardi
What’s new in ECMAScript 6.0
What’s new in ECMAScript 6.0
Eyal Vardi
Async & Parallel in JavaScript
Async & Parallel in JavaScript
Eyal Vardi
Objects & Classes in ECMAScript 6.0
Objects & Classes in ECMAScript 6.0
Eyal Vardi
ES2015 New Features
ES2015 New Features
Giacomo Zinetti
Triggers, actions & behaviors in XAML
Triggers, actions & behaviors in XAML
Eyal Vardi
Iterators & Generators in ECMAScript 6.0
Iterators & Generators in ECMAScript 6.0
Eyal Vardi
Jquery optimization-tips
Jquery optimization-tips
anubavam-techkt
The Future of JavaScript (SXSW '07)
The Future of JavaScript (SXSW '07)
Aaron Gustafson
JavaScript - i och utanför webbläsaren (2010-03-03)
JavaScript - i och utanför webbläsaren (2010-03-03)
Anders Jönsson
ES6 generators
ES6 generators
Steven Foote
The Beauty of Java Script
The Beauty of Java Script
Michael Girouard
jQuery Data Manipulate API - A source code dissecting journey
jQuery Data Manipulate API - A source code dissecting journey
Huiyi Yan
The Beauty Of Java Script V5a
The Beauty Of Java Script V5a
rajivmordani
Dojo and Adobe AIR
Dojo and Adobe AIR
Nikolai Onken
JavaScript for PHP developers
JavaScript for PHP developers
Stoyan Stefanov
Say It With Javascript
Say It With Javascript
Giovanni Scerra ☃
Testing javascript in the frontend
Testing javascript in the frontend
Frederic CABASSUT
Node.js Event Emitter
Node.js Event Emitter
Eyal Vardi
Similaire à Async & Parallel in JavaScript
(20)
AMD & Require.js
AMD & Require.js
Scope & Functions in ECMAScript 6.0
Scope & Functions in ECMAScript 6.0
What’s new in ECMAScript 6.0
What’s new in ECMAScript 6.0
Async & Parallel in JavaScript
Async & Parallel in JavaScript
Objects & Classes in ECMAScript 6.0
Objects & Classes in ECMAScript 6.0
ES2015 New Features
ES2015 New Features
Triggers, actions & behaviors in XAML
Triggers, actions & behaviors in XAML
Iterators & Generators in ECMAScript 6.0
Iterators & Generators in ECMAScript 6.0
Jquery optimization-tips
Jquery optimization-tips
The Future of JavaScript (SXSW '07)
The Future of JavaScript (SXSW '07)
JavaScript - i och utanför webbläsaren (2010-03-03)
JavaScript - i och utanför webbläsaren (2010-03-03)
ES6 generators
ES6 generators
The Beauty of Java Script
The Beauty of Java Script
jQuery Data Manipulate API - A source code dissecting journey
jQuery Data Manipulate API - A source code dissecting journey
The Beauty Of Java Script V5a
The Beauty Of Java Script V5a
Dojo and Adobe AIR
Dojo and Adobe AIR
JavaScript for PHP developers
JavaScript for PHP developers
Say It With Javascript
Say It With Javascript
Testing javascript in the frontend
Testing javascript in the frontend
Node.js Event Emitter
Node.js Event Emitter
Plus de Eyal Vardi
Why magic
Why magic
Eyal Vardi
Smart Contract
Smart Contract
Eyal Vardi
Rachel's grandmother's recipes
Rachel's grandmother's recipes
Eyal Vardi
Performance Optimization In Angular 2
Performance Optimization In Angular 2
Eyal Vardi
Angular 2 Architecture (Bucharest 26/10/2016)
Angular 2 Architecture (Bucharest 26/10/2016)
Eyal Vardi
Angular 2 NgModule
Angular 2 NgModule
Eyal Vardi
Upgrading from Angular 1.x to Angular 2.x
Upgrading from Angular 1.x to Angular 2.x
Eyal Vardi
Angular 2 - Ahead of-time Compilation
Angular 2 - Ahead of-time Compilation
Eyal Vardi
Routing And Navigation
Routing And Navigation
Eyal Vardi
Angular 2 Architecture
Angular 2 Architecture
Eyal Vardi
Angular 1.x vs. Angular 2.x
Angular 1.x vs. Angular 2.x
Eyal Vardi
Angular 2.0 Views
Angular 2.0 Views
Eyal Vardi
Component lifecycle hooks in Angular 2.0
Component lifecycle hooks in Angular 2.0
Eyal Vardi
Template syntax in Angular 2.0
Template syntax in Angular 2.0
Eyal Vardi
Http Communication in Angular 2.0
Http Communication in Angular 2.0
Eyal Vardi
Angular 2.0 Dependency injection
Angular 2.0 Dependency injection
Eyal Vardi
Angular 2.0 Routing and Navigation
Angular 2.0 Routing and Navigation
Eyal Vardi
Angular 2.0 Pipes
Angular 2.0 Pipes
Eyal Vardi
Angular 2.0 forms
Angular 2.0 forms
Eyal Vardi
Modules and injector
Modules and injector
Eyal Vardi
Plus de Eyal Vardi
(20)
Why magic
Why magic
Smart Contract
Smart Contract
Rachel's grandmother's recipes
Rachel's grandmother's recipes
Performance Optimization In Angular 2
Performance Optimization In Angular 2
Angular 2 Architecture (Bucharest 26/10/2016)
Angular 2 Architecture (Bucharest 26/10/2016)
Angular 2 NgModule
Angular 2 NgModule
Upgrading from Angular 1.x to Angular 2.x
Upgrading from Angular 1.x to Angular 2.x
Angular 2 - Ahead of-time Compilation
Angular 2 - Ahead of-time Compilation
Routing And Navigation
Routing And Navigation
Angular 2 Architecture
Angular 2 Architecture
Angular 1.x vs. Angular 2.x
Angular 1.x vs. Angular 2.x
Angular 2.0 Views
Angular 2.0 Views
Component lifecycle hooks in Angular 2.0
Component lifecycle hooks in Angular 2.0
Template syntax in Angular 2.0
Template syntax in Angular 2.0
Http Communication in Angular 2.0
Http Communication in Angular 2.0
Angular 2.0 Dependency injection
Angular 2.0 Dependency injection
Angular 2.0 Routing and Navigation
Angular 2.0 Routing and Navigation
Angular 2.0 Pipes
Angular 2.0 Pipes
Angular 2.0 forms
Angular 2.0 forms
Modules and injector
Modules and injector
Dernier
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
Michael W. Hawkins
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
wesley chun
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your Business
Pixlogix Infotech
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
ThousandEyes
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path Mount
Puma Security, LLC
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
The Digital Insurer
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
Principled Technologies
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Neo4j
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Igalia
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
giselly40
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
wesley chun
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptx
Malak Abu Hammad
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
Khem
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
UK Journal
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
Earley Information Science
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
debabhi2
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
Delhi Call girls
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
Enterprise Knowledge
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
Radu Cotescu
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
hans926745
Dernier
(20)
GenCyber Cyber Security Day Presentation
GenCyber Cyber Security Day Presentation
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your Business
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path Mount
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptx
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
Understanding Discord NSFW Servers A Guide for Responsible Users.pdf
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
Async & Parallel in JavaScript
1.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
2.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
3.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
4.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il // plain, non-jQuery version of hooking up an event handler var clickity = document.getElementById("clickity"); clickity.addEventListener("click", function (e) { //console log, since it's like ALL real world scenarios, amirite? console.log("Alas, someone is pressing my buttons…"); }); // the obligatory jQuery version $("#clickity").on("click", function (e) { console.log("Alas, someone is pressing my buttons…"); });
5.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
6.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
7.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il link.onclick = function () { clickHandler1.apply(this, arguments); clickHandler2.apply(this, arguments); };
8.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il $('input[type=submit]') .on('click', function () { console.log('foo'); }) .trigger('click'); console.log('bar'); The output is: foo bar whenever a jQuery event fires, all of its handlers will be executed sequentially without interruption.
9.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il $('#tabby,#socks').on('meow', function () { console.log(this.id + 'meowed'); }); $('#tabby').trigger('meow'); //"tabby meowed" $('#socks').trigger('meow'); //"socks meowed"
10.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
11.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il var start = new Date; setTimeout(function () { var end = new Date; console.log('Timeelapsed:', end - start, 'ms'); }, 500); while (new Date - start < 1000) { }; What will be the result: 1. 500 < result < 1000 2. 1000 < result < 1500 3. 1500 < result
12.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il console.log("a"); setTimeout(function () { console.log("c"); }, 500); setTimeout(function () { console.log("d"); }, 500); setTimeout(function () { console.log("e"); }, 500); console.log("b");
13.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il init function init() { $("#spinner").show(); setup(); $("#spinner").hide(); } setup hide show
14.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il function init() { $("#spinner").show(); setTimeout( function() { setup(); $("#spinner").hide(); }, 0); }
15.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
16.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
17.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il try { setTimeout(function () { throw new Error('Catch me if you can!'); }, 0); } catch (e) { console.error(e); }
18.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il Option I: $.get('/data', { success: successHandler, failure: failureHandler }); Option II $.get('/data', function(error, value){ if(error) { alert('error'); returen; // Don’t forget this ! } });
19.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il var worker = { updateCustomer: function (customerInfo, callback ) { ... } // other methods, properties, etc }; worker.updateCustomer( currentCustomer, function (err, data) { alert(err || data); // this != worker });
20.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il worker.updateCustomer(currentCustomer, function (err, data) { this.showAlert(err || data); }.bind(notifier)); // using underscore/lodash worker.updateCustomer(currentCustomer, _.bind(function (err, data) { this.showAlert(err || data); }, notifier)); // using jquery worker.updateCustomer(currentCustomer, $.proxy(function (err, data) { this.showAlert(err || data); }, notifier));
21.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il worker.updateCustomer(currentCustomer, function (err, data) { this.showAlert(err || data); }.bind(notifier)); // using underscore/lodash worker.updateCustomer(currentCustomer, _.bind(function (err, data) { this.showAlert(err || data); }, notifier)); // using jquery worker.updateCustomer(currentCustomer, $.proxy(function (err, data) { this.showAlert(err || data); }, notifier)); var updateForm = { submit: function () { // get the data and store it in currentCustomer worker.updateCustomer( currentCustomer, this.showAlert.bind(this) ); }, showAlert: function (err, data) { // I don't care how, just show an alert :-) } };
22.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il for (var i = 0, len = items.length; i < len; i++) { process(items[i]); } function processArray(items, process, callback) { var todo = items.concat(); //create a clone of the original setTimeout(function () { process(todo.shift()); if (todo.length > 0) { setTimeout( arguments.callee, 25 ); } else { callback(items); } }, 25); }
23.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il function saveDocument(id) { //save the document openDocument(id) writeText(id); closeDocument(id); // update the UI to // indicate success updateUI(id); } function saveDocument(id) { var tasks =[openDocument, writeText, closeDocument, updateUI]; setTimeout(function () { //execute the next task var task = tasks.shift(); task(id); //determine if there's more if( tasks.length > 0) { setTimeout(arguments.callee, 25); } }, 25); }
24.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il function multistep(steps, args, callback){ var tasks = steps.concat(); //clone the array setTimeout(function(){ //execute the next task var task = tasks.shift(); task.apply(null, args || []); //determine if there's more if (tasks.length > 0) { setTimeout(arguments.callee, 25); } else { callback(); } }, 25); }
25.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il function timedProcessArray(items, process, callback) { var todo = items.concat(); //create a clone of the original setTimeout(function () { var start = +new Date(); do { process(todo.shift()); } while (todo.length > 0 && (+new Date() - start < 50)); if ( todo.length > 0 ) { setTimeout( arguments.callee, 25 ); } else { callback(items); } }, 25 ); }
26.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
27.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
28.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il var allTheCustomerThings; $("#getCustomer").click(function (cust) { var id = $("#cust-id").val(); getCustomer(id, function (cust) { allTheCustomerThings = cust; getContacts(id, function (contacts) { allTheCustomerThings.contacts = contacts; getOrders(id, function (orders) { allTheCustomerThings.orders = orders; getAccountsRecv(id, function (ar) { allTheCustomerThings.ar = ar; // OK - we got all the data, NOW WHAT?! :-) }); }); }); }); });
29.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il $.get('/mydata', { success: onSuccess, failure: onFailure, always: onAlways }); var promise = $.get('/mydata'); promise.done(onSuccess); promise.fail(onFailure); promise.always(onAlways);
30.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il var obj = { hello: function (name) {alert(name); } }, defer = $.Deferred(); defer.promise(obj); defer.resolve("John"); // Use the object as a Promise obj.done(function (name) { obj.hello(name);}) .hello("Karl"); ListenToEvents (READ) << interface >> Promise ListenToEvents (READ) TriggerEvents (WRITE) << interface >> Deferred
31.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il step1(function (value1) { step2(value1, function (value2) { step3(value2, function (value3) { step4(value3, function (value4) { // Do something with value4 }); }); }); }); Q.fcall(promisedStep1) .then(promisedStep2) .then(promisedStep3) .then(promisedStep4) .then(function (value4) { // Do something with value4 }) .catch(function (error) { // Handle any error from all above steps }) .done();
32.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il // fictional viewmodel for a mobile login screen // the ugly nested callback version var loginViewModel = (function () { var login = function () { var username = $('#loginUsername').val(); var password = $('#loginPassword').val(); el.Users.login( username, password, function () { usersModel.load( function () { mobileApp.navigate( 'views/notesView.html', function () { // YAY! We made it! }, function (err) { showError(err.message); }); }, function (err) { showError(err.message); }); }, function (err) { showError(err.message); }); }; }());
33.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il // Converted to use promises var loginViewModel = ( function () { var login = function () { var username = $('#loginUsername').val(); var password = $('#loginPassword').val(); el.Users.login(username, password) .then(function () { return usersModel.load(); }) .then(function () { mobileApp.navigate('views/notesView.html');}) .then( null, // YAY! We made it! function (err) { showError(err.message); } ); }; return { login: login }; })();
34.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il var serverData = {}; var getting1 = $.get('/1') .done(function (result) { serverData['1'] = result; }); var getting2 = $.get('/2') .done(function (result) { serverData['2'] = result; }); $.when(getting1, getting2) .done(function () { //the GET information is now in server Data... });
35.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il $.when($.ajax("/get/mail/")) .done( newMessages, updateMessageList, updateUnreadIndicator ) .fail(noMessages) .always( function () { var date = new Date(); $("#lastUpdated") .html( date.toDateString() ); } );
36.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
37.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il function buildpage() { return $.Deferred(function (dfd) { dfd .pipe(function() { return $('header').fadeIn(); }) .pipe(function() { return $('#main' ).fadeIn(); }) .pipe(function() { return $('footer').fadeIn(); }); }).resolve(); } $.when( buildpage() ) .done(function() { console.log('done'); } );
38.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il varnanowrimoing = $.Deferred(); varwordGoal = 5000; nanowrimoing.progress(function (wordCount) { varpercentComplete = Math.floor(wordCount / wordGoal * 100); $('#indicator').text(percentComplete + '%complete'); }); nanowrimoing.done(function () { $('#indicator').text('Goodjob!'); }); $('#document').on('keypress', function () { var wordCount = $(this).val().split(/s+/).length; if (wordCount >= wordGoal) { nanowrimoing.resolve(); }; nanowrimoing.notify(wordCount); });
39.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il var allTheCustomerThings; $("#getCustomer").click(function (cust) { var id = $("#cust-id").val(); getCustomer(id, function (cust) { allTheCustomerThings = cust; getContacts(id, function (contacts) { allTheCustomerThings.contacts = contacts; getOrders(id, function (orders) { allTheCustomerThings.orders = orders; getAccountsRecv(id, function (ar) { allTheCustomerThings.ar = ar; // OK - we got all the data, NOW WHAT?! :-) }); }); }); }); });
40.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il $("#getCustomer").click(function (cust) { var id = $("#cust-id").val(); Q.spread([ getCustomer(id), getContacts(id), getOrders(id), getAccountsRecv(id) ], function (cust, contacts, orders, ar) { cust.contacts = contacts; cust.orders = orders; cust.ar = ar; } ); });
41.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
42.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
43.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
44.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
45.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il var worker = new Worker('myThread.js'); worker.addEventListener('message',function(e){console.log(e.data);}); worker.postMessage('input message'); msg //myThread.js self.addEventListener( 'message' , doEcho ); function doEcho (e) { self.postMessage('Echo: ' + e.data) }; doEchoEcho
46.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il // Test if Dedicated Web Workers are available if (window.Worker) { g_bDedicatedWorkersEnabled = true; } // Test if Shared Web Workers are available if (window.SharedWorker) { g_bSharedWorkersEnabled = true; }
47.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
48.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
49.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il worker.postMessage( {data: int8View, moreData: anotherBuffer}, [int8View.buffer, anotherBuffer] );
50.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il importScripts('script1.js', 'script2.js');
51.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il In Chrome, there's a nice page to view all of the created blob URLs: chrome://blob-internals/ var blob = new Blob([ "onmessage = function(e) { postMessage('msg from worker'); }"]); // Obtain a blob URL reference to our worker 'file'. var blobURL = window.URL.createObjectURL(blob); var worker = new Worker(blobURL); worker.onmessage = function (e) { // e.data == 'msg from worker' }; worker.postMessage('msg'); // Start the worker
52.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il function onError(e) { document.getElementById('error').textContent = [ 'ERROR: Line ', e.lineno, ' in ', e.filename, ': ', e.message ].join(''); } function onMsg(e) { ... } var worker = new Worker('workerWithError.js'); worker.addEventListener('message', onMsg, false); worker.addEventListener('error', onError, false);
53.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
54.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
55.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
56.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il var calculator = operative({ add: function (a, b) { return a + b; } }); // Calc on web worker and return the result to UI thread. calculator.add(1, 2, function (result) { result; // => 3 });
57.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
58.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
59.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
60.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
61.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
62.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il when.map(srcs, loadImage) .then( function gotEm(imageArray) { doFancyStuffWithImages(imageArray); return imageArray.length; }, function doh(err) { handleError(err); } ) .then( function shout(count) { // This will happen after gotEm() and count // is the value returned by gotEm() alert('see my new ' + count + ' images?'); } );
63.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
64.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
65.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il http://code.dougneiner.com/presentations/machina/
66.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
67.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
68.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il Observable Subscribe Observer
69.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il function CreateObservable(element, eventType) { return Rx.Observable.create( function (observer) { function eventHandler(eventObj) { observer.onNext(eventObj); } // keep simple for this example and ignore // addEventListener/attachEvent browser differences element.addEventListener(eventType, eventHandler); return function () { element.removeEventListener(eventType, eventHandler); }; }); };
70.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il var observable = CreateObservable( document.getElementById('button'), 'click') .skip(2) .take(2) .select(function (evt) { return "button clicked"; });
71.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il var observer = Rx.Observer.create( //onNext function(evt){ alert(evt);}, //onError function(err){ alert('error');}, //onComplete function (){ alert('done'); } ); observable.subscribe(observer);
72.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il MSFT 27.01 INTC 21.75 MSFT 27.96 MSFT 31.21 INTC 22.54 INTC 20.98 MSFT 30.73 from tick in ticks
73.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il MSFT 27.01 INTC 21.75 MSFT 27.96 MSFT 31.21 INTC 22.54 INTC 20.98 MSFT 30.73 27.01 27.96 31.21 30.73 21.75 22.54 20.98 from tick in ticks group tick by tick.Symbol
74.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il MSFT 27.01 INTC 21.75 MSFT 27.96 MSFT 31.21 INTC 22.54 INTC 20.98 MSFT 30.73 from tick in ticks group tick by tick.Symbol into company from openClose in company.Buffer(2, 1) [27.01, 27.96] [27.96, 31.21] [31.21, 30.73] [21.75, 22.54] [22.54, 20.98]
75.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il MSFT 27.01 INTC 21.75 MSFT 27.96 MSFT 31.21 INTC 22.54 INTC 20.98 MSFT 30.73 from tick in ticks group tick by tick.Symbol into company from openClose in company.Buffer(2, 1) let diff = (openClose[1] – openClose[0]) / openClose[0] 0.034 0.104 -0.015 0.036 -0.069
76.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il MSFT 27.01 INTC 21.75 MSFT 27.96 MSFT 31.21 INTC 22.54 INTC 20.98 MSFT 30.73 from tick in ticks group tick by tick.Symbol into company from openClose in company.Buffer(2, 1) let diff = (openClose[1] – openClose[0]) / openClose[0] where diff > 0.1 0.034 0.104 -0.015 0.036 -0.069
77.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il MSFT 27.01 INTC 21.75 MSFT 27.96 MSFT 31.21 INTC 22.54 INTC 20.98 MSFT 30.73 from tick in ticks group tick by tick.Symbol into company from openClose in company.Buffer(2, 1) let diff = (openClose[1] – openClose[0]) / openClose[0] where diff > 0.1 select new { Company = company.Key, Increase = diff } Company = MSFT Increase = 0.104
78.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il Autocomplete (source) (demo) Canvas Painting (source) (demo) Drag and Drop (source) (demo) AMD and Require.js Integration (source) (demo) Time Flies Like an Arrow (source) (demo) Link to Start with: Introduction to the Rx for JavaScript
79.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il function draw() { // Drawing code goes here } setInterval(draw, 100); function draw() { setTimeout(draw, 100); // Drawing code goes here } draw();
80.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il function draw() { requestAnimationFrame(draw); // Drawing code goes here } draw(); The frame rate of your browser and computer, but typically it’s 60fps. The key difference here is that you are requesting the browser to draw your animation at the next available opportunity, not at a predetermined interval.
81.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il polyfill var fps = 15; function draw() { setTimeout(function () { requestAnimationFrame(draw); // Drawing code goes here }, 1000 / fps); } Frame rate
82.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il
83.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il Asynchronous JS: Callbacks, Listeners, Control Flow Libs and Promises Five Patterns to Help You Tame Asynchronous JavaScript The basics of Web Workers How JavaScript Timers Work http://creativejs.com/resources/requestanimationframe/
84.
© 2013 E4D
LTD. All rights reserved. Tel: 054-5-767-300, Email: Eyal@E4D.co.il eyalvardi.wordpress.com