redux-toolkit icon indicating copy to clipboard operation
redux-toolkit copied to clipboard

Server side rendering with getRunningOperationPromises

Open JulienKode opened this issue 2 years ago • 4 comments

Hi

I've try to take a look at the ssr-experiment exemple here:

  • https://github.com/JulienKode/ssr-experiments/pull/new/chore/demo
  • https://codesandbox.io/s/naughty-robinson-47e9jt?file=/package.json

I've:

  • added console log on getRunningOperationPromises
  • Create a fake long query (10s)
  • try to fetch with few seconds of delay the two pages:
    • http://localhost:3000/pokemon/ssr/bulbasaur
    • http://localhost:3000/pokemon/ssr/beedrill

On the beedrill fetch this is what I can see when displaying running promises:

{
"getPokemonByName(\"beedrill\")": {
  "arg": "beedrill",
  "requestId": "070QxaL_aSi7MV3VbQzDQ",
  "queryCacheKey": "getPokemonByName(\"beedrill\")"
},
"getPokemonByName(\"bulbasaur\")": {
  "arg": "bulbasaur",
  "requestId": "FdsRw3PmBbDP5sR7-kKPe",
  "queryCacheKey": "getPokemonByName(\"bulbasaur\")"
}
}
  • Is it normal that we are waiting for bulbasaur when our page are just concern about beedrill ?
  • Should the runningPromises created in the api be unique to each page and not sharing across different page ? otherwise on large scale apps this could be an issue if we are waiting for the queries of another page
  • Does the runningPromises should be isolated to each page on SSR ?
  • like createListenerMiddleware should we have a createApiMiddleware ? Then on server side, we can have a different middleware instance for each page that does not share values

This is the debug line that I've added in redux:

  function getRunningOperationPromises() {
    console.warn("[DEBUG] RUNNING OPERATION PROMISES ", {runningQueries})
    console.warn(JSON.stringify(runningQueries, null, 2))

@phryneas @markerikson

JulienKode avatar Jul 01 '22 07:07 JulienKode

Good observation - this should be scoped per store instance. Could be difficult though as it is outside of a middleware :thinking:

phryneas avatar Jul 01 '22 15:07 phryneas

Could you give some feedback over in #2481 please?

phryneas avatar Jul 02 '22 21:07 phryneas

@phryneas Thank you for taking care of it so quickly

JulienKode avatar Jul 04 '22 08:07 JulienKode

This will still take some time until it makes in - we'll have to carefully weigh if and how we can break the existing implementation - since the new one would have to be dispatched. I know the old api was just plain wrong, but we'll have to discuss this quite a lot.

You can isntall the PR-patched package from the CodeSandbox registry in the meantime though.

phryneas avatar Jul 04 '22 08:07 phryneas

Marking this as done because it's in 1.9 beta.

markerikson avatar Oct 26 '22 03:10 markerikson

Thank you @markerikson @phryneas

JulienKode avatar Oct 31 '22 15:10 JulienKode