SlideShare a Scribd company logo
Sizzle
What’s new in jQuery 1.8?

Timmy Willison
Performance
Wat? Fast?
Performance
Performance
Matching/filtering improved consistently by ~10%
  quickIs from event.js moved to Sizzle.filter
Performance
Matching/filtering improved consistently by ~10%
  quickIs from event.js moved to Sizzle.filter
Simple selectors (id only, tag only, class only) improved
by about 5% overall
Performance
Matching/filtering improved consistently by ~10%
  quickIs from event.js moved to Sizzle.filter
Simple selectors (id only, tag only, class only) improved
by about 5% overall
Element-rooted ID selections: 300% improvement
Performance
Matching/filtering improved consistently by ~10%
  quickIs from event.js moved to Sizzle.filter
Simple selectors (id only, tag only, class only) improved
by about 5% overall
Element-rooted ID selections: 300% improvement
Shorter codepaths to querySelectorAll and
matchesSelector
Filtering and matching
                1.7.2                1.8




*Based on http://jsperf.com/jquery-id-init/4 and
http://jsperf.com/jquery-id-init/6 (higher is better)
Filtering and matching
                      1.7.2                 1.8

100


75


50


25


 0
      event trigger           simple   complex    element-rooted ID


*Based on http://jsperf.com/jquery-id-init/4 and
http://jsperf.com/jquery-id-init/6 (higher is better)
Sizzle(“div.&*( ~ timmy:checkers [dave^=‘core’]”).length === 0
Ok, there were bugs.
Ok, there were bugs.
Improved QSA/matchesSelector bug-detection
Ok, there were bugs.
Improved QSA/matchesSelector bug-detection
  bypasses in certain browsers on certain selectors
Ok, there were bugs.
Improved QSA/matchesSelector bug-detection
  bypasses in certain browsers on certain selectors
    class[^$*]=”” (Opera/IE9)
Ok, there were bugs.
Improved QSA/matchesSelector bug-detection
  bypasses in certain browsers on certain selectors
    class[^$*]=”” (Opera/IE9)
    :checked won’t return selected options as per the
    spec in versions of Chrome/Safari/Opera
Ok, there were bugs.
Improved QSA/matchesSelector bug-detection
  bypasses in certain browsers on certain selectors
    class[^$*]=”” (Opera/IE9)
    :checked won’t return selected options as per the
    spec in versions of Chrome/Safari/Opera
    attroperties IE8 (attributes are everywhere!)
Combinators ( div ~ em + u > * )
Combinators ( div ~ em + u > * )

  When using multiple combinators in the same selector,
  some possible matches were being lost
Combinators ( div ~ em + u > * )

  When using multiple combinators in the same selector,
  some possible matches were being lost

Element-rooted querySelectorAll with divisions
Combinators ( div ~ em + u > * )

  When using multiple combinators in the same selector,
  some possible matches were being lost

Element-rooted querySelectorAll with divisions

  elem.querySelectorAll(“div, div > em”);
Combinators ( div ~ em + u > * )

  When using multiple combinators in the same selector,
  some possible matches were being lost

Element-rooted querySelectorAll with divisions

  elem.querySelectorAll(“div, div > em”);

Unicode validation (improved character encoding per spec)
Combinators ( div ~ em + u > * )

  When using multiple combinators in the same selector,
  some possible matches were being lost

Element-rooted querySelectorAll with divisions

  elem.querySelectorAll(“div, div > em”);

Unicode validation (improved character encoding per spec)

Several little edge cases
Coming Up
You are not prepared.
Coming Up
Coming Up
Sizzle may still see major changes before 1.8 release
Coming Up
Sizzle may still see major changes before 1.8 release
  Explore implementing a compiler to convert a
  selector into a function in order to avoid ever looping
  over elements more than once.
Coming Up
Sizzle may still see major changes before 1.8 release
  Explore implementing a compiler to convert a
  selector into a function in order to avoid ever looping
  over elements more than once.
More css3 selectors (after 1.8)
Coming Up
Sizzle may still see major changes before 1.8 release
  Explore implementing a compiler to convert a
  selector into a function in order to avoid ever looping
  over elements more than once.
More css3 selectors (after 1.8)
Provide even more selector validation
Coming Up
Sizzle may still see major changes before 1.8 release
  Explore implementing a compiler to convert a
  selector into a function in order to avoid ever looping
  over elements more than once.
More css3 selectors (after 1.8)
Provide even more selector validation
  e.g. [attr=”value”] - identifier vs. string
Coming Up
Sizzle may still see major changes before 1.8 release
  Explore implementing a compiler to convert a
  selector into a function in order to avoid ever looping
  over elements more than once.
More css3 selectors (after 1.8)
Provide even more selector validation
  e.g. [attr=”value”] - identifier vs. string
There are still bugs!
Contributing
Contributing
Submit an issue at http://github.com/jquery/sizzle
Contributing
Submit an issue at http://github.com/jquery/sizzle
  Pick an issue and dig in
Contributing
Submit an issue at http://github.com/jquery/sizzle
  Pick an issue and dig in
Discussion in #jquery-dev, longer discussion in the
public Sizzle google group
Contributing
Submit an issue at http://github.com/jquery/sizzle
  Pick an issue and dig in
Discussion in #jquery-dev, longer discussion in the
public Sizzle google group
Same styleguide, development workflow as jQuery
Contributing
Submit an issue at http://github.com/jquery/sizzle
  Pick an issue and dig in
Discussion in #jquery-dev, longer discussion in the
public Sizzle google group
Same styleguide, development workflow as jQuery
  See jQuery’s readme (http://github.com/jquery/jquery)
Contributing (ask me)

 timmywil in #jquery or #jquery-dev
 @timmywil on the tweeters and the githubs
Up next
jQuery UI updates
Scott Gonzalez

More Related Content

What's hot

jQuery in the [Aol.] Enterprise
jQuery in the [Aol.] EnterprisejQuery in the [Aol.] Enterprise
jQuery in the [Aol.] Enterprise
Dave Artz
 
New Perspectives on Performance
New Perspectives on PerformanceNew Perspectives on Performance
New Perspectives on Performance
mennovanslooten
 
Harness jQuery Templates and Data Link
Harness jQuery Templates and Data LinkHarness jQuery Templates and Data Link
Harness jQuery Templates and Data Link
BorisMoore
 
Unit testing
Unit testingUnit testing
Unit testing
Leonardo Balter
 
jQuery Conference San Diego 2014 - Web Performance
jQuery Conference San Diego 2014 - Web PerformancejQuery Conference San Diego 2014 - Web Performance
jQuery Conference San Diego 2014 - Web Performancedmethvin
 
jQuery Keynote - Fall 2010
jQuery Keynote - Fall 2010jQuery Keynote - Fall 2010
jQuery Keynote - Fall 2010
jeresig
 
React basic by Yoav Amit, Wix
React basic by Yoav Amit, Wix React basic by Yoav Amit, Wix
React basic by Yoav Amit, Wix
Chen Lerner
 
Getting Started with Angular - Stormpath Webinar, January 2017
Getting Started with Angular - Stormpath Webinar, January 2017Getting Started with Angular - Stormpath Webinar, January 2017
Getting Started with Angular - Stormpath Webinar, January 2017
Matt Raible
 
Mvvm knockout vs angular
Mvvm knockout vs angularMvvm knockout vs angular
Mvvm knockout vs angular
Basarat Syed
 
Building a Simple Theme Framework
Building a Simple Theme FrameworkBuilding a Simple Theme Framework
Building a Simple Theme Framework
Joe Casabona
 
Introduction to SPA with AngularJS
Introduction to SPA with AngularJSIntroduction to SPA with AngularJS
Introduction to SPA with AngularJS
Riki Pribadi
 
Choosing the best JavaScript framework/library/toolkit
Choosing the best JavaScript framework/library/toolkitChoosing the best JavaScript framework/library/toolkit
Choosing the best JavaScript framework/library/toolkitHristo Chakarov
 
Javascript Frameworks Comparison - Angular, Knockout, Ember and Backbone
Javascript Frameworks Comparison - Angular, Knockout, Ember and BackboneJavascript Frameworks Comparison - Angular, Knockout, Ember and Backbone
Javascript Frameworks Comparison - Angular, Knockout, Ember and Backbone
Deepu S Nath
 
jQuery UI & Mobile - The Great Merger
jQuery UI & Mobile - The Great MergerjQuery UI & Mobile - The Great Merger
jQuery UI & Mobile - The Great Mergerscottgonzalez
 
jQuery Mobile Overview - Boston
jQuery Mobile  Overview -  BostonjQuery Mobile  Overview -  Boston
jQuery Mobile Overview - Boston
Todd Parker
 
Avoiding Common Pitfalls in Ember.js
Avoiding Common Pitfalls in Ember.jsAvoiding Common Pitfalls in Ember.js
Avoiding Common Pitfalls in Ember.js
Alex Speller
 
Presentational jQuery
Presentational jQueryPresentational jQuery
Presentational jQuery
Doug Neiner
 
Advanced AngularJS Concepts
Advanced AngularJS ConceptsAdvanced AngularJS Concepts
Advanced AngularJS Concepts
Kyle Hodgson
 

What's hot (20)

jQuery in the [Aol.] Enterprise
jQuery in the [Aol.] EnterprisejQuery in the [Aol.] Enterprise
jQuery in the [Aol.] Enterprise
 
New Perspectives on Performance
New Perspectives on PerformanceNew Perspectives on Performance
New Perspectives on Performance
 
Harness jQuery Templates and Data Link
Harness jQuery Templates and Data LinkHarness jQuery Templates and Data Link
Harness jQuery Templates and Data Link
 
Unit testing
Unit testingUnit testing
Unit testing
 
jQuery Conference San Diego 2014 - Web Performance
jQuery Conference San Diego 2014 - Web PerformancejQuery Conference San Diego 2014 - Web Performance
jQuery Conference San Diego 2014 - Web Performance
 
jQuery Keynote - Fall 2010
jQuery Keynote - Fall 2010jQuery Keynote - Fall 2010
jQuery Keynote - Fall 2010
 
React basic by Yoav Amit, Wix
React basic by Yoav Amit, Wix React basic by Yoav Amit, Wix
React basic by Yoav Amit, Wix
 
Getting Started with Angular - Stormpath Webinar, January 2017
Getting Started with Angular - Stormpath Webinar, January 2017Getting Started with Angular - Stormpath Webinar, January 2017
Getting Started with Angular - Stormpath Webinar, January 2017
 
Mvvm knockout vs angular
Mvvm knockout vs angularMvvm knockout vs angular
Mvvm knockout vs angular
 
Building a Simple Theme Framework
Building a Simple Theme FrameworkBuilding a Simple Theme Framework
Building a Simple Theme Framework
 
Introduction to SPA with AngularJS
Introduction to SPA with AngularJSIntroduction to SPA with AngularJS
Introduction to SPA with AngularJS
 
Choosing the best JavaScript framework/library/toolkit
Choosing the best JavaScript framework/library/toolkitChoosing the best JavaScript framework/library/toolkit
Choosing the best JavaScript framework/library/toolkit
 
Spa with angular
Spa with angularSpa with angular
Spa with angular
 
Javascript Frameworks Comparison - Angular, Knockout, Ember and Backbone
Javascript Frameworks Comparison - Angular, Knockout, Ember and BackboneJavascript Frameworks Comparison - Angular, Knockout, Ember and Backbone
Javascript Frameworks Comparison - Angular, Knockout, Ember and Backbone
 
jQuery UI & Mobile - The Great Merger
jQuery UI & Mobile - The Great MergerjQuery UI & Mobile - The Great Merger
jQuery UI & Mobile - The Great Merger
 
jQuery Mobile Overview - Boston
jQuery Mobile  Overview -  BostonjQuery Mobile  Overview -  Boston
jQuery Mobile Overview - Boston
 
Avoiding Common Pitfalls in Ember.js
Avoiding Common Pitfalls in Ember.jsAvoiding Common Pitfalls in Ember.js
Avoiding Common Pitfalls in Ember.js
 
Presentational jQuery
Presentational jQueryPresentational jQuery
Presentational jQuery
 
Angular - Beginner
Angular - BeginnerAngular - Beginner
Angular - Beginner
 
Advanced AngularJS Concepts
Advanced AngularJS ConceptsAdvanced AngularJS Concepts
Advanced AngularJS Concepts
 

Similar to Sizzle jQCon San Francisco 2012

J Query The Write Less Do More Javascript Library
J Query   The Write Less Do More Javascript LibraryJ Query   The Write Less Do More Javascript Library
J Query The Write Less Do More Javascript Libraryrsnarayanan
 
jQuery Proven Performance Tips & Tricks
jQuery Proven Performance Tips & TricksjQuery Proven Performance Tips & Tricks
jQuery Proven Performance Tips & Tricks
Addy Osmani
 
Advanced #6 clean architecture
Advanced #6  clean architectureAdvanced #6  clean architecture
Advanced #6 clean architecture
Vitali Pekelis
 
Pragmatic Parallels: Java and JavaScript
Pragmatic Parallels: Java and JavaScriptPragmatic Parallels: Java and JavaScript
Pragmatic Parallels: Java and JavaScript
davejohnson
 
Rspec Tips
Rspec TipsRspec Tips
Rspec Tipslionpeal
 
System settings
System settingsSystem settings
System settings
htyson
 
Declaring Server App Components in Pure Java
Declaring Server App Components in Pure JavaDeclaring Server App Components in Pure Java
Declaring Server App Components in Pure Java
Atlassian
 
jQuery Tips Tricks Trivia
jQuery Tips Tricks TriviajQuery Tips Tricks Trivia
jQuery Tips Tricks Trivia
Cognizant
 
QA Fest 2019. Анна Чернышова. Self-healing test automation 2.0. The Future
QA Fest 2019. Анна Чернышова. Self-healing test automation 2.0. The FutureQA Fest 2019. Анна Чернышова. Self-healing test automation 2.0. The Future
QA Fest 2019. Анна Чернышова. Self-healing test automation 2.0. The Future
QAFest
 
Katalon Studio - GUI Overview
Katalon Studio - GUI OverviewKatalon Studio - GUI Overview
Katalon Studio - GUI Overview
Katalon Studio
 
BDD and Test Automation in Evalutionary Product Suite
BDD and Test Automation in Evalutionary Product SuiteBDD and Test Automation in Evalutionary Product Suite
BDD and Test Automation in Evalutionary Product Suite
Lasantha Ranaweera
 
Rails 101
Rails 101Rails 101
Top100summit 谷歌-scott-improve your automated web application testing
Top100summit  谷歌-scott-improve your automated web application testingTop100summit  谷歌-scott-improve your automated web application testing
Top100summit 谷歌-scott-improve your automated web application testingdrewz lin
 
React table tutorial use filter (part 2)
React table tutorial use filter (part 2)React table tutorial use filter (part 2)
React table tutorial use filter (part 2)
Katy Slemon
 
Browser-level testing
Browser-level testingBrowser-level testing
Browser-level testing
Martin Kleppmann
 
Gilt Groupe's Selenium 2 Conversion Challenges
Gilt Groupe's Selenium 2 Conversion ChallengesGilt Groupe's Selenium 2 Conversion Challenges
Gilt Groupe's Selenium 2 Conversion Challenges
Sauce Labs
 
The Ember.js Framework - Everything You Need To Know
The Ember.js Framework - Everything You Need To KnowThe Ember.js Framework - Everything You Need To Know
The Ember.js Framework - Everything You Need To Know
All Things Open
 
A to Z about JQuery - Become Newbie to Expert Java Developer
A to Z about JQuery - Become Newbie to Expert Java DeveloperA to Z about JQuery - Become Newbie to Expert Java Developer
A to Z about JQuery - Become Newbie to Expert Java Developer
Manoj Bhuva
 
Ajax toolkit-framework
Ajax toolkit-frameworkAjax toolkit-framework
Ajax toolkit-framework
WBUTTUTORIALS
 
Best Selenium Online Training
Best Selenium Online TrainingBest Selenium Online Training
Best Selenium Online TrainingSamatha Kamuni
 

Similar to Sizzle jQCon San Francisco 2012 (20)

J Query The Write Less Do More Javascript Library
J Query   The Write Less Do More Javascript LibraryJ Query   The Write Less Do More Javascript Library
J Query The Write Less Do More Javascript Library
 
jQuery Proven Performance Tips & Tricks
jQuery Proven Performance Tips & TricksjQuery Proven Performance Tips & Tricks
jQuery Proven Performance Tips & Tricks
 
Advanced #6 clean architecture
Advanced #6  clean architectureAdvanced #6  clean architecture
Advanced #6 clean architecture
 
Pragmatic Parallels: Java and JavaScript
Pragmatic Parallels: Java and JavaScriptPragmatic Parallels: Java and JavaScript
Pragmatic Parallels: Java and JavaScript
 
Rspec Tips
Rspec TipsRspec Tips
Rspec Tips
 
System settings
System settingsSystem settings
System settings
 
Declaring Server App Components in Pure Java
Declaring Server App Components in Pure JavaDeclaring Server App Components in Pure Java
Declaring Server App Components in Pure Java
 
jQuery Tips Tricks Trivia
jQuery Tips Tricks TriviajQuery Tips Tricks Trivia
jQuery Tips Tricks Trivia
 
QA Fest 2019. Анна Чернышова. Self-healing test automation 2.0. The Future
QA Fest 2019. Анна Чернышова. Self-healing test automation 2.0. The FutureQA Fest 2019. Анна Чернышова. Self-healing test automation 2.0. The Future
QA Fest 2019. Анна Чернышова. Self-healing test automation 2.0. The Future
 
Katalon Studio - GUI Overview
Katalon Studio - GUI OverviewKatalon Studio - GUI Overview
Katalon Studio - GUI Overview
 
BDD and Test Automation in Evalutionary Product Suite
BDD and Test Automation in Evalutionary Product SuiteBDD and Test Automation in Evalutionary Product Suite
BDD and Test Automation in Evalutionary Product Suite
 
Rails 101
Rails 101Rails 101
Rails 101
 
Top100summit 谷歌-scott-improve your automated web application testing
Top100summit  谷歌-scott-improve your automated web application testingTop100summit  谷歌-scott-improve your automated web application testing
Top100summit 谷歌-scott-improve your automated web application testing
 
React table tutorial use filter (part 2)
React table tutorial use filter (part 2)React table tutorial use filter (part 2)
React table tutorial use filter (part 2)
 
Browser-level testing
Browser-level testingBrowser-level testing
Browser-level testing
 
Gilt Groupe's Selenium 2 Conversion Challenges
Gilt Groupe's Selenium 2 Conversion ChallengesGilt Groupe's Selenium 2 Conversion Challenges
Gilt Groupe's Selenium 2 Conversion Challenges
 
The Ember.js Framework - Everything You Need To Know
The Ember.js Framework - Everything You Need To KnowThe Ember.js Framework - Everything You Need To Know
The Ember.js Framework - Everything You Need To Know
 
A to Z about JQuery - Become Newbie to Expert Java Developer
A to Z about JQuery - Become Newbie to Expert Java DeveloperA to Z about JQuery - Become Newbie to Expert Java Developer
A to Z about JQuery - Become Newbie to Expert Java Developer
 
Ajax toolkit-framework
Ajax toolkit-frameworkAjax toolkit-framework
Ajax toolkit-framework
 
Best Selenium Online Training
Best Selenium Online TrainingBest Selenium Online Training
Best Selenium Online Training
 

Recently uploaded

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
 
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
DanBrown980551
 
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
 
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdfSmart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
91mobiles
 
Leading Change strategies and insights for effective change management pdf 1.pdf
Leading Change strategies and insights for effective change management pdf 1.pdfLeading Change strategies and insights for effective change management pdf 1.pdf
Leading Change strategies and insights for effective change management pdf 1.pdf
OnBoard
 
Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...
Product School
 
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
Tobias Schneck
 
UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3
DianaGray10
 
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdfFIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance
 
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
BookNet Canada
 
Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........
Alison B. Lowndes
 
Accelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish CachingAccelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish Caching
Thijs Feryn
 
Generating a custom Ruby SDK for your web service or Rails API using Smithy
Generating a custom Ruby SDK for your web service or Rails API using SmithyGenerating a custom Ruby SDK for your web service or Rails API using Smithy
Generating a custom Ruby SDK for your web service or Rails API using Smithy
g2nightmarescribd
 
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdfFIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance
 
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
James Anderson
 
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
Cheryl Hung
 
JMeter webinar - integration with InfluxDB and Grafana
JMeter webinar - integration with InfluxDB and GrafanaJMeter webinar - integration with InfluxDB and Grafana
JMeter webinar - integration with InfluxDB and Grafana
RTTS
 
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Jeffrey Haguewood
 
Connector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a buttonConnector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a button
DianaGray10
 
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
Product School
 

Recently uploaded (20)

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...
 
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
 
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...
 
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdfSmart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
 
Leading Change strategies and insights for effective change management pdf 1.pdf
Leading Change strategies and insights for effective change management pdf 1.pdfLeading Change strategies and insights for effective change management pdf 1.pdf
Leading Change strategies and insights for effective change management pdf 1.pdf
 
Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...
 
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
 
UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3UiPath Test Automation using UiPath Test Suite series, part 3
UiPath Test Automation using UiPath Test Suite series, part 3
 
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdfFIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
 
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
 
Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........
 
Accelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish CachingAccelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish Caching
 
Generating a custom Ruby SDK for your web service or Rails API using Smithy
Generating a custom Ruby SDK for your web service or Rails API using SmithyGenerating a custom Ruby SDK for your web service or Rails API using Smithy
Generating a custom Ruby SDK for your web service or Rails API using Smithy
 
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdfFIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
 
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
 
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
 
JMeter webinar - integration with InfluxDB and Grafana
JMeter webinar - integration with InfluxDB and GrafanaJMeter webinar - integration with InfluxDB and Grafana
JMeter webinar - integration with InfluxDB and Grafana
 
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
 
Connector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a buttonConnector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a button
 
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
 

Sizzle jQCon San Francisco 2012

  • 1. Sizzle What’s new in jQuery 1.8? Timmy Willison
  • 4. Performance Matching/filtering improved consistently by ~10% quickIs from event.js moved to Sizzle.filter
  • 5. Performance Matching/filtering improved consistently by ~10% quickIs from event.js moved to Sizzle.filter Simple selectors (id only, tag only, class only) improved by about 5% overall
  • 6. Performance Matching/filtering improved consistently by ~10% quickIs from event.js moved to Sizzle.filter Simple selectors (id only, tag only, class only) improved by about 5% overall Element-rooted ID selections: 300% improvement
  • 7. Performance Matching/filtering improved consistently by ~10% quickIs from event.js moved to Sizzle.filter Simple selectors (id only, tag only, class only) improved by about 5% overall Element-rooted ID selections: 300% improvement Shorter codepaths to querySelectorAll and matchesSelector
  • 8. Filtering and matching 1.7.2 1.8 *Based on http://jsperf.com/jquery-id-init/4 and http://jsperf.com/jquery-id-init/6 (higher is better)
  • 9. Filtering and matching 1.7.2 1.8 100 75 50 25 0 event trigger simple complex element-rooted ID *Based on http://jsperf.com/jquery-id-init/4 and http://jsperf.com/jquery-id-init/6 (higher is better)
  • 10. Sizzle(“div.&*( ~ timmy:checkers [dave^=‘core’]”).length === 0
  • 11. Ok, there were bugs.
  • 12. Ok, there were bugs. Improved QSA/matchesSelector bug-detection
  • 13. Ok, there were bugs. Improved QSA/matchesSelector bug-detection bypasses in certain browsers on certain selectors
  • 14. Ok, there were bugs. Improved QSA/matchesSelector bug-detection bypasses in certain browsers on certain selectors class[^$*]=”” (Opera/IE9)
  • 15. Ok, there were bugs. Improved QSA/matchesSelector bug-detection bypasses in certain browsers on certain selectors class[^$*]=”” (Opera/IE9) :checked won’t return selected options as per the spec in versions of Chrome/Safari/Opera
  • 16. Ok, there were bugs. Improved QSA/matchesSelector bug-detection bypasses in certain browsers on certain selectors class[^$*]=”” (Opera/IE9) :checked won’t return selected options as per the spec in versions of Chrome/Safari/Opera attroperties IE8 (attributes are everywhere!)
  • 17.
  • 18. Combinators ( div ~ em + u > * )
  • 19. Combinators ( div ~ em + u > * ) When using multiple combinators in the same selector, some possible matches were being lost
  • 20. Combinators ( div ~ em + u > * ) When using multiple combinators in the same selector, some possible matches were being lost Element-rooted querySelectorAll with divisions
  • 21. Combinators ( div ~ em + u > * ) When using multiple combinators in the same selector, some possible matches were being lost Element-rooted querySelectorAll with divisions elem.querySelectorAll(“div, div > em”);
  • 22. Combinators ( div ~ em + u > * ) When using multiple combinators in the same selector, some possible matches were being lost Element-rooted querySelectorAll with divisions elem.querySelectorAll(“div, div > em”); Unicode validation (improved character encoding per spec)
  • 23. Combinators ( div ~ em + u > * ) When using multiple combinators in the same selector, some possible matches were being lost Element-rooted querySelectorAll with divisions elem.querySelectorAll(“div, div > em”); Unicode validation (improved character encoding per spec) Several little edge cases
  • 24. Coming Up You are not prepared.
  • 26. Coming Up Sizzle may still see major changes before 1.8 release
  • 27. Coming Up Sizzle may still see major changes before 1.8 release Explore implementing a compiler to convert a selector into a function in order to avoid ever looping over elements more than once.
  • 28. Coming Up Sizzle may still see major changes before 1.8 release Explore implementing a compiler to convert a selector into a function in order to avoid ever looping over elements more than once. More css3 selectors (after 1.8)
  • 29. Coming Up Sizzle may still see major changes before 1.8 release Explore implementing a compiler to convert a selector into a function in order to avoid ever looping over elements more than once. More css3 selectors (after 1.8) Provide even more selector validation
  • 30. Coming Up Sizzle may still see major changes before 1.8 release Explore implementing a compiler to convert a selector into a function in order to avoid ever looping over elements more than once. More css3 selectors (after 1.8) Provide even more selector validation e.g. [attr=”value”] - identifier vs. string
  • 31. Coming Up Sizzle may still see major changes before 1.8 release Explore implementing a compiler to convert a selector into a function in order to avoid ever looping over elements more than once. More css3 selectors (after 1.8) Provide even more selector validation e.g. [attr=”value”] - identifier vs. string There are still bugs!
  • 33. Contributing Submit an issue at http://github.com/jquery/sizzle
  • 34. Contributing Submit an issue at http://github.com/jquery/sizzle Pick an issue and dig in
  • 35. Contributing Submit an issue at http://github.com/jquery/sizzle Pick an issue and dig in Discussion in #jquery-dev, longer discussion in the public Sizzle google group
  • 36. Contributing Submit an issue at http://github.com/jquery/sizzle Pick an issue and dig in Discussion in #jquery-dev, longer discussion in the public Sizzle google group Same styleguide, development workflow as jQuery
  • 37. Contributing Submit an issue at http://github.com/jquery/sizzle Pick an issue and dig in Discussion in #jquery-dev, longer discussion in the public Sizzle google group Same styleguide, development workflow as jQuery See jQuery’s readme (http://github.com/jquery/jquery)
  • 38. Contributing (ask me) timmywil in #jquery or #jquery-dev @timmywil on the tweeters and the githubs
  • 39. Up next jQuery UI updates Scott Gonzalez

Editor's Notes

  1. Welcome, so excited about what we have in store for Sizzle in jQuery 1.8.\nFirst, let’s talk about performance\n
  2. Many things stayed the same\n
  3. To sum up\n- Based on all of the perf tests I’ve done so far, we have excellent codepaths to QSA and matchesSelector\n- So, we’ve covered some performance stuff. Now the next question is, what did we fix?\n
  4. To sum up\n- Based on all of the perf tests I’ve done so far, we have excellent codepaths to QSA and matchesSelector\n- So, we’ve covered some performance stuff. Now the next question is, what did we fix?\n
  5. To sum up\n- Based on all of the perf tests I’ve done so far, we have excellent codepaths to QSA and matchesSelector\n- So, we’ve covered some performance stuff. Now the next question is, what did we fix?\n
  6. To sum up\n- Based on all of the perf tests I’ve done so far, we have excellent codepaths to QSA and matchesSelector\n- So, we’ve covered some performance stuff. Now the next question is, what did we fix?\n
  7. - event delegation\n- id, tag, class\n- jQuery(something).find(ID)\n
  8. - actually that selector would work if the special characters were escaped and :checkers was a custom pseudo.\n- OK, but there were actually bugs\n
  9. Every browser has bugs in querySelectorAll, even webkit.\n- If you know what I did in the last version of jQuery, you’ll know about my long standing relationship with attributes. IE8’s QSA doesn’t handle boolean attributes very well.\n
  10. Every browser has bugs in querySelectorAll, even webkit.\n- If you know what I did in the last version of jQuery, you’ll know about my long standing relationship with attributes. IE8’s QSA doesn’t handle boolean attributes very well.\n
  11. Every browser has bugs in querySelectorAll, even webkit.\n- If you know what I did in the last version of jQuery, you’ll know about my long standing relationship with attributes. IE8’s QSA doesn’t handle boolean attributes very well.\n
  12. Every browser has bugs in querySelectorAll, even webkit.\n- If you know what I did in the last version of jQuery, you’ll know about my long standing relationship with attributes. IE8’s QSA doesn’t handle boolean attributes very well.\n
  13. Every browser has bugs in querySelectorAll, even webkit.\n- If you know what I did in the last version of jQuery, you’ll know about my long standing relationship with attributes. IE8’s QSA doesn’t handle boolean attributes very well.\n
  14. The only acceptable division in the selectors spec is comma, which made this easy to fix.\nSo you might be wondering what’s next.\n
  15. The only acceptable division in the selectors spec is comma, which made this easy to fix.\nSo you might be wondering what’s next.\n
  16. The only acceptable division in the selectors spec is comma, which made this easy to fix.\nSo you might be wondering what’s next.\n
  17. The only acceptable division in the selectors spec is comma, which made this easy to fix.\nSo you might be wondering what’s next.\n
  18. The only acceptable division in the selectors spec is comma, which made this easy to fix.\nSo you might be wondering what’s next.\n
  19. The only acceptable division in the selectors spec is comma, which made this easy to fix.\nSo you might be wondering what’s next.\n
  20. And I’m here to tell you, you are not prepared.\n
  21. Everything I’ve told you about Sizzle today might change before 1.8 is released. It’s true I rewrote Sizzle. I might just rewrite it again.\n
  22. Everything I’ve told you about Sizzle today might change before 1.8 is released. It’s true I rewrote Sizzle. I might just rewrite it again.\n
  23. Everything I’ve told you about Sizzle today might change before 1.8 is released. It’s true I rewrote Sizzle. I might just rewrite it again.\n
  24. Everything I’ve told you about Sizzle today might change before 1.8 is released. It’s true I rewrote Sizzle. I might just rewrite it again.\n
  25. Everything I’ve told you about Sizzle today might change before 1.8 is released. It’s true I rewrote Sizzle. I might just rewrite it again.\n
  26. Everything I’ve told you about Sizzle today might change before 1.8 is released. It’s true I rewrote Sizzle. I might just rewrite it again.\n
  27. - maybe even with a pull request\n- the issues on the jQuery bugs site will be migrated\n- stale google group, needs more life\n\n
  28. - maybe even with a pull request\n- the issues on the jQuery bugs site will be migrated\n- stale google group, needs more life\n\n
  29. - maybe even with a pull request\n- the issues on the jQuery bugs site will be migrated\n- stale google group, needs more life\n\n
  30. - maybe even with a pull request\n- the issues on the jQuery bugs site will be migrated\n- stale google group, needs more life\n\n
  31. - maybe even with a pull request\n- the issues on the jQuery bugs site will be migrated\n- stale google group, needs more life\n\n
  32. \n
  33. \n