SlideShare a Scribd company logo
JQUERY 1.5
amsterdamjs meetup - February 8th 2011
         @mennovanslooten
IN THIS PRESENTATION...

• New   features        • Improvements

 • jQuery.sub()          • jQuery.ajax()

 • Deferred   objects    • Performance
BUT FIRST...
WHO HERE USES JQUERY?
JQUERY MICRO TUTORIAL

// jQuery is...
// a function you can call to query or create DOM elements:

  var old_element = $(‘#some > .css[selector]’);
  var new_element = $(‘<div id=”hello”><span>world</span></div>’);
JQUERY MICRO TUTORIAL

// This function always returns an array-like collection with
// lots of convenient chain-able methods.

  $(‘#target’)
       .empty()
       .append(new_element);
JQUERY MICRO TUTORIAL

// attaching events
some_element.bind(‘click’, function(e) {
    // handler code
});

// triggering events
some_element.trigger(‘click’);
JQUERY MICRO TUTORIAL

// custom events
some_element.bind(‘whatever’, function(e) {
    // handler code
});

// namespaced events
some_element.bind(‘click.myapp’, function(e) {
    // handler code
});
JQUERY MICRO TUTORIAL
// jQuery is also...
// a collection of useful utilities (not chain-able)

  var a = [0, 1, 2, 3];
  $.each(a, function(i, val) {
      alert(‘Index ‘ + i + ‘ has value ‘ + val);
  });

  var b = $.isArray(a);
JQUERY MICRO TUTORIAL
// ajax: load directly into element
$(‘#target’).load(‘file.html’);



// fine-grained control
$.ajax({
    url     : ‘file.html’,
    type    : ‘POST’,
    async : false,
    success: function(data, status, jqXHR) {
         // handle response
    }
});
THE NEW STUFF...
1.5 IMPROVEMENT:
                    AJAX
• complete   rewrite

• implemented   as a “deferred
 object”
NEW 1.5 FEATURE:
          DEFERRED OBJECTS


A deferred object is a chainable utility object that can register
multiple callbacks into callback queues, invoke callback queues,
 and relay the success or failure state of any synchronous or
                     asynchronous function.
WHAT?
DEFERRED AJAX EXAMPLE
// the old way
var success;
$.ajax(‘file.php’, {
    success : function() { success = true; },
    error   : function() { success = false; }
});



// somewhere else
if (success) {
    // ...
} else {
    // ....
}
DEFERRED AJAX EXAMPLE

// the new way
var req = $.ajax(‘file.php)
    .success(function() { ... })
    .error(function() { ... });



// somewhere else
req.success(function() { ... });
req.error(function() { ... });
CREATE YOUR OWN
              DEFERRED
var d1 = $.Deferred(),
var d2 = $.Deferred();

$('#button1').bind('click', function() {
    d1.resolve();
});

$('#button2').bind('click', function() {
    d2.resolve();
});

$.when( d1.promise(), d2.promise() )
    .then(function() {
            alert('both buttons clicked');
        });
NEW 1.5 FEATURE:
               $.SUB()


Creates a new copy of jQuery whose properties and methods
 can be modified without affecting the original jQuery object.
$.SUB EXAMPLE


var sub = jQuery.sub();

sub.fn.bar = function(){ };

$('#foo').bar();     // no
sub('#foo').bar();   // yes
THANKS FOR LISTENING
      @mennovanslooten

More Related Content

What's hot (20)

AngularJS Services
AngularJS ServicesAngularJS Services
AngularJS Services
Eyal Vardi
 
jQuery 1.7 Events
jQuery 1.7 EventsjQuery 1.7 Events
jQuery 1.7 Events
dmethvin
 
CQRS and Event Sourcing in a Symfony application
CQRS and Event Sourcing in a Symfony applicationCQRS and Event Sourcing in a Symfony application
CQRS and Event Sourcing in a Symfony application
Samuel ROZE
 
jQuery: Events, Animation, Ajax
jQuery: Events, Animation, AjaxjQuery: Events, Animation, Ajax
jQuery: Events, Animation, Ajax
Constantin Titarenko
 
Crafting beautiful software
Crafting beautiful softwareCrafting beautiful software
Crafting beautiful software
Jorn Oomen
 
Component lifecycle hooks in Angular 2.0
Component lifecycle hooks in Angular 2.0Component lifecycle hooks in Angular 2.0
Component lifecycle hooks in Angular 2.0
Eyal Vardi
 
Design how your objects talk through mocking
Design how your objects talk through mockingDesign how your objects talk through mocking
Design how your objects talk through mocking
Konstantin Kudryashov
 
How Kris Writes Symfony Apps
How Kris Writes Symfony AppsHow Kris Writes Symfony Apps
How Kris Writes Symfony Apps
Kris Wallsmith
 
DOM Scripting Toolkit - jQuery
DOM Scripting Toolkit - jQueryDOM Scripting Toolkit - jQuery
DOM Scripting Toolkit - jQuery
Remy Sharp
 
Avinash Kundaliya: Javascript and WordPress
Avinash Kundaliya: Javascript and WordPressAvinash Kundaliya: Javascript and WordPress
Avinash Kundaliya: Javascript and WordPress
wpnepal
 
Testable, Object-Oriented JavaScript
Testable, Object-Oriented JavaScriptTestable, Object-Oriented JavaScript
Testable, Object-Oriented JavaScript
Jon Kruger
 
Venturing Into The Wild: A .NET Developer's Experience As A Ruby Developer
Venturing Into The Wild: A .NET Developer's Experience As A Ruby DeveloperVenturing Into The Wild: A .NET Developer's Experience As A Ruby Developer
Venturing Into The Wild: A .NET Developer's Experience As A Ruby Developer
Jon Kruger
 
JavaScript Promise
JavaScript PromiseJavaScript Promise
JavaScript Promise
Joseph Chiang
 
Building Large jQuery Applications
Building Large jQuery ApplicationsBuilding Large jQuery Applications
Building Large jQuery Applications
Rebecca Murphey
 
Doctrine For Beginners
Doctrine For BeginnersDoctrine For Beginners
Doctrine For Beginners
Jonathan Wage
 
Special Events
Special EventsSpecial Events
Special Events
Brandon Aaron
 
Events
EventsEvents
Events
Josh Guo
 
AngularJS Routing
AngularJS RoutingAngularJS Routing
AngularJS Routing
Eyal Vardi
 
Guard Authentication: Powerful, Beautiful Security
Guard Authentication: Powerful, Beautiful SecurityGuard Authentication: Powerful, Beautiful Security
Guard Authentication: Powerful, Beautiful Security
Ryan Weaver
 
Rich domain model with symfony 2.5 and doctrine 2.5
Rich domain model with symfony 2.5 and doctrine 2.5Rich domain model with symfony 2.5 and doctrine 2.5
Rich domain model with symfony 2.5 and doctrine 2.5
Leonardo Proietti
 
AngularJS Services
AngularJS ServicesAngularJS Services
AngularJS Services
Eyal Vardi
 
jQuery 1.7 Events
jQuery 1.7 EventsjQuery 1.7 Events
jQuery 1.7 Events
dmethvin
 
CQRS and Event Sourcing in a Symfony application
CQRS and Event Sourcing in a Symfony applicationCQRS and Event Sourcing in a Symfony application
CQRS and Event Sourcing in a Symfony application
Samuel ROZE
 
Crafting beautiful software
Crafting beautiful softwareCrafting beautiful software
Crafting beautiful software
Jorn Oomen
 
Component lifecycle hooks in Angular 2.0
Component lifecycle hooks in Angular 2.0Component lifecycle hooks in Angular 2.0
Component lifecycle hooks in Angular 2.0
Eyal Vardi
 
Design how your objects talk through mocking
Design how your objects talk through mockingDesign how your objects talk through mocking
Design how your objects talk through mocking
Konstantin Kudryashov
 
How Kris Writes Symfony Apps
How Kris Writes Symfony AppsHow Kris Writes Symfony Apps
How Kris Writes Symfony Apps
Kris Wallsmith
 
DOM Scripting Toolkit - jQuery
DOM Scripting Toolkit - jQueryDOM Scripting Toolkit - jQuery
DOM Scripting Toolkit - jQuery
Remy Sharp
 
Avinash Kundaliya: Javascript and WordPress
Avinash Kundaliya: Javascript and WordPressAvinash Kundaliya: Javascript and WordPress
Avinash Kundaliya: Javascript and WordPress
wpnepal
 
Testable, Object-Oriented JavaScript
Testable, Object-Oriented JavaScriptTestable, Object-Oriented JavaScript
Testable, Object-Oriented JavaScript
Jon Kruger
 
Venturing Into The Wild: A .NET Developer's Experience As A Ruby Developer
Venturing Into The Wild: A .NET Developer's Experience As A Ruby DeveloperVenturing Into The Wild: A .NET Developer's Experience As A Ruby Developer
Venturing Into The Wild: A .NET Developer's Experience As A Ruby Developer
Jon Kruger
 
Building Large jQuery Applications
Building Large jQuery ApplicationsBuilding Large jQuery Applications
Building Large jQuery Applications
Rebecca Murphey
 
Doctrine For Beginners
Doctrine For BeginnersDoctrine For Beginners
Doctrine For Beginners
Jonathan Wage
 
AngularJS Routing
AngularJS RoutingAngularJS Routing
AngularJS Routing
Eyal Vardi
 
Guard Authentication: Powerful, Beautiful Security
Guard Authentication: Powerful, Beautiful SecurityGuard Authentication: Powerful, Beautiful Security
Guard Authentication: Powerful, Beautiful Security
Ryan Weaver
 
Rich domain model with symfony 2.5 and doctrine 2.5
Rich domain model with symfony 2.5 and doctrine 2.5Rich domain model with symfony 2.5 and doctrine 2.5
Rich domain model with symfony 2.5 and doctrine 2.5
Leonardo Proietti
 

Similar to amsterdamjs - jQuery 1.5 (20)

JavaScript JQUERY AJAX
JavaScript JQUERY AJAXJavaScript JQUERY AJAX
JavaScript JQUERY AJAX
Makarand Bhatambarekar
 
JSON Part 3: Asynchronous Ajax & JQuery Deferred
JSON Part 3: Asynchronous Ajax & JQuery DeferredJSON Part 3: Asynchronous Ajax & JQuery Deferred
JSON Part 3: Asynchronous Ajax & JQuery Deferred
Jeff Fox
 
What's new in jQuery 1.5
What's new in jQuery 1.5What's new in jQuery 1.5
What's new in jQuery 1.5
Martin Kleppe
 
How to Use AJAX in PHP and jQuery.pdf
How to Use AJAX in PHP and jQuery.pdfHow to Use AJAX in PHP and jQuery.pdf
How to Use AJAX in PHP and jQuery.pdf
semsem20021
 
jQuery for beginners
jQuery for beginnersjQuery for beginners
jQuery for beginners
Divakar Gu
 
jQuery 1.4-1.6 Best new features
jQuery 1.4-1.6 Best new featuresjQuery 1.4-1.6 Best new features
jQuery 1.4-1.6 Best new features
Ryan Blunden
 
Intro to jQuery @ Startup Institute
Intro to jQuery @ Startup InstituteIntro to jQuery @ Startup Institute
Intro to jQuery @ Startup Institute
Rafael Gonzaque
 
A Rich Web experience with jQuery, Ajax and .NET
A Rich Web experience with jQuery, Ajax and .NETA Rich Web experience with jQuery, Ajax and .NET
A Rich Web experience with jQuery, Ajax and .NET
James Johnson
 
J query fundamentals
J query fundamentalsJ query fundamentals
J query fundamentals
Attaporn Ninsuwan
 
Introduction to jQuery
Introduction to jQueryIntroduction to jQuery
Introduction to jQuery
Andres Baravalle
 
jQuery
jQueryjQuery
jQuery
Ivano Malavolta
 
Jquery 4
Jquery 4Jquery 4
Jquery 4
Manish Kumar Singh
 
AJAX vs. jQuery What Are The Differences.pdf
AJAX vs. jQuery What Are The Differences.pdfAJAX vs. jQuery What Are The Differences.pdf
AJAX vs. jQuery What Are The Differences.pdf
Laura Miller
 
Ajax and PHP
Ajax and PHPAjax and PHP
Ajax and PHP
John Coggeshall
 
Javascript And J Query
Javascript And J QueryJavascript And J Query
Javascript And J Query
itsarsalan
 
Ajax
AjaxAjax
Ajax
Nibin Manuel
 
Introduction to JSON & AJAX
Introduction to JSON & AJAXIntroduction to JSON & AJAX
Introduction to JSON & AJAX
Raveendra R
 
Promises look into the async future
Promises look into the async futurePromises look into the async future
Promises look into the async future
slicejs
 
jQuery introduction
jQuery introductionjQuery introduction
jQuery introduction
Tomi Juhola
 
1 ppt-ajax with-j_query
1 ppt-ajax with-j_query1 ppt-ajax with-j_query
1 ppt-ajax with-j_query
Fajar Baskoro
 
JSON Part 3: Asynchronous Ajax & JQuery Deferred
JSON Part 3: Asynchronous Ajax & JQuery DeferredJSON Part 3: Asynchronous Ajax & JQuery Deferred
JSON Part 3: Asynchronous Ajax & JQuery Deferred
Jeff Fox
 
What's new in jQuery 1.5
What's new in jQuery 1.5What's new in jQuery 1.5
What's new in jQuery 1.5
Martin Kleppe
 
How to Use AJAX in PHP and jQuery.pdf
How to Use AJAX in PHP and jQuery.pdfHow to Use AJAX in PHP and jQuery.pdf
How to Use AJAX in PHP and jQuery.pdf
semsem20021
 
jQuery for beginners
jQuery for beginnersjQuery for beginners
jQuery for beginners
Divakar Gu
 
jQuery 1.4-1.6 Best new features
jQuery 1.4-1.6 Best new featuresjQuery 1.4-1.6 Best new features
jQuery 1.4-1.6 Best new features
Ryan Blunden
 
Intro to jQuery @ Startup Institute
Intro to jQuery @ Startup InstituteIntro to jQuery @ Startup Institute
Intro to jQuery @ Startup Institute
Rafael Gonzaque
 
A Rich Web experience with jQuery, Ajax and .NET
A Rich Web experience with jQuery, Ajax and .NETA Rich Web experience with jQuery, Ajax and .NET
A Rich Web experience with jQuery, Ajax and .NET
James Johnson
 
AJAX vs. jQuery What Are The Differences.pdf
AJAX vs. jQuery What Are The Differences.pdfAJAX vs. jQuery What Are The Differences.pdf
AJAX vs. jQuery What Are The Differences.pdf
Laura Miller
 
Javascript And J Query
Javascript And J QueryJavascript And J Query
Javascript And J Query
itsarsalan
 
Introduction to JSON & AJAX
Introduction to JSON & AJAXIntroduction to JSON & AJAX
Introduction to JSON & AJAX
Raveendra R
 
Promises look into the async future
Promises look into the async futurePromises look into the async future
Promises look into the async future
slicejs
 
jQuery introduction
jQuery introductionjQuery introduction
jQuery introduction
Tomi Juhola
 
1 ppt-ajax with-j_query
1 ppt-ajax with-j_query1 ppt-ajax with-j_query
1 ppt-ajax with-j_query
Fajar Baskoro
 

Recently uploaded (20)

Maxx nft market place new generation nft marketing place
Maxx nft market place new generation nft marketing placeMaxx nft market place new generation nft marketing place
Maxx nft market place new generation nft marketing place
usersalmanrazdelhi
 
Cyber security cyber security cyber security cyber security cyber security cy...
Cyber security cyber security cyber security cyber security cyber security cy...Cyber security cyber security cyber security cyber security cyber security cy...
Cyber security cyber security cyber security cyber security cyber security cy...
pranavbodhak
 
State-Dependent Conformal Perception Bounds for Neuro-Symbolic Verification o...
State-Dependent Conformal Perception Bounds for Neuro-Symbolic Verification o...State-Dependent Conformal Perception Bounds for Neuro-Symbolic Verification o...
State-Dependent Conformal Perception Bounds for Neuro-Symbolic Verification o...
Ivan Ruchkin
 
The 2025 Digital Adoption Blueprint.pptx
The 2025 Digital Adoption Blueprint.pptxThe 2025 Digital Adoption Blueprint.pptx
The 2025 Digital Adoption Blueprint.pptx
aptyai
 
Introducing FME Realize: A New Era of Spatial Computing and AR
Introducing FME Realize: A New Era of Spatial Computing and ARIntroducing FME Realize: A New Era of Spatial Computing and AR
Introducing FME Realize: A New Era of Spatial Computing and AR
Safe Software
 
AI in Java - MCP in Action, Langchain4J-CDI, SmallRye-LLM, Spring AI
AI in Java - MCP in Action, Langchain4J-CDI, SmallRye-LLM, Spring AIAI in Java - MCP in Action, Langchain4J-CDI, SmallRye-LLM, Spring AI
AI in Java - MCP in Action, Langchain4J-CDI, SmallRye-LLM, Spring AI
Buhake Sindi
 
cloudgenesis cloud workshop , gdg on campus mita
cloudgenesis cloud workshop , gdg on campus mitacloudgenesis cloud workshop , gdg on campus mita
cloudgenesis cloud workshop , gdg on campus mita
siyaldhande02
 
Droidal: AI Agents Revolutionizing Healthcare
Droidal: AI Agents Revolutionizing HealthcareDroidal: AI Agents Revolutionizing Healthcare
Droidal: AI Agents Revolutionizing Healthcare
Droidal LLC
 
Marko.js - Unsung Hero of Scalable Web Frameworks (DevDays 2025)
Marko.js - Unsung Hero of Scalable Web Frameworks (DevDays 2025)Marko.js - Unsung Hero of Scalable Web Frameworks (DevDays 2025)
Marko.js - Unsung Hero of Scalable Web Frameworks (DevDays 2025)
Eugene Fidelin
 
"AI in the browser: predicting user actions in real time with TensorflowJS", ...
"AI in the browser: predicting user actions in real time with TensorflowJS", ..."AI in the browser: predicting user actions in real time with TensorflowJS", ...
"AI in the browser: predicting user actions in real time with TensorflowJS", ...
Fwdays
 
With Claude 4, Anthropic redefines AI capabilities, effectively unleashing a ...
With Claude 4, Anthropic redefines AI capabilities, effectively unleashing a ...With Claude 4, Anthropic redefines AI capabilities, effectively unleashing a ...
With Claude 4, Anthropic redefines AI capabilities, effectively unleashing a ...
SOFTTECHHUB
 
UiPath Community Berlin: Studio Tips & Tricks and UiPath Insights
UiPath Community Berlin: Studio Tips & Tricks and UiPath InsightsUiPath Community Berlin: Studio Tips & Tricks and UiPath Insights
UiPath Community Berlin: Studio Tips & Tricks and UiPath Insights
UiPathCommunity
 
From Legacy to Cloud-Native: A Guide to AWS Modernization.pptx
From Legacy to Cloud-Native: A Guide to AWS Modernization.pptxFrom Legacy to Cloud-Native: A Guide to AWS Modernization.pptx
From Legacy to Cloud-Native: A Guide to AWS Modernization.pptx
Mohammad Jomaa
 
MCP Dev Summit - Pragmatic Scaling of Enterprise GenAI with MCP
MCP Dev Summit - Pragmatic Scaling of Enterprise GenAI with MCPMCP Dev Summit - Pragmatic Scaling of Enterprise GenAI with MCP
MCP Dev Summit - Pragmatic Scaling of Enterprise GenAI with MCP
Sambhav Kothari
 
What is DePIN? The Hottest Trend in Web3 Right Now!
What is DePIN? The Hottest Trend in Web3 Right Now!What is DePIN? The Hottest Trend in Web3 Right Now!
What is DePIN? The Hottest Trend in Web3 Right Now!
cryptouniversityoffi
 
Build your own NES Emulator... with Kotlin
Build your own NES Emulator... with KotlinBuild your own NES Emulator... with Kotlin
Build your own NES Emulator... with Kotlin
Artur Skowroński
 
A Comprehensive Guide on Integrating Monoova Payment Gateway
A Comprehensive Guide on Integrating Monoova Payment GatewayA Comprehensive Guide on Integrating Monoova Payment Gateway
A Comprehensive Guide on Integrating Monoova Payment Gateway
danielle hunter
 
Cognitive Chasms - A Typology of GenAI Failure Failure Modes
Cognitive Chasms - A Typology of GenAI Failure Failure ModesCognitive Chasms - A Typology of GenAI Failure Failure Modes
Cognitive Chasms - A Typology of GenAI Failure Failure Modes
Dr. Tathagat Varma
 
STKI Israel Market Study 2025 final v1 version
STKI Israel Market Study 2025 final v1 versionSTKI Israel Market Study 2025 final v1 version
STKI Israel Market Study 2025 final v1 version
Dr. Jimmy Schwarzkopf
 
Offshore IT Support: Balancing In-House and Offshore Help Desk Technicians
Offshore IT Support: Balancing In-House and Offshore Help Desk TechniciansOffshore IT Support: Balancing In-House and Offshore Help Desk Technicians
Offshore IT Support: Balancing In-House and Offshore Help Desk Technicians
john823664
 
Maxx nft market place new generation nft marketing place
Maxx nft market place new generation nft marketing placeMaxx nft market place new generation nft marketing place
Maxx nft market place new generation nft marketing place
usersalmanrazdelhi
 
Cyber security cyber security cyber security cyber security cyber security cy...
Cyber security cyber security cyber security cyber security cyber security cy...Cyber security cyber security cyber security cyber security cyber security cy...
Cyber security cyber security cyber security cyber security cyber security cy...
pranavbodhak
 
State-Dependent Conformal Perception Bounds for Neuro-Symbolic Verification o...
State-Dependent Conformal Perception Bounds for Neuro-Symbolic Verification o...State-Dependent Conformal Perception Bounds for Neuro-Symbolic Verification o...
State-Dependent Conformal Perception Bounds for Neuro-Symbolic Verification o...
Ivan Ruchkin
 
The 2025 Digital Adoption Blueprint.pptx
The 2025 Digital Adoption Blueprint.pptxThe 2025 Digital Adoption Blueprint.pptx
The 2025 Digital Adoption Blueprint.pptx
aptyai
 
Introducing FME Realize: A New Era of Spatial Computing and AR
Introducing FME Realize: A New Era of Spatial Computing and ARIntroducing FME Realize: A New Era of Spatial Computing and AR
Introducing FME Realize: A New Era of Spatial Computing and AR
Safe Software
 
AI in Java - MCP in Action, Langchain4J-CDI, SmallRye-LLM, Spring AI
AI in Java - MCP in Action, Langchain4J-CDI, SmallRye-LLM, Spring AIAI in Java - MCP in Action, Langchain4J-CDI, SmallRye-LLM, Spring AI
AI in Java - MCP in Action, Langchain4J-CDI, SmallRye-LLM, Spring AI
Buhake Sindi
 
cloudgenesis cloud workshop , gdg on campus mita
cloudgenesis cloud workshop , gdg on campus mitacloudgenesis cloud workshop , gdg on campus mita
cloudgenesis cloud workshop , gdg on campus mita
siyaldhande02
 
Droidal: AI Agents Revolutionizing Healthcare
Droidal: AI Agents Revolutionizing HealthcareDroidal: AI Agents Revolutionizing Healthcare
Droidal: AI Agents Revolutionizing Healthcare
Droidal LLC
 
Marko.js - Unsung Hero of Scalable Web Frameworks (DevDays 2025)
Marko.js - Unsung Hero of Scalable Web Frameworks (DevDays 2025)Marko.js - Unsung Hero of Scalable Web Frameworks (DevDays 2025)
Marko.js - Unsung Hero of Scalable Web Frameworks (DevDays 2025)
Eugene Fidelin
 
"AI in the browser: predicting user actions in real time with TensorflowJS", ...
"AI in the browser: predicting user actions in real time with TensorflowJS", ..."AI in the browser: predicting user actions in real time with TensorflowJS", ...
"AI in the browser: predicting user actions in real time with TensorflowJS", ...
Fwdays
 
With Claude 4, Anthropic redefines AI capabilities, effectively unleashing a ...
With Claude 4, Anthropic redefines AI capabilities, effectively unleashing a ...With Claude 4, Anthropic redefines AI capabilities, effectively unleashing a ...
With Claude 4, Anthropic redefines AI capabilities, effectively unleashing a ...
SOFTTECHHUB
 
UiPath Community Berlin: Studio Tips & Tricks and UiPath Insights
UiPath Community Berlin: Studio Tips & Tricks and UiPath InsightsUiPath Community Berlin: Studio Tips & Tricks and UiPath Insights
UiPath Community Berlin: Studio Tips & Tricks and UiPath Insights
UiPathCommunity
 
From Legacy to Cloud-Native: A Guide to AWS Modernization.pptx
From Legacy to Cloud-Native: A Guide to AWS Modernization.pptxFrom Legacy to Cloud-Native: A Guide to AWS Modernization.pptx
From Legacy to Cloud-Native: A Guide to AWS Modernization.pptx
Mohammad Jomaa
 
MCP Dev Summit - Pragmatic Scaling of Enterprise GenAI with MCP
MCP Dev Summit - Pragmatic Scaling of Enterprise GenAI with MCPMCP Dev Summit - Pragmatic Scaling of Enterprise GenAI with MCP
MCP Dev Summit - Pragmatic Scaling of Enterprise GenAI with MCP
Sambhav Kothari
 
What is DePIN? The Hottest Trend in Web3 Right Now!
What is DePIN? The Hottest Trend in Web3 Right Now!What is DePIN? The Hottest Trend in Web3 Right Now!
What is DePIN? The Hottest Trend in Web3 Right Now!
cryptouniversityoffi
 
Build your own NES Emulator... with Kotlin
Build your own NES Emulator... with KotlinBuild your own NES Emulator... with Kotlin
Build your own NES Emulator... with Kotlin
Artur Skowroński
 
A Comprehensive Guide on Integrating Monoova Payment Gateway
A Comprehensive Guide on Integrating Monoova Payment GatewayA Comprehensive Guide on Integrating Monoova Payment Gateway
A Comprehensive Guide on Integrating Monoova Payment Gateway
danielle hunter
 
Cognitive Chasms - A Typology of GenAI Failure Failure Modes
Cognitive Chasms - A Typology of GenAI Failure Failure ModesCognitive Chasms - A Typology of GenAI Failure Failure Modes
Cognitive Chasms - A Typology of GenAI Failure Failure Modes
Dr. Tathagat Varma
 
STKI Israel Market Study 2025 final v1 version
STKI Israel Market Study 2025 final v1 versionSTKI Israel Market Study 2025 final v1 version
STKI Israel Market Study 2025 final v1 version
Dr. Jimmy Schwarzkopf
 
Offshore IT Support: Balancing In-House and Offshore Help Desk Technicians
Offshore IT Support: Balancing In-House and Offshore Help Desk TechniciansOffshore IT Support: Balancing In-House and Offshore Help Desk Technicians
Offshore IT Support: Balancing In-House and Offshore Help Desk Technicians
john823664
 

amsterdamjs - jQuery 1.5

  • 1. JQUERY 1.5 amsterdamjs meetup - February 8th 2011 @mennovanslooten
  • 2. IN THIS PRESENTATION... • New features • Improvements • jQuery.sub() • jQuery.ajax() • Deferred objects • Performance
  • 4. WHO HERE USES JQUERY?
  • 5. JQUERY MICRO TUTORIAL // jQuery is... // a function you can call to query or create DOM elements: var old_element = $(‘#some > .css[selector]’); var new_element = $(‘<div id=”hello”><span>world</span></div>’);
  • 6. JQUERY MICRO TUTORIAL // This function always returns an array-like collection with // lots of convenient chain-able methods. $(‘#target’) .empty() .append(new_element);
  • 7. JQUERY MICRO TUTORIAL // attaching events some_element.bind(‘click’, function(e) { // handler code }); // triggering events some_element.trigger(‘click’);
  • 8. JQUERY MICRO TUTORIAL // custom events some_element.bind(‘whatever’, function(e) { // handler code }); // namespaced events some_element.bind(‘click.myapp’, function(e) { // handler code });
  • 9. JQUERY MICRO TUTORIAL // jQuery is also... // a collection of useful utilities (not chain-able) var a = [0, 1, 2, 3]; $.each(a, function(i, val) { alert(‘Index ‘ + i + ‘ has value ‘ + val); }); var b = $.isArray(a);
  • 10. JQUERY MICRO TUTORIAL // ajax: load directly into element $(‘#target’).load(‘file.html’); // fine-grained control $.ajax({ url : ‘file.html’, type : ‘POST’, async : false, success: function(data, status, jqXHR) { // handle response } });
  • 12. 1.5 IMPROVEMENT: AJAX • complete rewrite • implemented as a “deferred object”
  • 13. NEW 1.5 FEATURE: DEFERRED OBJECTS A deferred object is a chainable utility object that can register multiple callbacks into callback queues, invoke callback queues, and relay the success or failure state of any synchronous or asynchronous function.
  • 14. WHAT?
  • 15. DEFERRED AJAX EXAMPLE // the old way var success; $.ajax(‘file.php’, { success : function() { success = true; }, error : function() { success = false; } }); // somewhere else if (success) { // ... } else { // .... }
  • 16. DEFERRED AJAX EXAMPLE // the new way var req = $.ajax(‘file.php) .success(function() { ... }) .error(function() { ... }); // somewhere else req.success(function() { ... }); req.error(function() { ... });
  • 17. CREATE YOUR OWN DEFERRED var d1 = $.Deferred(), var d2 = $.Deferred(); $('#button1').bind('click', function() { d1.resolve(); }); $('#button2').bind('click', function() { d2.resolve(); }); $.when( d1.promise(), d2.promise() ) .then(function() { alert('both buttons clicked'); });
  • 18. NEW 1.5 FEATURE: $.SUB() Creates a new copy of jQuery whose properties and methods can be modified without affecting the original jQuery object.
  • 19. $.SUB EXAMPLE var sub = jQuery.sub(); sub.fn.bar = function(){ }; $('#foo').bar(); // no sub('#foo').bar(); // yes
  • 20. THANKS FOR LISTENING @mennovanslooten

Editor's Notes