#How to ensure that my fetch requests are memorized? Can I get information in my browser network tab?

5 messages · Page 1 of 1 (latest)

blissful kestrel
#

In my root layout and page I have the same two lines of code:

const res = await fetch('https://jsonplaceholder.typicode.com/posts');
const posts = await res.json();

Where to find these fetch requests in my browser network tab and see, how long it took to evaluate each one of the two fetches (1 in layout.tsx, 1 in page.tsx).
I tried to click every value in 'Name' column and still haven't found these fetch requests.

Now I kinda realized that maybe I can't get any info from my browser, because these requests run on nextjs server and hence they're not exposed to my browser.
Is there any way to get some info on these fetch requests from nextjs server? What should I do?

The reason I'm asking is: on my another project I use supabase js client and I'm not sure that these supabase calls are memorized (idk what type of fetch my supabase client uses), I wanna check somehow that my supabase js client calls are really memorized.

rare tundraBOT
#

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

fleet tapir
#

As you realized yourself server-side requests cannot appear in the network tab of the browser. Regarding request memoization I typically apply the following logic: if I'm not explicitly using fetch myself, I'm not making assumptions of the underlying implementation details of the library I use and thus wrap it manually using cache to begin with.

#

Makes reasoning much easier since you never know when the implementation might change.