https://github.com/jacob-ebey/html-tagged
https://github.com/jacob-ebey/html-tagged
Last synced: 12 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/jacob-ebey/html-tagged
- Owner: jacob-ebey
- License: other
- Created: 2023-01-09T19:00:51.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2023-07-26T07:19:58.000Z (almost 3 years ago)
- Last Synced: 2025-06-14T05:03:41.359Z (about 1 year ago)
- Language: TypeScript
- Homepage: https://html-tagged.deno.dev/
- Size: 430 KB
- Stars: 18
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# html-tagged
A SSR template library that expands custom elements. Inspired by
[@enhance/ssr](https://npmjs.com/package/@enhance/ssr).
## Usage
```js
import { attr, html } from "html-tagged";
import { renderToString } from "html-tagged/server";
const elements = {
"my-element": ({ attrs }) =>
html`
`,
};
const template = html`Hello World!`;
const htmlString = renderToString(template, { elements });
console.log(htmlString);
```
will output:
```html
Hello World!
```
## Performance
The performance mainly comes from the fact this library does not fully parse the
input HTML, but instead parses just what's needed for the functionality this
library provides. This means that the library is not a full HTML parser, and it
will not be able to parse HTML that is not valid for the functionality this
library provides.
For a basic "hello world" page:
| Library | Ops/sec |
| ------------ | ------- |
| @enhance/ssr | 64867 |
| html-tagged | 256122 |
For the Oven-sh's Bun HUGE README (7630 lines):
| Library | Ops/sec |
| ------------ | ------- |
| @enhance/ssr | 47 |
| html-tagged | 306 |
## Development
Testing in Deno can be ran in a single pass with:
```sh
deno test -A
```
Or in watch mode with:
```sh
deno test -A --watch
```
Format code with:
```sh
deno task format
```
Typecheck / lint code with:
```sh
deno task check
```
## Contributing Changes
Install CLI:
```sh
npm i -g @changesets/cli
```
Generate changeset:
```sh
npx changeset
```