hardview

What problem does it solve?

Building UIs without frameworks can lead to spaghetti code, inconsistent patterns, and performance pitfalls. This skill provides a structured approach for crafting vanilla JavaScript views that are maintainable, predictable, and high-performance.

Core Features & Use Cases

• Template-first architecture using a <template> element for HTML structure.
• Dedicated clone() and init() functions that encapsulate rendering and state logic.
• Update cycle pattern: update() returns a renderable DOM and supports props down, events up.
• Optional composition with child views and explicit DOM/State update functions.
• Use cases: building small, framework-free UI components, widgets, or micro-views that can be embedded anywhere.

Quick Start

Import the skill's init function and call it to create an update function, then render the returned element into your page by passing the initial props.