{ Frameless }

great work, a few questions


thought I would post here for community benefit  (I would remove individual requests as it may confuse folks)


I am building up an example usage of frameless here


and have a few questions;

* its unclear why for-each example works and other things like inserting <variable/> doesnt ... I guess I am confused as to what can go into an html template and how can I do mustache style transclusion

* would be very useful if you could provide a few basic xml/xslt examples ... its unclear if frameless xslt processing is proposing intermixing xslt inside html or should it live separately and transform with js entry point (or can u use a xml processing instruction ?)

* <script data-source/> usage to set default context (like saxon-ce) would be interesting

* I have defined a $doc as prescribed but does not seem to be able to use it

thx in advance, Jim Fuller

Have more questions? Submit a request


  • Avatar
    Jim Fuller

    response from Robbert Broersma

    Hi James,

    Thanks for giving Frameless a spin so soon after the release!

    We're working on three things:

    1) An XSLT 2 processor

    2) Inline HTML bindings

    3) Reactiveness for inline HTML templates

    The XSLT 2 processor can be used standalone using the JavaScript API:


    Or in browsers that support it using the <?xml-stylesheet?> processing instruction [1]:


    Secondly there are the HTML form bindings, such as data-ref for <input>, <select> et cetera. They can be used to edit XML data that is to be sent to the server, for example. There is also a reactive if, which is not an element but comes in the form of the data-if attribute:


    As you've seen there is also the data-text attribute.

    We also want to bring the power of XSLT 2 to a syntax that lies closer to HTML. The <for-each> element is first of the XSLT instructions that we're porting to HTML. The grouping demo http://frameless.io/demo/grouping-tags/ is an example of something that takes only a couple of lines of code with this syntax. The <for-each> element is not reactive... yet.

    We're currently working on making the reactive <for-each> more stable, we're hoping to demonstrate this next week.

    So <for-each> is basically an alias for xsl:for-each and xsl:for-each-group and is actually executed by the XSLT processor. We're working on making more of XSLT available, such as <variable>. Currently <for-each> is the only element that is handled as inline XSLT. Starting with xsl:for-each, xsl:apply-templates/ and xsl:if we're working our way trough the template language to making it reactive.

    I've enabled the mustache templates in XSLT stylesheets that can be used as short-hand for xsl:value-of, you can use them inside all XSLT templates and -- because it is run by the XSLT engine -- also in the <for-each> element.

    Of course we're working hard to bring all these different engines together to create a more intuitive experience.

    The $doc in you gist will be available after using:

    var doc = Frameless.parseXML('....')

    Frameless.variable('doc', doc)

    I'll be working on more demo's and tutorials to make things clearer. Please keep in touch!

    Kind regards,


    1] This is not supported in the most recent Internet Explorer versions, but the processing instruction is still useful during development.


  • Avatar
    Robbert Broersma

    Thanks, we'll be clarifying the homepage to these points.

    Using custom elements such as <for-each> will indeed cause HTML validation errors. I believe that for the new Web Components specification custom elements will be allowed in HTML, and because HTML will never be using element names with a dash, <for-each> will not conflict with HTML and should be recognized as a custom element. I'm not sure yet what we should do with elements like <if> that don't have dash in them.

Powered by Zendesk