Chapter 9 loading.tsx and <Suspense /> not working

[maxmax1992]

After carefully following the steps of the tutorial I'm facing 2 issues regarding the "Loading" states:
(only thing I'm doing different in this course is using bun instead of npx)
The code files at this exact failure incase you want to see the code: https://github.com/maxmax1992/dashboard_nextjs_demo/tree/8462322da99822e3e458480c6c95a3a5f4123070

1. Initial load loads the page only after 3 second delay, without giving me the placeholder loading state (image below). So when I refresh the page I'm not getting the skeleton/loading screen. it just lags until the whole page loads.

2. After adding objects it's not render them separately instead all components wait RevenueChart to render and then they're displayed.

How to reproduce: See the video for comprehensive overview of my code and the unexpected behavior:

9e0df72c-92bb-40f3-9ff2-bffef72627c5_restream.mp4

This reddit post might be related:
https://www.reddit.com/r/nextjs/comments/1cq97wn/just_start_learning_nextjs_but_suspense_does_not/

[maxmax1992]

Issue seems to be in the Firefox Developer Edition, after testing with Arc it works as expected. 🤔 Seems like a compatibility issue?