#​377 — March 13, 2024

Read on the Web

Together with  Sentry logo
React Status

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 the audio to play.

Kristian Dupont

Making React Debugging FunJoin 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).

Sentry sponsor

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.

Michael Shilman (Storybook)

IN BRIEF:

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.

Alex Khomenko

▶  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.

Colby Fayock

🛠  Code, Tools & Libraries

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.

Matt Litherland

⌘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.

Paco Coursey

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.

Kevin Van Cott