@lynx-js/react
@lynx-js/react is React for Lynx. It keeps the React 17 API surface,
re-exporting the standard hooks and APIs, and adds what the dual-thread
model needs: main-thread functions, the data a page receives from native,
and a few compile-time directives and macros.
Remarks
The React APIs below behave as the official React reference describes them, unless a page says otherwise. They are compatible with React 17 and Preact.
React entered its "concurrent" era with
React 18. Concurrent
features such as useTransition and useDeferredValue make strict demands
on how the host schedules work — they depend on browser Web APIs or on the
React Native architecture. Lynx evolves its own architecture, so ReactLynx
builds on React 17 and keeps the React programming model. The parts of
React 19 and the
React Compiler that do not
depend on the concurrent architecture are still on the table.
For an introduction to ReactLynx, see the ReactLynx guides.
Documents
Interfaces
Functions
Functions for crossing the thread boundary, creating elements outside JSX and mounting the root.
- Children
- root
- cloneElement
- createContext
- createElement
- createPortal
- createRef
- defineMainThreadObjectType
- forwardRef
- isValidElement
- lazy
- markFirstScreenSyncReady
- memo
- runOnBackground
- runOnMainThread
- useMainThreadObject
- withInitDataInState
Components
Provider and consumer components for the data a Lynx page receives from the native side, and the components re-exported from React.
- Component
- PureComponent
- Fragment
- GlobalPropsConsumer
- GlobalPropsProvider
- InitDataConsumer
- InitDataProvider
- Suspense
Hooks
Hooks that ReactLynx adds on top of React, plus the React hooks it re-exports or re-implements for the dual-thread model.
- useCallback
- useContext
- useDebugValue
- useEffect
- useErrorBoundary
- useGlobalProps
- useGlobalPropsChanged
- useImperativeHandle
- useInitData
- useInitDataChanged
useLayoutEffect- useLynxGlobalEventListener
- useMainThreadRef
- useMemo
- useReducer
- useRef
- useState
- useSyncExternalStore
Types
The types and classes exported by @lynx-js/react. Augment InitData and
GlobalProps in your project to type the data your page receives.