@rkrupinski/react

An experimental, lightweight React alternative.

Table of contents:

• Getting started
• Example
• API
  • JSX
  • Top-level API
  • Hooks

Getting started

Install:

yarn add @rkrupinski/react

Make sure to set:

{
"jsx": "react"
}

in your tsconfig.json -> "compilerOptions".

Now you're all set:

/* @jsx createElement *//* @jsxFrag Fragment */import{render,useState,useEffect,createElement,Fragment,typeFC,}from"@rkrupinski/react";constApp: FC=()=>{const[clicked,setClicked]=useState(0);useEffect(()=>{console.log(`Clicked ${clicked} times`);},[clicked]);return(<><h1>Hello!</h1><buttononClick={()=>{setClicked((c)=>c+1);}}>{clicked}</button></>);};constroot=document.querySelector("#root")asHTMLElement;render(<App/>,root);

Example

• Live
• Source code

API

Read about React first, then come back here 🙏.

JSX

Name	React	Caveats
createElement	createElement	Requires custom pragma (/* @jsx createElement */). Limited to HTML elements (for the time being). Weakly (any) typed host elements (for the time being).
Fragment	Fragment	Requires custom pragma (/* @jsxFrag Fragment */).

Top-level API

Name	React	Caveats
render	render	No third argument (callback) No concurrent mode One root/app at a time (for the time being).
unmountAt	unmountComponentAtNode	-

Hooks

Name	React	Caveats
useState	useState	-
useMemo	useMemo	-
useCallback	useCallback	-
useEffect	useEffect	-