Build Vanilla Lynx Apps

Use this skill to build Lynx apps directly with Element PAPI and Lynx Runtime APIs, without ReactLynx or JSX.

Core Rules

• Do not use ReactLynx, JSX, virtual DOM, or browser DOM APIs unless explicitly requested.
• Always pass all four required arguments to __AddEventListener(element, eventName, handler, options); pass {} when no listener options are needed.
• Keep Element PAPI tree creation, mutation, lifecycle rendering, and UI updates in main-thread.ts. Never call Element PAPI APIs or __FlushElementTree() from background.ts; the background thread only sends serializable patches for the main thread to apply and flush.
• Rely on the SDK flush for initial render; call __FlushElementTree() after later UI mutations.
• Add background.ts only for heavier business logic, async work, timers, native calls, or data processing. Keep cross-thread payloads serializable.
• Use lynx.getEngine() only for engine-defined lifecycle events such as __RenderPage, __UpdatePage, and __DestroyLifetime; never use it for app-defined thread-local or cross-thread events. Lifecycle handlers may ignore their event payload when the implementation does not need it. Keep stable handler references for long-lived and cross-thread listeners; remove them with the same context and event name during destroy instead of registering inline callbacks.
• Keep external bundle building and loading separate and background-only. External modules must be plain TypeScript or JavaScript; never use ReactLynx, JSX, or ReactLynx transforms in them. Match the rslib entry key to the first loadScript argument.

Reference Routing

Read only the reference files needed for the current task. Preserve their explicit constraints rather than replacing them with generic guidance.