Questions tagged [react-suspense]
194 questions
1
vote
0 answers
Why is my image not loading using the Suspense tag
This is my App.js,
import React, { Suspense } from 'react';
import './App.css';
import SyncLoader from "react-spinners/SyncLoader";
const Newhome = React.lazy(() => import('./COMPONENTS/Newhome'));
function App() {
return (
…
Ankit
- 1,359
- 1
- 2
- 15
1
vote
0 answers
React 18 SSR chunk preload (like in @loadable)
Using ChunkExtractor from @loadable/server, we can include links in the body of the page to preload the necessary chunks during SSR.
This speeds up hydration by having these scripts loaded at the same time as the main chunk just after the HTML…
Alexander G
- 11
- 1
1
vote
0 answers
Promise Returned By getRunningQueryThunk does not sync with actual useQuery function in RTKQ
I think the promise Returned By getRunningQueryThunk does not sync with actual useQuery life cycle in RTKQ.
const args = { name: "pikachu" };
const Pokemon = () => {
const { data } = useGetPokemonByNameQuery(args);
const dispatch =…
Song Lee
- 11
- 1
1
vote
1 answer
Infinite loop when using React Suspense and Axios data fetch
I'm trying to fetch data with Axios and display it in a suspense element, like in this tutorial: https://dev.to/darkmavis1980/a-practical-example-of-suspense-in-react-18-3lln
However, the wrapPromise function gets me in an endless loop:
function…
BTC
- 2,975
- 1
- 19
- 25
1
vote
1 answer
How to use react v18 with nextjs v12.3.1 - Suspense boundary and StartTransition and new createRoot
I am trying to figure out how to get a react app to work next js.
I am using this boilerplate app template, but with react v18 (and next v 12.3.1).
I tried changing _app.tsx so that it is now wrapped in a suspense boundary:
Mel
- 2,481
- 26
- 113
- 273
1
vote
0 answers
React Suspense, how to get an update after initial render?
I'm having trouble figuring out how I can update my resource to rerender.
For example:
...Lazy import('./childComponent'
const resource = fetchData()
// Main component:
return (
ImNotADev
- 11
- 2
1
vote
0 answers
How to make React Suspense work with a promise?
I don't quite get how Suspense works in React. I see Relay uses it, and even in code from another team at the company, only when I ask them how it works, they cannot really answer it (it seems they copied the code from somewhere).
For example, if I…
Stefanie Gauss
- 425
- 3
- 9
1
vote
1 answer
Using React Suspense with react-router-dom
I am trying to implement lazy loading to my projects so I can lazy load routes of react-router-dom. While going through internet I noticed that there are two ways to implement it - wrapping all routes with one React.Suspense or putting every page…
MySQLNewbie
- 31
- 2
1
vote
1 answer
How to use React.Suspense loader for JS chunk fetch together with data fetch?
We are trying to add loader in our React project (version 18) when we are using lazy-loaded components (during the JS chunk fetch) Suspense fallback loader is displayed afterward the lazy-loaded component fetches its own data in the use effect and…
Syler92
- 41
- 6
1
vote
1 answer
React 18 and Suspense problem (worked in older versions)
In my React app with react router I used to define routes like this:
Kiszuriwalilibori
- 277
- 3
- 13
1
vote
1 answer
React Suspense makes network waterfall when a component fetches more than twice
I'm using react-query and set suspense true.
I found that my web app became slow. That's because suspense makes network waterfall.
Below img is this case.
network tab image
However when I configure suspense to false, it works in parallel.
network…
euijin-kim
- 21
- 4
1
vote
0 answers
React js Code Splitting not creating chunks
Im trying to lazy load routes but no matter what I do, I only have one main chunk. Here is the route code.
import React, { Suspense, lazy } from "react";
import…
zeshan ahmad
- 45
- 1
- 4
1
vote
1 answer
Isn't the "new fetch pattern" turning things into the same as they were before graphql?
When using graphql, the idea is to ask what you need and only what you need, for a whole page, using a single request. Preventing request "race conditions"(lack of a better term), separate requests asking for the same data like user name.
With…
assisrMatheus
- 445
- 1
- 5
- 17
1
vote
0 answers
Recoil: Any way to find out which selector caused suspense?
I keep having trouble finding out which component in my component tree is causing Suspense fallbacks. There are a lot of asynchronous selectors in my application and often I find my application falling back to a loader but I have no idea which…
omnibrain
- 533
- 2
- 6
- 18
1
vote
1 answer
React Suspense time limit
guys! I am relatively new to the concept of Suspense in React so i apologize if the question answer is obvious but i couldn't manage to find similar question asked before.
So i was wondering how can i set/simulate time limit for Suspense. Assuming i…
Sasho32
- 25
- 4