Skip to content


Subversion checkout URL

You can clone with
Download ZIP


Feature Request: Prototypes #2

wooorm opened this Issue · 7 comments

2 participants


One of the greatest thing a preprocessor can do, is help better the authors writing experience: Less doing and more results.

This is why I propose adding a “prototype” like feature to SIML, a feature that allows authors to write concise code—writing certain selectors once, instead of multiple times.

Note: I’m not talking about mixins: Mixins are great too, but I’m seeing prototypes as an element, rather than “document fragment”, like feature.


Setting prototypes: /[A-Za-z][A-Za-z0-9_-]* = /

// Setting prototypes.
primary-header = h1.giant

// Setting prototypes with Default values in prototypes.
image = img[alt=""]

Getting prototypes: /\+[A-Za-z][A-Za-z0-9_-]*/

// Getting prototypes.
+primary-header "Hello World!"

// Getting and implicitly using default `alt` attribute.

// Getting and overwriting default `alt` attribute.
+image[alt="a crocodile swimming in a river."][src="./other-image.png"]


<h1 class="giant">Hello World!</h1>
<img alt="" src="./image.png" />
<img alt="a crocodile swimming in a river." src="./other-image.png" />

Final Notes

Sure, this is just a draft—the regexes are just an idea, I haven’t thought about what happens with multiple classes (in the prototype setting, and the prototype getting)—but “mixins” seem like a logical extension of an HTML preprocessor: One which I haven’t seen in HAML, Jade, Slim, and the like.


I really like this idea!

I think the prototype-getter token will have to be something other than '+' though -- it would introduce too much ambiguity since we're already using it as the CSS sibling combinator.

Thinking about it, the parser could just check, when you specify a selectorTag (e.g. div, header), whether or not a prototype is defined by that name. So we don't necessarily need an explicit operator to recall prototypes. It could be as simple as.

something =

header >


<header><div class="foo bar"></div></header>

What are your thoughts?


Like the idea.

And you're right about the +. Dropping it would also give the author the ability to rewrite a selectorTag: e.g. img = img[alt=""].

However, what about scope? Would the following SIML…

    img = img[alt=""]

…result in this…

<img src="a" />
    <img src="b" alt="" />
<img src="c" alt="" />

…or this?

<img src="a" />
    <img src="b" alt="" />
<img src="c" />

I'd opt for the latter; but would it be easy to implement in the parser?


I agree -- the latter makes sense. Fortunately, it's too hard to handle scoping.


I've begun implementation in the feature-prototype branch. It was surprisingly simple to implement. Feel free to check it out and play with test/resources/live-parser.html

Next step is to write some tests.


I like it, i like it a lot!


Ok, it's now in the 0.3.2 release! :)

Ready to play with here:

Here's one of the chunks I've tested it with:

link =[href=""][title="placeholder"]

Works great! Also: Nice fix on the img[alt=a][alt=b] thing, I wasn’t sure if it was a bug, or a feature .

@padolsey padolsey closed this
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.