Introduction

Lithium (Li³) is a lightweight element (get it?) library to create custom elements using standard Web API's as much as possible.

We stick to Web API's implemented in mostly used browsers and platforms, to get an experience similar to VueJS, Alpine or Solid, without the compilation steps that these frameworks usually need.

Starting from only HTML, we can progressively shape an interface, expanding on content already in-place. This gives us a "server-side rendering" capability without special tools (aka Progressive Enhancement).

Importing the library

We use two ES Module features to load li3 and it's sub-modules: import map and module script type

The import map allows us load @li3/* packages using a package name. This has to be the first <script> tag in a page.

<script type="importmap">
  { "imports": { "@li3/": "https://cdn.li3.dev/@li3/" } }
</script>
Copy

Next, this script tag loads the main library and initializes all components and apps.

<script type="module">
  import '@li3/web';
</script>
Copy