Component and UI implementation
Building reusable React components, stateful UI patterns, loading states, accessibility, forms, tabs, animations, shadcn/ui, React Aria, and skeleton generation.
34%
Best tweets about React
50 Best Tweets About React (2026)
Explore the best tweets about React, including components, hooks, Server Components, performance, state, architecture, releases, and production lessons.
React JavaScript framework patterns, components, hooks, rendering, performance, architecture, releases, debugging, and real application experience.
- Creators
- 41
- Updated
Original Xholic analysis
What 50 top React posts reveal
React discussion spans component implementation, rendering performance, ecosystem tooling, React Native, and application architecture. Component and UI implementation is the largest theme (34%, 17 tweets); performance and rendering optimization represents 28% (14 tweets) and has a 38.87 median all-time score. Media appears in 78% of posts and has a 37.847 median all-time score, versus 10.962 for text-only posts.
- Dominant tone
- Positive
- Median score
- 25.0
- Leading format
- Other
- Recent posts
- 22%
70% of posts
All-time engagement
100% of posts
Published in 90 days
Conversation map
The themes creators return to
Performance and rendering optimization
Re-renders, memoization and React Compiler, profiling, SSR benchmarks, hydration, memory leaks, streaming UI, and reducing client-side work.
28%
React ecosystem tools and integrations
Libraries and platforms for node editors, rich text, video generation, WebGPU and Three.js rendering, desktop UI, and generative UI.
28%
Debugging, profiling, and testing
Performance diagnostics, React DevTools alternatives, agent-assisted inspection, StrictMode behavior, E2E testing, and production regressions.
22%
React Native and Expo development
Mobile apps with Expo, native-state and UI-thread performance, React Navigation, gestures, cross-platform styling, devtools, and the New Architecture.
22%
Application architecture and state
State placement, local versus server state, stores, framework migrations, production React frameworks, and deployment architecture.
18%
Server rendering and data fetching
React Server Components, avoiding fetch waterfalls, server functions, async state, streaming data, and client/server rendering boundaries.
14%
React internals and developer education
Virtual DOM, reconciliation, JSX compilation, hook internals, rendering-model fundamentals, tutorials, and interview-oriented React knowledge.
8%
Tone and stance
Sentiment Positive leads
Author posture Supportive leads
Performance benchmark
- Median likes
- 99
- Median reposts
- 7
- Median replies
- 5
- Median views
- 9.6K
Posts with media make up 78% of this collection. Their median all-time score is 37.8, compared with 11.0 for text-only posts.
Format mix
- Other 100% · score 25.0
Consensus and debate
Where creators agree, and where they do not
Shared view
Measure and reduce unnecessary rendering
Posts focus on avoidable re-renders: react-scan was used to identify unnecessary re-renders in a sluggish filter UI, and another post advises against subscribing to data that is used only in event handlers.
Shared view
Reduce client-side work where appropriate
One React Native implementation moves markdown parsing to the server, streams a JSON tree and patches to the client, and then renders custom components from that tree. A separate Server Components post focuses on avoiding data-fetching waterfalls.
Shared view
Component requirements commonly include resilient and accessible states
A UI-component prompt calls for loading, error, empty, responsive, and accessible states. The React View Transitions skill also explicitly lists composition and accessibility handling.
Open debate
React Server Components show both adoption friction and implementation guidance
A State of React survey post says RSC usage rose from 40% to 45% over the prior year, with fewer than half of React developers having tried it; another post explicitly asks whether RSC were a mistake. At the same time, a separate post offers advice on avoiding Server Component data-fetching waterfalls.
Open debate
Memoization guidance ranges from compiler automation to deliberate profiling
A React Compiler v1.0 post says the compiler analyzes code at build time and adds needed memoization. Separately, React performance guidance highlights memoization tradeoffs and recommends profiling before optimization.
Open debate
Framework benchmarks need comparable configuration
A React SSR benchmark was rerun after readers found compression had been applied inconsistently. The post says compression was then disabled everywhere before corrected results were published.
What performs
Patterns behind standout posts
Performance is an above-median engagement theme
Performance and rendering optimization accounts for 28% of the conversation (14 tweets) and has a 38.87 median all-time score, above the overall median of 24.98.
Two visual-implementation posts were engagement outliers
The React View Transitions post scored 644.7 and the motion/react useSpring interaction scored 545.86. Both appear in the supplied engagement-outlier list.
A DOM-aware debugging workflow was the largest outlier
The Claude Code desktop workflow post was the largest supplied outlier, with an all-time score of 1671.19, equal to 66.9 times the overall median score.
Media posts have the higher median score in this set
Posts with media represent 78% of the set and have a 37.847 median all-time score, compared with 10.962 for text-only posts.
Statistical standouts
- View standout post 1 Score 1671.2 · 66.9× median
- View standout post 2 Score 644.7 · 25.81× median
- View standout post 3 Score 545.9 · 21.85× median
- View standout post 4 Score 390.1 · 15.62× median
- View standout post 5 Score 369.7 · 14.8× median
Creator landscape
Who shapes this conversation
The five most represented creators account for 20% of the selected posts.
-
1. George Moller
@_georgemoller
2 posts
-
2. Beto
@betomoedano
2 posts
-
3. Fernando Rojo
@fernandorojo
2 posts
-
4. freeCodeCamp.org
@freeCodeCamp
2 posts
-
5. GitHub Projects Community
@GithubProjects
2 posts
-
6. Joe Sluis
@jyobo10
2 posts
Two repeat creators have the highest listed creator medians
Among the listed top voices, Beto has a 214.33 median all-time score across two tweets and Joe Sluis has a 196.15 median across two tweets. Beto’s posts cover an Expo habit-tracker build and React Native input performance, while Joe Sluis’s posts cover a React-from-scratch article and a React-clone examples site.
Repeat creators address multiple React development areas
George Moller’s two cited posts address Server Component waterfalls and React Compiler memoization. Fernando Rojo’s address reducing React Native client work and a cross-platform Tailwind approach.
The sample is spread across many creators
The set contains 50 tweets from 41 creators. The supplied top-five placement share is 20%, indicating that placements are not concentrated solely among the five leading creators.
Since the previous snapshot
What changed since Aug 12, 2026
- 60% of the selected posts remained.
- The creator count changed by -2.
- The leading sentiment remained stable.
How this analysis was made
Themes, sentiment, stance, and post format are classified per tweet. All counts, shares, medians, creator concentration, freshness, and performance comparisons are then calculated directly from the published snapshot.
Xholic's all-time score compares engagement while accounting for reach, post age, and creator consistency. It is used for relative comparisons within this collection.
This report analyzes the exact 50-post snapshot shown below. AI identifies editorial categories and drafts explanations; all statistics are calculated from the snapshot, and every narrative claim is checked against cited posts before publication.
Best React tweets
Top React tweets from 41 creators
Ranked 01–50
- 01
@lydiahallie ·
Claude Code on desktop lets you select DOM elements directly, much easier than describing which component you want updated! Claude gets the tag, classes, key styles, surrounding HTML, and a cropped screenshot. React apps also get the source file, component name and props
Watch video
- 02
@nextjs ·
New agent skill: 𝚛𝚎𝚊𝚌𝚝-𝚟𝚒𝚎𝚠-𝚝𝚛𝚊𝚗𝚜𝚒𝚝𝚒𝚘𝚗𝚜 Add React <𝚅𝚒𝚎𝚠𝚃𝚛𝚊𝚗𝚜𝚒𝚝𝚒𝚘𝚗> animations to any React app. Also covers how Next.js can natively integrate them. • Animate elements across navigations • Slide pages forward and back • Smooth loading transitions • Composition and accessibility handled
Watch video
- 03
@emilkowalski ·
Interaction for Linear’s homepage using motion/react’s `useSpring`, quite fun to play with
Watch video
- 04
@jyobo10 ·
I rebuilt React from scratch to understand what it’s actually doing under the hood. I wrote an article about it that walks through: • the virtual DOM • a diffing/reconciliation algorithm • how hooks like useEffect work internally • how JSX compiles into JavaScript If you're a React dev or interested in framework internals, you might enjoy it.
- 05
@steventey ·
react-scan by @aidenybai is truly a gamechanger for debugging frontend perf issues. case in point: @dubdotco's filter UI has been "feeling" sluggish, so I set up react-scan and poof – it found the exact root cause (unnecessary rerenders). filters should feel much quicker now!
Watch video
- 06
@betomoedano ·
Claude Fable 5 absolutely cooked 😮 I asked it to build a habit tracker with Expo, using the Code with Beto MCP server. It shipped: – zoom transitions – sortable habit list – app icon (Code with Beto Skill) – home screen widget with a heatmap – onboarding, haptics, animations, dark mode – notification actions (mark a habit done without opening the app) 100% React Native 👇
Watch video
- 07
- 08
@KanikaBK ·
🚨 JUST IN: SOMEONE JUST BUILT A FREE TOOL that lets you DESIGN YOUR DREAM HOME. In 3D. IN YOUR BROWSER. It designs buildings. Generates geometry. Handles walls, floors, ceilings, roofs. All by itself. All in real time. It's called Pascal Editor. You give it a wall. It calculates the mitering, cuts out the doors and windows, and generates the geometry automatically. You come back and there's a finished 3D building waiting. Not a render. Not a mockup. The actual thing. Not a CAD tool. Not a BIM software. A fully stateful 3D building editor that runs in your browser with WebGPU. Here's what it does on its own: → Spawns geometry systems in parallel, each handling a different node type. Walls, slabs, ceilings, roofs all updating simultaneously → Writes real geometry, runs CSG boolean operations, cuts door and window openings without asking you once → Builds full building hierarchies. Site, building, level, wall, zone, item. Everything connected and queryable → Remembers your entire scene across sessions. Undo and redo with 50 step history. Persisted to IndexedDB automatically → Handles collision detection and placement validation so furniture never clips through walls → Connects tools directly to state. Draw a wall, place a door, create a zone. Everything updates in real time. HERE'S THE WILDEST PART: Pascal Editor hit GitHub and the architecture is genuinely impressive. Turborepo monorepo. React 19 and Next.js 16. Three.js with WebGPU renderer. Zustand for state. The entire scene runs on a dirty node system so only changed geometry ever recomputes. The community is already asking to extend it with custom tools and renderers. 4.2K GitHub stars. 634 forks. Built with React Three Fiber. 100% Open Source. MIT License. 👇
Watch video
- 09
@_georgemoller ·
⚛️ React tip: How to avoid data fetching waterfalls in Server Components ↓
Watch video
- 10
@_georgemoller ·
❌ useMemo, useCallback, memo everywhere ✅ React Compiler handles it automatically React Compiler v1.0 is here. It analyzes your code at build time and adds memoization where needed.↓
Watch video
- 11
- 12
@freeCodeCamp ·
As a developer, you'll need to know how to fetch data from APIs. And in this tutorial, you'll learn how to fetch that data and store and display it in a React app. First you'll get data using the built-in fetch method, then you'll refactor using the popular Axios library. https://t.co/nsaQkaQ6lD
- 13
@fernandorojo ·
I get a lot of questions about how we made markdown parsing fast on the @v0 mobile app. The answer: we do less work on the client. v0 doesn’t parse markdown strings in React Native. Instead, the server parses MDX and streams a JSON tree to the client. During message streaming, the server sends JSON patches for each chunk. The client applies the patch to its local cache using jsondiffpatch. We even modified the jsondiffpatch protocol to send the diff for string fields inside any JSON. Finally, the client recursively loops over the JSON tree and renders custom components for each MDX element.
- 14
@golok727 ·
been building a desktop UI framework, no webview, uses bun, wgpu for rendering, write your UI in react. might open source it soon if i get time, will keep you guys updated :D
Watch video
- 15
@pie6k ·
I've created a utility for debugging React performance. After spending a few hours trying to connect react-devtools with Electron, I decided to write my own from scratch. You can add it to your project with just one line of code - https://t.co/6QbxkQzApS
Watch video
- 16
@ChmalSzymon ·
Introducing Rozenite for Agents 🚀 The agent-facing interface for interacting with React Native DevTools and Rozenite plugins. It enables coding agents to inspect React Native apps - providing access to logs, network activity, React profiling data, and powerful plugin tooling.
Watch video
- 17
@betomoedano ·
📢 new lesson alert! Ever notice your text inputs feel laggy in React Native? New in Expo SDK 56: useNativeState lets the native side own the state. No round trip on every keypress. Then pair it with React Native Worklets to run validation and formatting straight on the UI thread. Smooth, native-feeling inputs. No jank. Full lesson is live 👇
- 18
@fernandorojo ·
A new approach to cross-platform Tailwind I've been using: → create a custom View with constrained props → <div /> with a style reset on web → <View /> in view.native.tsx Web uses plain Tailwind, native uses Uniwind. It's a mini react-native-web alternative which you own.
- 19
@ImSh4yy ·
I'm getting close to a year running TanStack Start in production. I have two apps on Cloudflare Workers, they are completely stateless and talk to the backend API via tRPC. I'm not using any of the proprietary features of Workers, just have their Vite plugin to serve the Start app. Everything else is containerized and deployed to Swarm. It's been a great experience so far, and I can't recommend it enough. If you're starting a new project, or looking to migrate your current one to a different React framework, I highly recommend giving it a try.
- 20
- 21
@GithubProjects ·
Liquid DOM is a monorepo for WebGPU-powered liquid-glass rendering and SwiftUI-style layout, with packages for React, Three.js, and React Three Fiber. - Renderer-agnostic layout engine with SwiftUI-style measurement and placement - WebGPU liquid-glass renderer backed by a DOM scene graph - React 19 bindings for declarative glass UI - Three.js and R3F adapters for compositing liquid glass over existing WebGPU scenes
- 22
@reactnavigation ·
If you are building a new app or boilerplate in 2026 and use React Navigation, please use the Static API. We have done a lot of work to reduce boilerplate further and improve TypeSafety in React Navigation 8. Unless you really need to build the list of screens dynamically at runtime, you'll likely find that the Static API can do everything you need. If you remember the Static API from React Navigation 4 and earlier, the new Static API is very different. It's built on the dynamic core that React Navigation 5 brought, so it has a lot of dynamism built-in. The static parts are only constrained by what we need to make type inference and deep linking automatic.
- 23
@GithubProjects ·
xyflow provides node-based UI libraries for React and Svelte that are ready out-of-the-box and infinitely customizable. - `@xyflow/react` and `@xyflow/svelte` packages for building node editors - Includes built-in MiniMap, Controls, and Background components - MIT licensed with commercial sponsorship options via React Flow Pro or GitHub Sponsors - Shared `@xyflow/system` helper library for cross-framework logic
- 24
@mrmagan_ ·
generative UI just went mobile. create funky beats or the app store's next big hit. multi-turn, streaming, fullstack out of the box. tambo now supports react native. demo built with @expo.
Watch video
- 25
- 26
@swmansion ·
Tired of wrapping gestures in useMemo? 🥱 Gesture Handler 3 introduces a hook-based API — the hook manages the native recognizer, which means you don’t need manual memoization. If you’re using React Compiler, it also handles memoization automatically. But with no React Compiler, the hook still takes care of it for you. Learn more 👉 https://t.co/njZveKldO3
Watch video
- 27
@cathrynlavery ·
I built a product demo video with @reactjs and @remotion ~16 seconds. 480 frames. 6 scenes. zero screen recordings & didn't leave the terminal once. T𝗵𝗲 𝘀𝘁𝗮𝗰𝗸: • react 18 + typescript • ~15 custom components • remotion 4.0.429 for video-as-react • 8 voiceover & sounds with @ElevenLabs ngl pretty impressive for a first-timer 😍
Watch video
- 28
@0xlelouch_ ·
90% of React interviews in 2026 come down to these 7 points: 1) Rendering model: what triggers a re-render, why referential equality matters, and how to avoid accidental work. 2) Hooks fundamentals: useEffect dependencies, cleanup, and why derived state is usually a bug (compute it, don’t store it). 3) State management: local vs server state, when Context is enough, and when you need a store for cross-page workflows. 4) Performance: memoization tradeoffs, virtualization for long lists, and profiling before optimizing. 5) Async + data fetching: request cancellation, race conditions, caching, and handling loading/error/retry without UI flicker. 6) Forms and validation: controlled vs uncontrolled inputs, debouncing, schema validation, and keeping UX fast under network latency. 7) Testing + production hygiene: React Testing Library patterns, mocking fetch, and catching regressions like double effects in StrictMode
- 29
@Hartdrawss ·
PRO TIP for FRONTEND DEVS : The component prompt that generates production-ready UI in Cursor every time. Most people prompt: "create a user profile card." Output: no loading state, no error state, no empty state, hardcoded data, no TypeScript. Here's how i prompt instead: --- "Create a UserProfileCard React component. Requirements: - Props: user object (id, name, email, avatarUrl, role, createdAt) — TypeScript interface required - Loading state: skeleton UI using the existing Skeleton component from /components/ui - Error state: error message with retry button, error passed as prop - Empty state: 'No user found' with a clear illustration or icon - Avatar: use Next.js Image component with fallback to initials if avatarUrl is null - Date formatting: 'Member since [Month Year]' — use the existing formatDate util - Responsive: full width on mobile, max-w-sm on desktop - Accessible: proper ARIA labels, keyboard focusable action buttons - No hardcoded data. No inline styles. Use only Tailwind classes from the design system. Export: named export only. No default export."
Watch video
- 30
@hausdorff_space ·
react-prosemirror, like prosemirror core, is a modern marvel of engineering. New blog post talks about all the work react-prosemirror core put in to make it really, really fast. On par with, and maybe faster, than, the pure JS version. Seriously. Here we are editing Moby Dick with no perceptible lag at all:
Watch video
- 31
- 32
@freeCodeCamp ·
Tabs are common in dashboards and settings pages, but small motions can make them feel more polished. In this tutorial, @gupta05_vaibhav shows you how to build an animated tab component with Shadcn/ui, React, Tailwind CSS, and Motion. You'll learn about spring tab indicators, stacked card hover effects, entrance animations, and more. https://t.co/bArjFiJ9Je
- 33
@ctbbpodcast ·
HackerNotes TLDR for episode 168! — https://t.co/HDM9ssvdg8 ►⠀React Router's useParams double URL decodes path parameters, and a case-sensitive regex on the React Source Code of matchPath means %252F (uppercase F) decodes to / while %252f (lowercase f) does not ►⠀Not all frameworks are equal: Vue and React are the most vulnerable to CSPT, Next.js and SvelteKit expose secondary context path traversal on the server side, while SolidStart is largely safe ►⠀Pre-production endpoints may serve uploaded HTML inline instead of as Content-Disposition: attachment, a reliable technique to bypass XSS mitigations on file upload ►⠀fetch() silently strips tab characters (%09), enabling WAF bypasses with payloads like %2F%2e%09%2e%5C
- 34
- 35
@kettanaito ·
Enjoy this introduction into E2E testing from my latest workshop "React End-to-End Testing with Playwright"! 🎉 Let's talk about what E2E testing is, how it has nothing to do with the browser, and what is its true goal.
Watch video
- 36
@DivyanshT91162 ·
Someone got tired of manually building skeleton loaders... so they automated the entire process. Instead of drawing fake placeholder boxes every time your UI changes, Boneyard scans your real components and generates pixel-perfect skeleton screens automatically. No measuring. No tweaking. No keeping loading states in sync by hand. → Extracts skeletons directly from your real UI → Supports React, Vue, Svelte 5, Angular, Preact & React Native → Works seamlessly with Suspense and async data fetching → Vite plugin with automatic HMR re-capturing → Responsive across multiple breakpoints → Zero production overhead → MIT licensed → 100% open source This is one of those developer tools that saves hours of repetitive frontend work while making your loading states look exactly like the final UI. MIT licensed 100% open source Repo👇
- 37
- 38
@orcdev ·
tested Svelte + shadcn-svelte again (new project page) honest take 👇 DX isn't bad… but setup still not as smooth as React from official shadcn page you literally just use one command and that's it, it works with multiple frameworks after setup I wanted to implement https://t.co/OcH61UmmW7 blocks, and managed to do that in only 3 prompts which was really awesome (screenshot) overall Svelte is solid, but React still wins because of two reasons: 1. AI works better with it (for now) 2. entire shadcn ecosystem is supporting React, so we have to burn tokens to rewrite the code thing is that AI is still pretty bad at UI, too many edge cases it misses pre built blocks are still the fastest / cheapest way to ship curious what happens in 6 - 12 months
- 39
- 40
- 41
- 42
- 43
@whiskeywebfm ·
Were React Server Components a mistake? Full episode featuring @shshaw: https://t.co/HeevKoFJKf
Watch video
- 44
@jyobo10 ·
Built a mini examples site for my React clone. The whole site is rendered by my own React implementation and includes hook demos + reconciliation experiments. I made it to validate the behavior of my React implementation but thought it would be cool to share here too.
Watch video
- 45
- 46
@shrutikapoor08 ·
React app feeling slow? I made a video to show you performance fixes that actually work while measuring the performance impact
Watch video
- 47
- 48
@DJbennyBuff ·
I just spent the weekend converting my Framer site into custom code. I'd say it got ~95% parity! My steps: 1. Use the "React Export" Framer plugin (they have a free trial) 2. Download Vercel's agent-browser will all the skills 3. Prompt Claude to recreate the site using the React components in step 1. Repeat until happy :)
- 49
- 50
@ThePracticalDev ·
Every token that arrives triggers a full layout reflow in the DOM. At 50 tokens/second, that's dropped frames and a jittery scrollbar. This dev built ZeroJitter — a React library that renders streaming text to canvas via a Web Worker, with zero reflows and full accessibility support. { author: JAI } https://t.co/lKdNXPdzYj
Best Tweets by Topic