Sizzle and Peppy Selector Engines in MooTools

By  on  

A few weeks back I touched on how you could implement the Peppy and Sizzle selector engines in MooTools. Both posts showed how to remove the default Moo engine from use and instead make each respective selector engine the one and only. It doesn't have to be that way. You could use all three engines within the page as well.

Peppy, Sizzle, and Moo Together

//assuming that the JavaScript files we brought in via simple XHTML above...

/* MooTools */
var divs = $$('div');

/* Sizzle */
Window.$Sizzle = function(selector){
	return new Elements(new Sizzle(selector));
}
//sizzle usage
var divs = $Sizzle('div');

/* Peppy */
Window.$Peppy = function(selector){
	return new Elements(new peppy.query(selector));
}
//Peppy usage
var divs = $Peppy('div');

Why do this? Each engine has its advantages. Sizzle generally does better with Internet Explorer so if you detect that the user is using IE, you may want to use Sizzle to grab the elements instead.

In most cases the overhead of bringing in each engine makes this strategy overkill. It's definitely an option though.

Recent Features

  • By
    Chris Coyier’s Favorite CodePen Demos

    David asked me if I'd be up for a guest post picking out some of my favorite Pens from CodePen. A daunting task! There are so many! I managed to pick a few though that have blown me away over the past few months. If you...

  • By
    An Interview with Eric Meyer

    Your early CSS books were instrumental in pushing my love for front end technologies. What was it about CSS that you fell in love with and drove you to write about it? At first blush, it was the simplicity of it as compared to the table-and-spacer...

Incredible Demos

  • By
    MooTools 1.3 Browser Object

    MooTools 1.3 was just released and one of the big additions is the Browser object.  The Browser object is very helpful in that not only do you get information about browser type and browser versions, you can gain information about the user's OS, browser plugins, and...

  • By
    MooTools Typewriter Effect Plugin Upgrade

    Last week I shared my MooTools Typewriter Class with you. It was pretty well received and I got a few feature requests that I've implemented including "backspacing" and character variance delays. I'm not going to explain the old code, so click here...

Discussion

  1. Is there any REAL and REAL-WORLD benefit to actually do this or include one of the other selector engines? Does one get the performance from Sizzle when just using its selector engine? .. :f

    Great shit though David. :)

  2. I can’t wait to test sizzle. Where can I get a break down of each engine’s benefits?

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!