@jaysalvat/x-app

Xapp

Smart in-place JS templating engine for micro-apps. About 3kb+ GZipped

• Virtual DOM
• No dependencies
• Interpolation {{ name }}
• Interpolation with object properties {{ item.name }}
• JS interpretation {{ 2 + 2 }}
• Conditions as x-if="var === true"
• Object keys loop as x-for="key in object"
• Array values loop as x-for="value in array"
• Loop metadata as $index, $first, $last
• Chainable pipes to transform vars as {{ text | truncate(10, '…') | upper }}
• Dynamic classes as x-class="{ 'red': true }"
• Dynamic attributes as x-attr="{ 'disabled': true }"
• Dynamic styles as x-style="{ 'display': true ? 'block': 'none' }"
• Css vendor prefix added to style properties
• Mixins as x-mixin and x-use
• Recursive mixins
• Includes as x-include="file.html"
• Autoshow hidden dom element when rendered
• Events
• SVG support
• Keyed diff

Note: Xapp makes heavy use of eval function.

NPM install

npm install --save @jaysalvat/x-app

Yarn install

yarn add @jaysalvat/x-app

Include from CDN

    <script src="http://unpkg.com/@jaysalvat/x-app"></script>