Harald Kirschner’s Sly

By  on  

Back in December when the Sizzle selector engine was announced, John Resig's creation was thought to be the end game. Four months later it seems as though it was just the beginning.

Harald Kirschner has released Sly, a standalone JavaScript selector engine that absolutely tears through the DOM. Sly is a tiny 3KB minified and gzipped, supports all CSS3 selectors, and provides functionality to create your own custom combinators. Don't believe me? Read Harald's documentation.

Support

Usage Examples

// Finds all div blocks
blocks = Sly.search('div');

// Finds all anchors with `href` attribute that starts with `"http://"`
anchors = Sly.search('a[href^="http://"]');

// Finds all list item that are direct descendants of the list item with id `"navigation"`
items = Sly.search('ul#navigation > li');

// Finds all heading elements
heads = Sly.search('h1, h2, h3, h4, h5, h6');

// Finds all odd rows in all tables with the class `"zebra"`
rows = Sly.search('table.zebra tr:odd');

// Finds something and looks really complex
inputs = Sly.search('form[action$=/send/] label~span+input[type=text]:first-child');

That last one was something special, eh?

Congratulations!

Join me in extending a huge congratulations and thank you to Harald! While Sizzle got the ball rolling, the selector engine game isn't over by any means!

Recent Features

  • By
    Interview with a Pornhub Web Developer

    Regardless of your stance on pornography, it would be impossible to deny the massive impact the adult website industry has had on pushing the web forward. From pushing the browser's video limits to pushing ads through WebSocket so ad blockers don't detect them, you have...

  • 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
    jQuery Wookmark

    The first thing that hits you when you visit Pinterest is "Whoa, the columns are the same width and the photos are cut to fit just the way they should."  Basic web users probably think nothing of it but as a developer, I can appreciate the...

  • By
    Using MooTools to Instruct Google Analytics to Track Outbound Links

    Google Analytics provides a wealth of information about who's coming to your website. One of the most important statistics the service provides is the referrer statistic -- you've gotta know who's sending people to your website, right? What about where you send others though?

Discussion

  1. Sly is awesome. I’ve been messing around with it lately. It’s fast as hell.

  2. Interesting! By the way, on your site, simple key shortcuts such as pressing space or arrows to scroll, or Page Up/Down, doesn’t always work. I tested some different scenarios, and when entering something to a comment input and then again clicking outside the input, it suddenly works… Weird behaviour. I’m using Firefox 3.0.7.

  3. Jem

    I read about this first on clientcide, but definitely very exciting to see someone with some strong mootools ties putting out a selector engine. I don’t have anything against jquery, but I’ve been a hardcore mootools fan for some time now, and I suppose its that passive nature mootools and the mootools community have in regards to advertising that I enjoy. Its a framework built in a way that makes sense, and it doesn’t need phony gimmicks and underhanded approaches to attract the audience it wants. I was pretty inspired with how much more intelligent the responses were from the community when Sizzle advocates were trying to weasel the engine into every framework core.

    I haven’t gotten a chance to use Sly yet, but I’m looking forward to the first opportunity.

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