jquery pjax

12
S jQuery PJAX Speeding up the Client Kevin McKelvin – Devs4Devs – 13 August 2011 Blog: http://mcdev.za.net Twitter: @kmckelvin Email: [email protected]

Upload: bayard

Post on 23-Feb-2016

88 views

Category:

Documents


0 download

DESCRIPTION

jQuery PJAX. Speeding up the Client Kevin McKelvin – Devs4Devs – 13 August 2011. Blog: http://mcdev.za.net Twitter: @ kmckelvin Email: [email protected]. this.Speaker.ToString ();. Kevin McKelvin C #, Ruby, JavaScript developer Blog : http://mcdev.za.net Twitter: @ kmckelvin - PowerPoint PPT Presentation

TRANSCRIPT

Page 1: jQuery  PJAX

S

jQuery PJAXSpeeding up the Client

Kevin McKelvin – Devs4Devs – 13 August 2011

Blog: http://mcdev.za.netTwitter: @kmckelvinEmail: [email protected]

Page 2: jQuery  PJAX

this.Speaker.ToString();

Kevin McKelvin C#, Ruby, JavaScript developer

Blog: http://mcdev.za.net Twitter: @kmckelvin Email: [email protected]

Page 3: jQuery  PJAX

S

The Interactive Web

Page 4: jQuery  PJAX

The First Evolution

AJAX Partial Refreshes #!

Page 5: jQuery  PJAX
Page 6: jQuery  PJAX

Interactive Web (AJAX)

$.ajax({ url: url, data: {id: 1}, success: function(data) { ... }, dataType: ‘html’});

Page 7: jQuery  PJAX

The Problems

Permalinks Unpredictable Back Button #! In URLs window.location.hash

Page 8: jQuery  PJAX

The Solution

pushState + AJAX = PJAX

Page 9: jQuery  PJAX

PJAX

Bookmarkable Permanent Links Fully degradable in unsupported browsers Supported in major browsers

Firefox 4+ Safari 5+ Chrome 8+ Android 2.2+ Opera 11.5+

Page 10: jQuery  PJAX

Sample

Static Content

Page 11: jQuery  PJAX

Resources

jQuery: http://jquery.com jQuery PJAX plugin:

http://github.com/defunkt/jquery-pjax The McDev Blog:

http://mcdev.za.net

Page 12: jQuery  PJAX

More JavaScript

Backbone.jshttp://documentcloud.github.com/backbone/

Node.js (Asynchronous Servers in JavaScript)http://nodejs.org/

Schalk Neethling – “Watcher” @ 11:30 in Room 1 Martin Cronje – “RIA the way it was supposed to

be” – Next in Room 2