React v. Lit

Compares React and Lit implementations of the React homepage demos.

The React side uses React ESM and HTM. These tweaks eliminate the need for a build step. You can run the standard React demos in another tab to compare further.

LitElement is used for most demos on the Lit side with the exception of Introducing Hooks which brings in Haunted.

Worth noting is the use of install-time ESM-enabling technology, Snowpack.

Size (GZIPPED, MINIFIED)
React ESM + HTM38 KB + 0.6 KB
LitElement6.9 KB
Haunted5.6 KB

A Simple Component

ReactLit
Output
Output

A Stateful Component

ReactLit
Output
Output

An Application

ReactLit
Output
Output

A Component Using External Plugins

ReactLit
Output
Output

Introducing Hooks

ReactLit
Output
Output