enhance-ssr-wasm

KO | EN

gitlite — search

#javascript #python #hacktoberfest #typescript #llm #rust #deep-learning #linux #docker #nodejs #macos #windows #kubernetes #open-source

enhance-ssr-wasm

(★ 97)

Enhance SSR compiled for WASM

파일 탐색기

최종 버전 다운로드 (.zip)

- - CI.yml
  - cla.yml
- esbuild.mjs
- enhance-ssr.d.ts
- enhance-ssr.js
- basic.test.mjs
- default-elements.test.mjs
.gitignore
install.sh
LICENSE
package.json
README.md

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

## Enhance SSR WASM

Compiling Enhance SSR to WASM allows server-side rendering of Enhance elements in any language that supports WASM.

This project compiles [enhance-ssr](https://github.com/enhance-dev/enhance-ssr) into an [Extism](https://extism.org/) plugin.
It can be used with any language that Extism has an SDK for including Python, Ruby, .NET, Rust, Go, PHP, Java and more.

## Build
1. Install `extism-js` pdk: `sh install.sh`

2. Build: `npm run build`

## Usage
Here is an example using Node JS.
```javascript
import createPlugin from "@extism/extism";

const plugin = await createPlugin("dist/enhance-ssr.wasm", {
  useWasi: true,
})

const input = {
  markup: "<my-header>Hello World</my-header>",
  elements: {
    "my-header":
      "function MyHeader({ html }) { return html`<style>h1{color:red;}</style><h1><slot></slot></h1>` }",
  },
  initialState: {},
}

const output = await plugin.call("ssr", JSON.stringify(input))
const parsedOutput = JSON.parse(output.text())
const htmlDoc = parsedOutput.document

})

```

### Input:
The plugin accepts a JSON string as input with three properties.
```json
{
  "markup": "<my-header>Hello World</my-header>",
  "elements": {
    "my-header":
      "function MyHeader({ html }) { return html`<style>h1{color:red;}</style><h1><slot></slot></h1>` }",
  },
  "initialState": {},
}

```

1. `markup`: HTML string for the page to be rendered.
2. `elements`: Is an Object of elements. The keys are the custom element names and values are string representations of the function for rendering the elements.
3. `initialState`: Is an object of data used to render the components.

### Output:
The output returned by the plugin is also a JSON string with multiple properties.
```json
{
  "document": "<html><head><style>my-header h1 {\n  color: red;\n}</style></head><body><my-header enhanced=\"✨\"><h1>Hello World</h1></my-header></body></html>",
  "body": "<my-header enhanced=\"✨\"><h1>Hello World</h1></my-header>",
  "styles": "my-header h1 {\n  color: red;\n}",
}

```

## Latest Release:
The [latest release](https://github.com/enhance-dev/enhance-ssr-wasm/releases/latest) of the compiled plugin can be found under the Releases on this repository.

To use download the `enhance-ssr.wasm.gz` file and unzip it.

enhance-ssr-wasm

파일 탐색기

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

enhance-ssr-wasm

파일 탐색기

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README