React: Guides and Practical Know-how | Page 13 | mironsoft Blog
React
-
Apr 27, 2025
Mutable state is the most common source of hard-to-find bugs in JavaScript applications. Immutability patterns make state changes explicit, enable change detection through reference comparison, and prevent shared state from being modified in unexpected places, from Object.freeze all the way to Records and Tuples.
-
Apr 18, 2025
shadcn/ui is not a library in the classic sense, it is a catalog of copy-paste components built on Radix UI. Anyone who understands the copy-paste model can build a fully controllable, themeable component library for their own design system on top of it.
-
Apr 12, 2025
A CSS refactor can leave a component functionally unchanged and still silently break the layout. Unit and component tests check behavior, not appearance. Visual regression testing closes exactly this gap by comparing screenshots against a baseline, surfacing every pixel deviation before it reaches production.
-
Apr 9, 2025
Bringing TypeScript in React to the right level means more than typing props with interfaces. The satisfies operator, Template Literal Types, generics in components and discriminated unions enable props APIs that are impossible to misuse at runtime, because TypeScript flags every error while you write the code.
-
Apr 4, 2025
Tests that check implementation details break with every refactor. React Testing Library enforces tests from the user's perspective, with getByRole instead of getByTestId, userEvent instead of fireEvent, and MSW instead of fetch mocks.
-
Apr 1, 2025
An image that loads after the rest of the layout has settled pushes visible content around and hurts the Cumulative Layout Shift score. React Suspense lets you deliberately hold back rendering an image component until the file is actually sitting in the browser cache. This article shows a custom preload pattern built on promise wrapping, including caching, error handling, and the limits of the approach.
-
Mar 27, 2025
The React error boundary interface internally works with the type unknown for caught errors, which often forces fallback components to fall back on any or unsafe casts. With generic type parameters and discriminated error types, error boundaries can be built that hand the caller concrete, typed error information.
-
Mar 24, 2025
Skeleton screens and spinners solve the same technical problem, bridging the gap between a user action and visible content, but they differ sharply in how they affect perceived wait time. This article compares both approaches, shows when each one is the better fit, and walks through implementing content-aware skeletons as React Suspense fallbacks.
-
Mar 23, 2025
Jest was the standard for React tests for years, with a slow start, cumbersome transformer configuration, and growing incompatibilities with ESM. Vitest shares Vite's configuration and transformer, starts in milliseconds, offers a Jest-compatible API, and integrates seamlessly into Vite-based React projects.
-
Mar 19, 2025
A page query that lists every field for ten components in one block turns into a merge conflict magnet with every change. GraphQL fragments break queries into named, reusable building blocks that live right next to the component consuming them, solving maintainability problems that become unavoidable as an application grows.