Articles for the React tag – Page 2
-
Broad Infinite List: Scrolling in Both Directions Without Losing Your Mind
Most infinite scroll libraries only go one way. Broad Infinite List goes both, handling chat history, live feeds, and streaming logs with zero layout shifts and zero height configuration. It weighs in at about 2KB gzipped and works across React, React Native, and Vue.
-
react-scroll-into-view: The One-Component Scroll Whisperer
Sometimes all you need is a button that scrolls the page somewhere else. No scroll spy, no active states, no custom scroll math. Just click, scroll, done.
-
React Lite YouTube Embed: Put Your YouTube Embeds on a 500KB Diet
Every YouTube embed you drop into a page loads over 500KB of scripts, stylesheets, and tracking before the user even thinks about pressing play. React Lite YouTube Embed fixes that by showing a static thumbnail first and only loading the real iframe on click.
-
focus-trap: The Accessibility Bouncer Your Modals Deserve
Every time a user opens a modal and Tab sends them behind the curtain into the void of the background page, an accessibility angel loses its wings. focus-trap is the decade-old, battle-hardened utility that keeps keyboard focus exactly where it belongs.
-
DayFlow: A Featherweight Calendar That Punches Above Its Weight
Building a scheduling UI from scratch is the kind of project that starts with optimism and ends with date math nightmares. DayFlow hands you a polished, Google Calendar-style component out of the box, backed by a plugin system that keeps the core impossibly small.
-
Dockview: Build VS Code-Style Layouts Without Breaking a Sweat
Ever wondered how VS Code pulls off that slick panel-docking experience? Dockview brings the same IDE-grade layout system to your own apps, complete with drag-and-drop tabs, floating panels, and popout windows. Zero dependencies, full TypeScript support, and it works with React, Vue, Angular, or plain vanilla.
-
eslint-plugin-react-you-might-not-need-an-effect: The React Docs Page That Learned to Read Your Code
Every React developer has read that famous docs page: You Might Not Need an Effect. But reading and remembering are two different things. This ESLint plugin turns those guidelines into automated, enforceable lint rules that catch unnecessary effects before they cause extra re-renders and tangled logic.
-
React SCAD: Print Your Components (Literally, on a 3D Printer)
What if you could build 3D models the same way you build UIs -- with components, props, and JSX? React SCAD takes the React reconciler into uncharted territory, turning your component tree into OpenSCAD files you can slice and 3D print.
-
TanStack Hotkeys: The Keyboard Shortcut Library That Types Back
Keyboard shortcuts are one of those features that separate a polished app from a prototype. TanStack Hotkeys enters the ring with something no other shortcut library offers: full TypeScript autocomplete for every valid key combination, plus a toolkit of utilities that makes building professional-grade keyboard interactions surprisingly painless.
-
Downshift: The Headless Hero Your Dropdowns Deserve
Building accessible dropdown components from scratch is notoriously tricky. Downshift takes care of keyboard navigation, screen reader support, and state management while leaving every pixel of rendering in your hands.