Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/mourner/yeahjs
A tiny, modern, fast EJS templating library
https://github.com/mourner/yeahjs
ejs javascript templating
Last synced: 24 days ago
JSON representation
A tiny, modern, fast EJS templating library
- Host: GitHub
- URL: https://github.com/mourner/yeahjs
- Owner: mourner
- License: isc
- Created: 2020-05-14T14:03:14.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2023-04-10T14:41:21.000Z (almost 2 years ago)
- Last Synced: 2025-01-03T14:52:32.885Z (29 days ago)
- Topics: ejs, javascript, templating
- Language: JavaScript
- Homepage:
- Size: 37.1 KB
- Stars: 45
- Watchers: 4
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# yeahjs
A tiny, modern, fast implementation of EJS (Embedded JavaScript Templates). A nearly drop-in replacement for [`ejs`](https://ejs.co/) with a few [intentional limitations](#compared-to-ejs).
[![Build Status](https://github.com/mourner/yeahjs/workflows/Node/badge.svg?branch=master)](https://github.com/mourner/yeahjs/actions)
[![Install Size](https://packagephobia.now.sh/badge?p=yeahjs)](https://packagephobia.now.sh/result?p=yeahjs)
[![Min-zipped Size](https://badgen.net/bundlephobia/minzip/yeahjs)](https://bundlephobia.com/result?p=yeahjs)
[![Simply Awesome](https://img.shields.io/badge/simply-awesome-brightgreen.svg)](https://github.com/mourner/projects)## Example
```ejs
- <%= word %>
<% for (let word of locals.items) { -%>
<% } -%>
```
```js
import {compile} from 'yeahjs';
const template = compile(ejs);
const output = template({items: ['flour', 'water', 'salt']});
```
```html
- flour
- water
- salt
```
## Compared to `ejs`
There are a few key differences that allow `yeahjs` to be so small and fast:
- **Strict mode** only (no `with` keyword in compiled functions).
- Only **static path includes** (`include('header.ejs')`, but not `include(dir + file)`).
- File handling **not included** — provide it with `read` and `resolve` options (see [example](#file-handling)).
Otherwise `yeahjs` produces identical output to `ejs`.
### Strict mode only
The `with` keyword has a very significant impact on performance in JavaScript, in addition to introducing hard to debug issues. Limiting `yeahjs` to strict mode makes sure it's always as fast and predictable as possible.
### Static path includes
Static path includes make sure `yeahjs` can fully compile templates with includes at `compile` time, avoiding lazy compilation during template evaluation. This makes evaluation faster and more predictable.
### Custom file handling
Not including any file-system-specific code makes `yeahjs` environment-agnostic, having the same bundle for both Node and the browsers and giving full control over how includes get read and resolved.
## Usage
```js
import {compile} from 'yeahjs';
const template = compile(ejs, options);
````
Returns a function of the form `(data) => content`. Options:
- `localsName`: the namespace to use for accessing template data (`locals` by default for `<%= locals.foo %>`).
- `locals`: an array of variables to access directly (e.g. `['foo']` will allow `<%= foo %>` instead of `<%= locals.foo %>`).
- `context`: an object to use as `this` in templates (`null` by default).
- `escape`: a custom escaping function for values inside `<%= ... %>` (escapes XML by default).
- `async`: if `true`, generates an async function to make it possible to use `await` inside templates (`false` by default).
- `filename`: the file name of the template if present (used for resolving includes).
- `read`: a function of the form `(filename) => content` for reading includes (e.g. from file system in Node).
- `resolve`: a function of the form `(parentPath, includePath) => path` for resolving include paths.
- `cache`: an object to cache compiled includes in for faster compilation; reuse between `compile` runs for best performance (`{}` by default).
## EJS cheatsheet
- `<%= value %>`: output the value (escaped).
- `<%- value %>`: output the value (raw).
- `<% code %>`: use arbitrary JavaScript.
- `<%_ code %>`: use arbitrary JavaScript and strip whitespace on the same line before the tag.
- `... _%>`: strip whitespace and a single line break on the same line after the tag.
- `... -%>`: strip a single line break immediately after the tag.
- `<%%`, `%%>`: output literal `<%` or `%>`.
- `<%# comment %>`: comment (ignored).
- `<%- include('path/to/template.ejs', {foo: bar}) %>`: include another template, optionally passing data.
## File handling
An example of using `read`, `resolve` and `filename` options in Node.js to process includes:
```js
import {readFileSync} from 'fs';
import {join, dirname} from 'path';
const template = yeahjs.compile(`<%- include('../bar.html') %>`, {
filename: 'foo/foo.html',
resolve: (parent, filename) => join(dirname(parent), filename),
read: filename => readFileSync(filename, 'utf8')
});
```