JSPM – esor@1.0.10

Package Exports

esor
esor/dist/esor.min.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (esor) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Fast, light and modern

All the power of Web Components and more in just 3 KB.

Esor is a lightweight and efficient JavaScript framework for building reactive user interfaces, leveraging native Web Components, signal-based reactivity, and an optimized templating engine.

🔥 Main Features

Native Web Components: Encapsulated components using Shadow DOM.
Signal-based Reactivity: Inspired by SolidJS, with functions like signal, effect, and computed.
Declarative Templating: Template syntax similar to lit-html.
Efficient DOM Reconciliation: Optimized updates without a Virtual DOM.
Lifecycle & Events: Modular hooks and event management.
Optimal Speed: Performance-centric architecture.
Simple API: Familiar patterns from React and SolidJS.
No Compilation Required.

📖 More Information

Learn more on our Esor Website ➞.

🔘 Badges

You can also check out some awesome libraries in the awesome-esor list 😎.

📦 Installation

Install Esor using npm or yarn:

npm install esor
# or
yarn add esor

⚛️ Basic Usage

Below is an example of a counter using the new API:

import { component, html, signal } from "esor";

component("my-counter", () => {
  const count = signal(0);

  return html`
    <div>
      <p>Counter: ${count()}</p>
      <button onclick=${() => count(count() + 1)}>Increment</button>
    </div>
  `;
});

Note:
In the new API, the signal function is used to create reactive values. To retrieve the current value, call count(), and to update it, call count(newValue).

Use it in your HTML like this:

<my-counter></my-counter>

📚 Documentation

For more detailed information about the API, please check the official documentation.

🫶🏻 Contribute

Contributions are welcome! Please review our Contribution Guidelines before submitting a pull request.

🔖 License

This project is distributed under the MIT license. See the LICENSE file for more details.