DOSAYGO Studio

!: Minimalist JavaScript View Framework

By Cris, Undated

Building web UIs often involves heavy frameworks with virtual DOM overhead, complicating simple tasks. I created ! (Bang), a minimalist JavaScript view framework that uses Custom Elements and Shadow DOM for scoped CSS, with a novel HTML comment hack for void tags like <!my-input />. In the web’s Zen garden, ! is a raked pebble path, offering clarity through simplicity.

! enables incremental rendering without a virtual DOM, using native templating and Custom Elements, with a unique syntax for void tags.

class MyInput extends HTMLElement {
  constructor() {
    super();
    this.attachShadow({ mode: 'open' });
    this.shadowRoot.innerHTML = `
      
      
    `;
  }
}
// Register the custom element with comment-based void tag support
customElements.define('my-input', MyInput);
// Usage: <!my-input />

This code defines a Custom Element with Shadow DOM, using the void tag hack for simplicity. !’s minimalism streamlines UI development.

Bang interface: a Zen garden with minimalistic stones, representing simplicity in UI design

Building ! was like tending a Zen garden, finding peace in simplicity. At DOSAYGO, we value clarity, crafting tools that simplify without sacrificing power. ! is a path to serene development, a quiet space for creating UIs.