#315 — November 23, 2022
Improving React Interaction Times by 4x — This is about as practical and real world as it gets. Causal’s engineers noticed some sluggish UI interactions in their React app (as many of us do) and were determined to get to the cause of the problem. They did it. They survived. This is the full story.
Causal Engineers
🦕 Building Apps in Deno with Frameworks.. like React — Deno, perhaps best known as the server-side JS runtime that isn’t Node, had a big release last week adding first-class npm package support. This opens up a lot of opportunities for more easily using Deno to create, say, React, Express or Vue apps, and this post shows off how. Here’s the React bit. It really is simple – well worth checking out.
Andy Jiang (Deno)
Four Ways to Style KendoReact Components — Whether just swapping out the primary color to closely reflect your brand or completely re-skinning the whole library with a custom design, KendoReact makes it easy to change the look and feel of our components with four different ways to style and theme.
Progress KendoReact sponsor
Data Structures in Frontend React Apps in the Real World — Do you need to know your trees from your maps, linked lists, or queues to work with React? You almost certainly are, even if you’re not thinking about it, and Johannes shows off some React-themed examples of several such structures here.
Johannes Kettmann
IN BRIEF:
This year’s State of JS survey is now open to take.
The never dull Theo goes straight for the jugular with ▶️ RIP React Router? This is less about React Router itself and more about why he loves Tanstack Router so much.
Dan Abramov announced the release of a few new beta docs pages, namely for createRef, PureComponent, and useDebugValue.
AWS Amplify Hosting
now supports Next.js 12 and 13.
The Beginner’s Guide to React Testing — Know you should be writing React tests but don’t know where to start? Then this quick seven part (don’t worry – they’re all bitesize) guide is for you.
Max Rozen beginner
▶ How to Build a ‘Friendsgiving’ App with AWS Amplify Studio — Friendsgiving (as an alternative to the traditional family Thanksgiving) has been around for a couple of years now. Isn’t it time there was an app for that?
Ali Spittel
How To Build React Components for Any Frontend
Courier.com sponsor
How React Native Became Performant as Native with the ‘New Architecture’ — A peak under the hood and an explanation of React Native’s new architecture.
Taha Ouarrak
Fetching and Caching Supabase Data in Next.js 13 Server Components
Jon Meyers (Supabase)
🛠 Code and Tools
Ant Design 5.0: Enterprise-Class Design Language and React UI Library — New components, a calmer more modern styling, and improved dynamic theming options are now in this popular, mature UI suite. Already an Ant user? There’s a v4 to v5 migration guide. – Official homepage.
Ant Design Team
TwClassed: Type-Safe Library for Reusable Tailwind Components — If you’d like to build components using Tailwind CSS and have them be type-safe, this is for you. Happy with vanilla JS or in React (via a wrapper). This post explains why the author created it. GitHub repo.
Sanna Jammeh
Build Custom Automations 10x Faster with Retool Workflows
Retool sponsor
Grommet: Responsive, Accessible Mobile-First Components for React — A framework that provides accessibility, modularity, responsiveness, and theming in a tidy package. Has quite a big, bold and padded look to it.
Grommet Project
Accessible Drag and Drop in React Aria and React Spectrum — Introducing React Aria’s new drag and drop hooks that have full keyboard and screen reader parity. Not an easy thing to pull off.
Devon Govett (Adobe)
Clapy: Figma Plugin to Generate React Components from Figma Designs
Clapy
react-native-quick-crypto — A fast implementation of Node’s Crypto module written in C/C++ JSI.
Margelo GmbH
Gatsby 5.1
↳ Dynamic sites with static-site speed.
tRPC 10.1
↳ End-to-end typesafe APIs made easy.
use-resize-observer 9.1
↳ Use a ResizeObserver to measure an element’s size.
Viselect 3.2
↳ Visual DOM element selection library. (Demo.)
Jotai 1.10
↳ Minimal, flexible state management for React.
React PDF 6.2
↳ Easily display PDFs in your React app.
Jobs
UX Engineer — Stimulus is a social platform started by Sticker Mule to show what’s possible if your mission is to increase human happiness. Join our engineering team.
Stimulus
Senior Frontend Engineer (EU Remote or Relocate to Berlin) — We’ve built a product thousands of people love (see Trustpilot if you don’t believe us). We need your help with React & TypeScript.
Feather
Find React Jobs with Hired — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It’s free for job-seekers.
Hired