preact-async-route
Async route component for preact-router
npm i -D preact-async-route
preact-async-route provides <AsyncRoute>
tag to load your components lazily.
<AsyncRoute>
provides similar props to return a lazily loaded component either as a Promise resolving to the component or return the component in a callback.
<AsyncRoute>
also has a loading props, to which you can pass a component to be shown while the component is being lazily loaded.
Version 2.0
Version 2.0 brings support for a new prop component
in order to make usage of already imported components now preact-async-route will support 2 props
component
this will just take the JSX component itself and NOT the function- for function calls
getComponent
is the prop
check README 👇
Usage Example
; ; ; ; ; ; /** @jsx h */ /** arguments passed to getComponent: url -- matched url cb -- in case you are not returning a promise props -- props that component will recive upon being loaded */ { return System; } const Main = <Router> <Home path="/" /> <Terms path="/terms" /> <AsyncRoute path="/profile/:userid" component=Home /> <AsyncRoute path="/friends/:userid" getComponent=getProfile loading={return <Loading/>} /> </Router> ;