React Server Components

Hot reload is a development feature that injects updated code into a running application without restarting it or losing the current state. In Flutter, hot reload works by injecting updated Dart source code into the running Dart VM, typically completing in under a second. React Native offers a similar feature called Fast Refresh that preserves component state during edits. Both dramatically accelerate the development feedback loop compared to traditional compile-and-restart cycles.

Auto-scaling is the ability of a system to automatically adjust the number of running instances or allocated resources based on current demand. When traffic spikes, new instances are provisioned; when demand drops, excess resources are released to save costs. Cloud platforms like AWS, GCP, and Azure offer auto-scaling groups with configurable policies based on CPU usage, request count, queue depth, or custom metrics.

Code splitting is an optimization technique that breaks a JavaScript bundle into smaller chunks that are loaded on demand, rather than forcing users to download the entire application upfront. In React, this is achieved through `React.lazy()` and dynamic `import()` statements, which create separate bundles loaded only when the corresponding component or route is accessed. This dramatically improves initial load times, especially for large single-page applications with many routes.

Flexbox (Flexible Box Layout) is a one-dimensional CSS layout model designed for distributing space and aligning items within a container along a single axis — either horizontal or vertical. It excels at handling dynamic content sizes, centering elements, and creating flexible navigation bars, card rows, and form layouts. Properties like `justify-content`, `align-items`, and `flex-grow` give you fine-grained control over how items share available space.

CSS Custom Properties (also called CSS Variables) let you define reusable values with `--my-variable` syntax and reference them anywhere using `var(--my-variable)`. Unlike preprocessor variables in Sass or Less, they are live in the browser, cascade through the DOM, and can be updated dynamically with JavaScript. They're essential for theming systems, dark mode implementations, and maintaining consistent design tokens across large stylesheets.

A Higher-Order Component (HOC) is an advanced React pattern where a function takes a component as input and returns a new enhanced component with additional props or behavior. Common use cases include adding authentication checks, analytics tracking, or data fetching logic to existing components. While HOCs were a primary code reuse pattern in class-based React, custom hooks have largely replaced them in modern functional component code due to their simpler composition model.