How to prevent loading.js from returning 200 on unknown routes while keeping loading states?
Answered
Oak apple gall wasp posted this in #help-forum
Oak apple gall waspOP
Hey,
I know that adding a loading.js file makes a Next.js app streamed — it returns a 200 response even for unknown routes, since the server first serves the loading screen with a 200 header.
I want to disable this behavior but still keep a loading state for better UX.
What’s the best solution for this, considering I’m also using a dynamic [locale] route for i18n around the whole app?
I know that adding a loading.js file makes a Next.js app streamed — it returns a 200 response even for unknown routes, since the server first serves the loading screen with a 200 header.
I want to disable this behavior but still keep a loading state for better UX.
What’s the best solution for this, considering I’m also using a dynamic [locale] route for i18n around the whole app?
Answered by alfonsüs ardani
I want to disable this behavior but still keep a loading state for better UX.the better UX is imo to not use loading.js at all and rely on caching to give you instant result.
or handle loading in the clientside. the entire idea of loading.js is to assume that the route you're accessing will always be OK from the server.
you can't give respond to the user if its a 404, its just semantically weird. you may just need to move the loading.js routes down one level instead of putting it in the root app folder..
3 Replies
I want to disable this behavior but still keep a loading state for better UX.the better UX is imo to not use loading.js at all and rely on caching to give you instant result.
or handle loading in the clientside. the entire idea of loading.js is to assume that the route you're accessing will always be OK from the server.
you can't give respond to the user if its a 404, its just semantically weird. you may just need to move the loading.js routes down one level instead of putting it in the root app folder..
Answer
Oak apple gall waspOP
Yeah, makes sense. Caching everything is not really optimal. But handling loading in client is good solution.
My idea was that yes, if there is no route then no loading appears but if route exist we stream loading while the data is being collected. But probably this can be achieved by using suspense in specific page places
My idea was that yes, if there is no route then no loading appears but if route exist we stream loading while the data is being collected. But probably this can be achieved by using suspense in specific page places
Or look into useLinkStatus if u want to show loading ui after user interaction but not direct access