Stack Overflow
Stack Overflow

Questions tagged [react-suspense]

194 questions
3
votes
0 answers

React Router 6.4 nested deferred showing only parent loading indicator

I'm trying to understand how suspense / await work with nested routes. The scenario I have: I have a collection page that shows a list of items. I have a detail page that shows the details of a single item (this page is a nested route) What I want…
Braulio
  • 1,748
  • 14
  • 23
3
votes
0 answers

Component using "Suspense" showing spinner on consequent loads (changing its height for a moment)

I'm rendering a number of items, where each individual item uses the same component: This component internally uses Suspense: }>{children} Whenever I click the paginator, a new set of items is rendered.…
Danko Kozar
  • 221
  • 2
  • 8
3
votes
0 answers

Confusion about code splitting and lazy loading in React

I was looking into code splitting and lazy loading in the react docs where it mentions that The lazy component should then be rendered inside a Suspensecomponent, which allows us to show some fallback content (such as a loading indicator) while…
Joji
  • 4,703
  • 7
  • 41
  • 86
3
votes
1 answer

Invalid suspense option usage in next/dynamic

I have a loader component and I want it to appear while my page is rendering. According to the docs, when using suspense my code should look like this const DynamicLazyComponent = dynamic(() => import('../components/loader'), { suspense:…
Niic
  • 175
  • 1
  • 1
  • 11
3
votes
0 answers

Find out the source component of a missing Suspense error

When not providing a required React Suspense with a fallback and getting an error like A React component suspended while rendering, but no fallback UI was specified, is there a way to find out the source of the error (I guess internally a promise is…
medihack
  • 16,045
  • 21
  • 90
  • 134
3
votes
1 answer

Suspended while rendering, but no fallback UI was specified when I used useLoader from react-three-fiber

I'm trying to use the texture for my ThreeJS object. I'm getting error: index.js:1 Error: Earth suspended while rendering, but no fallback UI was specified. Add a component higher in the tree to provide a loading indicator…
Bakr
  • 465
  • 1
  • 6
  • 15
3
votes
1 answer

Why doesn't the loader show on the second test when I run the same test twice in jest, using react testing library, react.lazy, and suspense?

Here is a sample of my code // App.js import React, { Suspense, lazy } from "react"; const Loader = () =>
Loading...
const Login = lazy(() => import("./Login")); function App() { return (
George Tibetegya
  • 116
  • 1
  • 7
3
votes
1 answer

How to use multiple react suspense fallbacks with reach router?

I'm using "@reach/router": "^1.2.1" and in my App.js file I've got a fallback component to show while my routes are loading: }> …
Simpleton
  • 6,285
  • 11
  • 53
  • 87
3
votes
1 answer

show github, youtube like progress on each route change

There is a new concept of code splitting and async routing using suspense and lazy introduced by react itself. With that concept, how can we show the progress bar at the top of the page when the route is changed. I could show the loading icon, text…
milan
  • 2,409
  • 2
  • 34
  • 71
3
votes
1 answer

Not Supported Error when testing suspense

I'm getting a strange error when trying to use react-testing-library to test React.Suspense. The error just says "Not Supported" but doesn't give any real insight into the problem. I followed the example that Kent Dodds did on youtube. I posted…
Ben
  • 16,124
  • 22
  • 77
  • 122
2
votes
1 answer

How do I properly type a deferred response in a Remix loader?

I'm working on learning Remix with a simple application that fetches clips from a Twitch channel and displays them in a table. I'm running into a weird issue with Typescript while trying to fetch this data from the Twitch API and am unsure how to…
rosalindwills
  • 1,382
  • 13
  • 23
2
votes
1 answer

React Native BottomTabs navigator not lazy loading initial screen

I just added Suspense to my BottomTabNavigator in my React Native app. The problem is that the first screen (HomeScreen) is not displaying - all others do. I see just white background when I navigate to Home Screen. Here's what my code looks…
Arkadi
  • 1,153
  • 1
  • 14
  • 35
2
votes
3 answers

How use react suspense with redux toolkit?

I am use Redux toolkit for show data of a API and I need show for the user a "loading data..." or a spinner before of show the city information. I am trying use the React Suspense, but don't work. Probably I am doing things wrong. informationCIty.js…
Begginer
  • 65
  • 1
  • 7
2
votes
0 answers

How to make React Suspense component conditional when SSR?

I want to pass a flag prop to Suspense component, telling it to behave like a normal div, hence being loaded immediately when renderToPipeableStream on the server. import React, { Suspense } from 'react'; function ConditionalSuspense():…
Mateusz
  • 69
  • 1
  • 5
2
votes
1 answer

Canvas freezes when large 3d model is being loaded in react Suspense in react-three-fiber

Based on this sample link of progressive enhancement with React Suspense, I tried to use the method in my project with another .glb file. I got the 3D model from Sketchfab with initial size of 10MB. With the help of Sqoosh and GLTF Report, I…
LY Hooi
  • 165
  • 1
  • 9
1 2
3
…
12 13