Hacker News Digest

• Lit — простая, быстрая библиотека для Web Components
• Bluesky: lit.dev

---

Основные плюсы

• Simple
  Минимум шаблонного кода: реактивность, декларативные шаблоны, продуманные фичи.

• Fast
  ≈ 5 КБ (сжато), рендер только изменённых частей, без виртуального DOM.

• Web Components
  Нативные кастом-элементы работают в любом фреймворке и без него.

---

Мини-пример

import {html, css, LitElement} from 'lit';
import {customElement, property} from 'lit/decorators.js';

@customElement('simple-greeting')
export class SimpleGreeting extends LitElement {
  static styles = css`p { color: blue }`;
  @property() name = 'Somebody';
  render() {
    return html`<p>Hello, ${this.name}!</p>`;
  }
}

<simple-greeting name="World"></simple-greeting>

Попробовать в Playground

---

Возможности

• Custom Elements — встраиваются как обычные теги.
• Scoped styles — Shadow DOM изолирует CSS.
• Reactive properties — автоматический перерендер при изменении.
• Declarative templates — нативные литералы, без компиляции.

---

Что строят на Lit

• Shareable Components — капсулы для любого стека.
• Design Systems — единые компоненты под разные фреймворки.
• Sites & Apps — постепенное улучшение или полные приложения.

---

Кто использует

Adobe Spectrum, Alaska Auro, Cisco Momentum, Home Assistant, IBM Carbon, Lion, Pharos, PWA Starter, SAP UI5, Shoelace, Hilla, Clarity, Wired Elements и др.

---

Учимся и общаемся

• Туториалы
• Playground
• Документация
• Get started