~reactstatus | Issue 377 - Listen to React performance issues (8)

React Geiger: A Way to Hear React Performance Issues — The output is hardly a mellifluous three voice fugue, but Geiger provides an interesting way to make React performance audible by making clicking sounds (akin to a Geiger counter) when things take longer to run than you desire. There’s a live demo but note you may need to refresh or give extra permission for...

Making React Debugging Fun — Join Sentry Launch Week live. We’ll be announcing new error and performance monitoring improvements, showing exclusive demos, raffling swag and talking about all things developer and React, every. single. day. (For one week).

Storybook 8 Released with RSC Support — The popular front-end component workshop introduces built-in visual testing, support for React Server Components, up to 50% faster start times, and upgraded Vue and React control auto-generation. There’s also ▶️ a launch video to enjoy.

Best Practices for Writing Tests with React Testing Library — Covers common mistakes made when using React Testing Library, along with topics like using specific queries to improve test coverage.

▶  Supercharging Your Next.js App with Cloudinary Images and Video — Cloudinary is a paid service (we use it for our newsletter images!) but there’s enough code-wise here to keep it useful and interesting.

Onborda: An Onboarding / Product Tour Approach for Next.js — There are a few general React options in this space (such as React Joyride and React Shepherd) but Onboarda is more Next.js specific and uses Framer Motion to bring smooth animations to the experience. Try the live demo to see how it feels.

⌘K 1.0: A Fast, Composable, Unstyled 'Command Menu' Control — The home page includes some neat examples in a variety of styles. GitHub repo. Not to be confused with the similarly named react-cmdk.

Mantine React Table: A Mantine Implementation of TanStack React Table — Actually a fork of Material React Table, so it’s already a mature option but built specifically for projects using the Mantine component library and Emotion for styling.