There are these different modes how the page data are loaded:
- Classic way without Suspense: All or nothing: Fetching all data in place within a
useEffect()+ props-drilling - One global Suspense: Waiting until all: Waiting until all data got fetched
- "Waterfall": Incremental Loading: More than 1 Suspense in the tree hierarchy:
- Side-by-Side: Show both: incremental loading and wait-for-all
On the right side, there is a Cache-loading inspector "hitchcock" by @pombo, based on the work of Jared Palmer
List the (feature) branches of a GitHub repository with its last commit's
- build status-es
- linked PR
- commit message and author
- linked deployment
After invoking this in a shell
git clone https://github.com/lowsky/react-suspense-meetup-demo
cd react-suspense-meetup-demo
yarn
then set up the github-token (see below: Setup GitHub Token )
before starting local dev mode via:
yarn dev
This runs Next.js in dev-mode
Now, you can open the home http://localhost:3000 in your browser.
Have fun!
You need to create your own github-token (see https://github.com/settings/tokens/) and
store it locally in .env file
# create an .env file with this content ...
GITHUB_TOKEN=XXX
# ... and replace the XXX with your API key
# typically something like
# GITHUB_TOKEN=ghp_....
- Next.js
- ChakraUI
Bulma - React
- React.Cache
- React.Suspend
- Typescript
Licensed under the Apache License 2.0, Copyright ©️ 2023 Robert Hostlowsky. See LICENSE for more information.