revalidateOnMount flag that disable automatic revalidation on mount

[ciak0]

Hi there,
we're currently using useSWR but we have found conditional revalidation a bit limiting.

For example we have some occurences where we want to trigger revalidation only after a certain action is being taken (could be a button click).
With current conditional revalidation techniques we are forced to use an additional state just to prevent first validation on mount.

This PR aims to add a simple autoLoad (or whatever other name) flag in the options so that automatic revalidation on mount can be prevented and we can simply trigger it directly in a callback (for example a button onClick).

Best,
Gabriele

[sergiodxa]

Could I propose rename from autoLoad to revalidateInitialData?

[ciak0]

Ok, will do it!

[ciak0]

Could I propose rename from autoLoad to revalidateInitialData?

Just pushed option with new name and updated documentation README that I previously forgot.
Let me know what you think about it @sergiodxa @quietshu!

Cheers

[sergiodxa]

Based on the test case, should this flag prevent SWR to revalidate the data provided as initialData only or also preven the revalidation if there is an already cached value for the given key?

If it's the last, then ignore my comments in the code and I would propose to use revalidateOnMount as name to describe better what this does.

[ciak0]

Uhmm...yes the purpose is to avoid revalidate on mount, ignoring initialData, so I guess the latter name is better. Regarding behavior: if the flag is set to false I expect that revalidate doesn't occur at all so that condition is probably an "or". I'll double check tomorrow! Cheers Il giorno mar 28 gen 2020 alle 22:57 Sergio Xalambrí < notifications@github.com> ha scritto:

…

***@***.**** commented on this pull request. Based on the test case, should this flag prevent SWR to revalidate the data provided as initialData only or also preven the revalidation if there is an already cached value for the given key? If it's the last, then ignore my comments in the code and I would propose to use revalidateOnMount as name to describe better what this does. ------------------------------ In README.md <#225 (comment)>: > @@ -109,6 +109,7 @@ const { data, error, isValidating, revalidate } = useSWR(key, fetcher, options) - `suspense = false`: enable React Suspense mode [(details)](#suspense-mode) - `fetcher = undefined`: the default fetcher function - `initialData`: initial data to be returned (note: This is per-hook) +- `revalidateInitialData = true`: automatically revalidate when component is mounted ⬇️ Suggested change -- `revalidateInitialData = true`: automatically revalidate when component is mounted +- `revalidateInitialData = true`: automatically revalidate when component is mounted (if `initialData` is provided) ------------------------------ In src/use-swr.ts <#225 (comment)>: > @@ -394,7 +394,7 @@ function useSWR<Data = any, Error = any>( const softRevalidate = () => revalidate({ dedupe: true }) // trigger a revalidation - if (!config.initialData) { + if (!config.initialData && config.revalidateInitialData) { Shouldn't this be or? ⬇️ Suggested change - if (!config.initialData && config.revalidateInitialData) { + if (!config.initialData || config.revalidateInitialData) { If there is not initial data or want to revalidate the initial data, then trigger a revalidation — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#225>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ACXXQR2GRRHSRL7TL4M2AHLRACS5HANCNFSM4KFKDMSQ> .

[ciak0]

@sergiodxa @quietshu sorry for the delay, just updated PR with suggested hints and made it more clear. Let me know if you think is good or you have any other comment!

Best,
Gabriele

[ciak0]

@shuding @pacocoursey @Timer any news? do I have to do something else?

[sergiodxa]

@shuding is there something else @ciak0 needs to do to merge this?

[shuding]

@sergiodxa @ciak0 sorry for the delay!

The code looks good to me. Just one small request: let’s remove the example from the README for now (but keep the config description). I think it’s a great opportunity to create a helper hook on top of it:

{ mutate } = useMutation(key, fetcher)

// equivalent to 
useSWR(key, fetcher, {
  revalidateOnMount: false,
  revalidateOnFocus: false,
  revalidateOnConnect: false,
  // ...also disable error retry and interval
})

What do you think?

[shuding]

...although there’re some other things we need to figure out for useMutation, but that’s another topic.

Anyway, I think generally it’s great for useSWR to have a lot of options and be very customizable, but it’s better to not expose them directly to the users and have some helper abstractions. An example is $.post ⊂ $.ajax.

[sergiodxa]

👍 I think it makes sense, I was thinking that this would allow us to have a useSWRLazy which will only trigger the fetch after you run mutate, but could still read from cache if it was already cached.

[ciak0]

Yeah great, makes sense! I'll do it asap :) Cheers, Gab Il giorno sab 9 mag 2020 alle 01:20 Sergio Xalambrí < notifications@github.com> ha scritto:

…

👍 I think it makes sense, I was thinking that this would allow us to have a useSWRLazy which will only trigger the fetch after you run mutate, but could still read from cache if it was already cached. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#225 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ACXXQR423WBJ2TLO4XXX4ZTRQSHSXANCNFSM4KFKDMSQ> .

[sergiodxa]

@shuding I think this is ready to merge?

[shuding]

Thank you for your awesome work!

[ciak0]

Thank you guys for this great library. I've been using it intensively since day 1! Glad to help. Il giorno mar 12 mag 2020 alle 05:26 Shu Ding <notifications@github.com> ha scritto:

…

Merged #225 <#225> into master. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#225 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ACXXQR6SZVY5IRKAT43UDA3RRC6VFANCNFSM4KFKDMSQ> .

[j-xzy]

revalidateOnMount set false, will prevent subsequent conditional fetching. @ciak0
I think "OnMount" is't a good name @sergiodxa