My Wife left me and my family isn’t talking to me because I had to learn about React Server Components over Christmas in order to create this issue. Worth it? No, not at all.
(joking, I had a lovely Christmas thanks for asking)
Summoning the strength to look back on 2020
One of those things is the birth of this newsletter and the launch of ui.dev earlier this year. Thanks for reading and sharing and helping us get filthy rich off of ads. Wait, crap.
OK enough sappiness, let’s get to the highlights of 2020.
First, our joke of the year. This one came from Bytes #15 - React in the streets, D3 in the sheets.
“Are data visualizations the hottest thing to work on? Not really. But are they important? Also not really.”
Not super funny, but it’s the only joke that had multiple people write emails like this. Apparently Data Viz is Serious Business™.
Next, our favorite releases of the year.
probably definitely tired of reading about at this point.
Sebastian McKenzie (creator of Babel) released Rome — a single toolchain that’s meant to replace Babel, ESLint, Webpack, Prettier, and Jest.
Airbnb released a new data data viz library called visx. This is a fantastic library and have I ever mentioned how Important and Serious and Necessary Data Visualizers are? They should get the vaccine first, IMO.
Vercel made some big moves this year with the release of Next.js 10, SWR (another new data fetching library for React), and a new deployment platform. They also raised $21m back in April and another $40m earlier this month because apparently 2020 is also The Year of the YOLO in the ancient VC calendar.
And yes, GitHub has dark mode now.
2020 Winners: Server lovers, caching lovers, people who love how their face looks on Zoom, Taylor Swift fans (even with “no body, no crime” ruining the album).
2020 Losers: Regis Philbin fans. People who expected React 17 to actually have new features.
Y’all know me, still the same OG. But I been low-key
If you were to have asked me last week, I would have told you React is trending downward. And if you were to have asked me last week, I would have been wrong.
Like Michael Bublé, the React team decided to reclaim their position on the top of the charts over Christmas.
Meet React Server Components. Yes, React on the server.
OMG THEY JUST REINVENTED PHP LOL POGGERS
Stop it. Here’s how I like to think about it. Rendering on the server has benefits - mainly allowing easy access to data sources and quick first paints. Rendering on the client has benefits - mainly interactivity and making apps feel “appy”.
The problem is historically we’ve been stuck in an either/or situation. You either jump through ALL the SSR hoops to get a quick first paint (then hope hydration goes well) or you forget about SSR all together and hope your users are using Brave on a Macbook Pro.
With React Server Components, you no longer need to make those tradeoffs. Leverage the strengths of server/client rendering while avoiding the weaknesses.
Here are the details -
A component’s pathname now specifies whether it’s a server component (
X.server.js), a client component (
Y.client.js), or both (
Server components run only on the server and they have no impact on the client’s bundle size.
Because server components run on the server, they have direct access to server-side resources (databases, file systems, etc).
Server Components treat all imports of Client Components as potential code-split points. This means you get code splitting essentially for free since React will never ship a Client Component that isn’t immediately needed by the client.
React is back baby!
This issue is already long enough. So uh, don’t use nested ternaries regardless of how clever you think you are.
Radix Primitives is a low-level component library that’s focused on accessibility and easy customization.
If you still can’t get enough of React Server Components, Addy Osmani wrote a nice article on it too.
W3Techs released the results of their 2020 Web Technologies Survey. TL;DR — WordPress is still dominating the CMS world (and still growing fast), and lots of developers are still using JQuery. Thoughts and prayers.
Snapdrop is a fun project that basically recreates Apple’s AirDrop feature for sharing files locally with your browser. It’ll be a great way to pass time at the airport, if we ever fly again (and if everyone else in the world starts using Snapdrop).