Compiler-Wired Reactivity

Gea doesn't use signals, hooks, dependency arrays, or a virtual DOM. Components are ordinary JavaScript — classes with state and methods, getters for computed values — and @geajs/vite-plugin analyses the JSX at build time, works out which DOM nodes depend on which state paths, and generates the reactive wiring. At runtime only the affected nodes are patched.

A Proxy-Based Store

weather-store.js is a singleton class extending Store. Its fields (searchQuery, isLoading, hasError, weatherData, activeForecastIndex) are made reactive through a deep Proxy, so mutations are plain assignments like this.isLoading = true.

Getters as Computed Values

Derived state such as showContent, locationLabel, currentTemperature and forecastDays are ordinary JavaScript getters on the store. The compiler tracks which state paths each getter reads and re-evaluates the dependent DOM bindings when those paths change.

Class and Function Components

Each UI piece, like SearchForm.jsx and CurrentWeather.jsx, extends Component and returns JSX from template(), using HTML-style attributes (class, for) and native-style event bindings (click={...}, submit={...}) wired through document-level event delegation. Stateless UI like LoadingState.jsx is a plain function which the compiler converts to a class component at build time.

Conditional Rendering and Keyed Lists

{condition && <X />} in WeatherDisplay.jsx compiles into <template> markers with swap logic, so hidden branches cost no DOM nodes. The 7-day forecast in Forecast.jsx maps weatherStore.forecastDays to <ForecastItem key={day.date} day={day} />, and list changes are reconciled per-item rather than re-rendered.