Skip to content

coder-drinker/dlight

 
 

Repository files navigation

Core Packages
dlight babel-preset-dlight @dlightjs/types create-dlightjs

Ecosystem
components easy-css vite-plugin-dlight transpiler transpiler-standalone material-icons emotion

DX-first UI rendering library.

  • 🥳 Delightful
    • With an API designed to be intuitive and user-friendly, web development becomes effortless with Dlight, whether you're building a simple website or a complex web application.Dlight enhances code performance at compile time and directly manipulates the DOM, which makes the execution speed of the code as close to vanilla JavaScript as possible, even with limited optimization knowledge.
  • 🚀 Performant
    • With a minuscule file size of just 4KB, Dlight is lightning-fast and ultra-lightweight, delivering optimal performance without the need for manual optimization.
  • ✨ DX-first
    • Dlight uses the syntax of function calls and dot notation to make development more enjoyable, without the need to write outdated and hard-to-read XML code.
  • 🪶 Intuitively Simple
    • Dlight is born reactive and is designed to be intuitively simple, with a minimalistic API that requires no memorization of complex functions or libraries.

Preview

import { View } from "@dlightjs/dlight"

class MyComp extends View {
  toggle = true
  fruits = ["🍎", "🍊", "🥑"]

  Body() {
    h1("hello, dlight js")
    button("toggle")
      .className("toggle")
      .onclick(() => {
        this.toggle = !this.toggle
      })
    if (this.toggle) {
      "simple text"
    }
    for (const fruit of this.fruits) {
      div(fruit)
    }
  }
}

Try it online

Documentation

README-dlight.md

Homepage

Building with DLight now👨🏻‍💻

Contributors

Duan Yihan
Duan Yihan

🚇 ⚠️ 💻
orange04
orange04

💻 🎨

About

Dlight.js

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 99.1%
  • Other 0.9%