ReactNext 2024
2024-06-24
Tel Aviv, Israel
[ReactNext 2016, ReactNext 2017, ReactNext 2018, ReactNext 2019, ReactNext 2023, ReactNext 2024, ReactNext 2025, ReactNext 2026]
who it's for
React developers, frontend engineers, UI engineers, library authors, web performance engineers, test engineers, engineering managers
topics
View Transitions API animations; re-render optimization techniques; events as communication pattern; AST-based bundle size reduction; preventing component injection attacks; Core Web Vitals measurement; awaitable dialog promises; lazy loading strategies; SVG optimization techniques; Playwright component testing; form validation in React; fine-grained reactivity and signals
| title | author | length |
|---|---|---|
| Animate All the Things! (With View Transitions API) | Netta Bondy | 27m |
Demonstrates that the View Transitions API actually captures UI state and orchestrates DOM changes without manual keyframes: uses document.startViewTransition… | ||
| Enhancing React Performance: Mastering Re-render Optimization | Tal Moskovich | 13m |
Shows a practical pattern that cuts needless re-renders by giving React the same element instance across updates: isolate state and provider inside a… | ||
| Events As A Communication Pattern | Sagi Liba | 14m |
Claims that React components communicate reliably with browser native custom events instead of extra libraries, implemented as sendEvent & useActOnEvent using… | ||
| The Superpower of ASTs: How We Saved 16% on Our Bundle Size | Omri Lavi | 15m |
A custom Babel plugin walks the codebase AST, finds nested constant objects of strings, inlines just-used values, drops the imports and removes whole files… | ||
| Do not let your React be injected | Ran Bar-Zik | 25m |
Explains that client-side XSS is real: third‑party CDN widgets can inject scripts that phish or deface pages, and React app vectors include… | ||
| Core Web Vitals – Measuring Performance Like a Pro | Ofir Elarat | 15m |
Core Web Vitals become Google’s performance standard in 2020 and focus on user-perceived speed and stability, not raw load time. Key metrics are LCP, INP, CLS… | ||
| Simplifying React Dialogs with Awaitable Promises | Noam Honig | 11m |
Claim: replace open-state plumbing with dialogs that return promises so code reads like if (await dialog("Are you sure?")) {...}. Implements small hooks —… | ||
| Lazy Brilliance | Noam Tahor Shafran, Tom Carpel | 28m |
Claims concrete: keeping old codepaths and feature flags lets a product manager flip core flows off or back on immediately, avoiding developer hotfixes and… | ||
| Evolving JavaScript: Cultivating Genetic Algorithms for Creative Coding | Kevin Maes | 30m |
A hands‑on run through genetic algorithms for creative coding showing concrete tools, results, and failure modes: a canvas + TypeScript + xstate demo evolves… | ||
| Get your SVG in shape | Liri Sokol | 13m |
Shows two working demos: a JS generator that places N points on a circle and emits SVG <line> elements to draw a complete graph (example uses six nodes) via… | ||
| Playwright Component Tests: Are they the Testing-Library killer? | Matan Borenkraout | 32m |
Compares Playwright Component Tests and Testing Library by building a Pokedex app and measuring concrete outcomes: Playwright mounts components in a real… | ||
| JavaScript Minigames | Guy Nesher | 26m |
Demos show building 2048 in React by representing the board as a matrix, adding two random 2s, and implementing the slide + merge logic; a tile‑based… | ||
| Gal Weizman @ ReactNext 24` | Gal Weizman | 29m |
Claims that browser wallets change the threat model: the client holds private keys so theft is irreversible not your keys not your coins. Traditional XSS… | ||
| Re-Form the future. Rethinking Form Validations in React | Evyatar Alush | 25m |
Demonstrates a concrete migration from ad hoc hooks to Vest by building a registration form: writes a separate validation suite using create and enforce, runs… | ||
| A Deep Dive into Fine-Grained Reactivity and the future of Signals | Eliran Eliassy | 27m |
Shows a working vanilla TypeScript implementation of signals: writes createSignal that returns read/set, builds computed and effect with automatic dependency… | ||
| Mastering React Component Library Optimization | Asaf Shochet Avida | 28m |
A 40+ component React library shrinks from ~430KB to ~160KB by three concrete moves: switch to ES modules so the bundler can tree-shake, stop importing whole… | ||
| Conquering Concurrent React | Ariel Shulman | 28m |
React 18 hands control of rendering to a scheduler so updates can be split, deprioritized or aborted instead of blocking the UI; the implementation uses the… | ||
| Where the future is heading for JS Frameworks… | Yoav Abrahami | 28m |
Traces 30 years of web history and makes concrete claims: Signals reduce rerenders so components run once, Qwik streams tiny JS pieces and resumes on the… | ||
| Responsive Design vs. Adaptive Design | Adi Achituve | 15m |
Compares practical responsive techniques (flex, grid, relative units, image cover) with adaptive rules (media queries, named breakpoints) and shows when each… | ||
| Losing your Components’ Head | Gil Fink | 17m |
Claim: separate behavior from rendering so UI adapts without refactoring. Shows a working React demo that implements a tabs system with a context controller… | ||
| Towards a simpler JavaScript ecosystem | Gil Tayar | 34m |
Argues that development can drop heavy bundlers and transpilation by using import maps, browser ESM, on‑the‑fly CDNs (esmDosh), JSDoc type checking and 103… | ||
| React Query Under the Hood | Evyatar Daud | 25m |
Builds a tiny React Query clone in vanilla JS and React hooks, wiring a createQuery/client that holds a global map of query instances so references survive… | ||
| ReactNext 2024 Highlights | 02m | |
Short report from the event: a booth nets about 500 leads that the uploader calls “very professional,” with attendees ranging startups to enterprise and… | ||
| nothing matches | ||