The People's Router™️

Issue #135.November 10, 2022.2 Minute read.
Bytes

Hello friends. I hope that at least some of your currency is the centralized kind 🥲.

Today, we’ve got the people’s router, Maslow’s Hierarchy of (JavaScript) needs, and cat photos as the engine of all web innovation.

Welcome to #135.


Eyeballs logo

The Main Thing

Bugs bunny with a hammer and sickle and lots of JS frameworks

*Our* router

Introducing The People’s Router™️

During Tuesday’s session of Jamstack Conf, Tanner Linsley (creator of React Query and friends) got on stage and painted us all a picture of a brave new (typesafe) world.

In this world, we didn’t need to worry about global or server state (at least not as much) — because shouldn’t we just be storing as much state as possible right inside the URL, the way TBL intended? After all, links are the OG form of “portable state”, and they’re inherently shareable, bookmark-able, and historical.

Next.js and React Router already give us APIs to help us manage state inside the URL structure with path parameters and search params, but they still leave us with two problems:

  1. Next and RR’s approach doesn’t always scale well, because they assume you’re working with very few search params, flat key-value pairs, and strings (reality is usually often more complex than this).

  2. Next and RR naturally exclude all non-React frameworks. (Remix doesn’t, but more on that later.)

So what did Tanner do? He locked himself in a dark closet under the stairs for a few months (Harry Potter style), until he came out with some magic. And on Tuesday, he unveiled TanStack Router — a scalable, framework-agnostic routing library that brings the full power of URLs to the unwashed masses.

Here’s a few more highlights from this beta release:

  • 100% typesafety means the router is fully inferred from route definitions to rendering, so you get autocomplete everywhere and you don’t have to worry about writing unsafe routes.

  • State-manger grade search params come with schemas and validation, custom parsing and serialization, and immutability to make it easy to store all kinds of state in the URL without triggering unwanted side effects.

  • Built-in caching with custom cache timings and automatic preloading for faster page loads.

Bottom Line: TanStack Router definitely builds on popular routing patterns and ideas from Remix, Next, and React Router, while taking it to a whole new level and expanding it beyond the React ecosystem.

        

dynaboard logo

Our Friends
(With Benefits)

A woman in a fast car

Let the power flow through you

Dynaboard helps you build fast

Have you ever though to yourself, “What if Geocities was still around and also had a baby with modern web development?”

Me neither. But Dynaboard did, and that’s why they were crazy enough to build it. So now you can use their platform to build fully customized, modern full-stack web apps in one sitting — without all the complexity. Here’s how:

  • Fork one of their app templates, or use their customizable component libraries to build whatever you want 10x faster — without worrying about frameworks, boilerplate, or dependencies.

  • Add custom code wherever you want, on both the client and the server. Dynaboard is powered by Wasm and supports all ES2020 syntax to give you max flexibility.

  • Build and edit with your whole team (even the marketers) in real time with their Google Docs-like multiplayer mode.

The web’s come a long way since you helped set up that WordPress site for your grandma’s scented candle blog back in 2009, but Dynaboard makes it feel just as fun and simple as it did back then — but with a lot more power.

Check out their (solid) free tier.


The Job Board Logo

The Job Board

Senior or Staff Front-end Engineer
100% Remote
React

Close.com is looking for an experienced React developer to help design, implement and launch major user-facing features. Close is a 100% globally distributed team of 65 high-performing, happy people that are dedicated to building a product our customers love.

Software Engineer - Mobile
Remote
React Native
$150-$250k

Come work closely with Phantom's founders to build their flagship mobile app in React Native – a crypto wallet that's already used by millions of people to access apps and financial services built on the Solana blockchain.

Have a job you want to fill?
Trends logo

Trend of the Week

Sponsored by FusionAuth

They created this free ebook on Breaking Down JSON Web Tokens, that breaks down what they are, how to use them well, and the pros and cons.

lodash vs ramda vs underscore

The functional programming OG's – data by npmtrends.com

Much like super skinny jeans, there was a time when functional programming in JavaScript was the all the rage. This was largely thanks to LEGEND Jeremy Ashkenas — the author of CoffeeScript (which had a big influence on the design of ES6), Backbone (which brought the MVC pattern to JS), and Underscore (which introduced the broader JavaScript community to functional programming).

If you aren’t familiar, Underscore, Lodash, and Ramda are collections of composable functions for dealing with data. So what’s going on with the big functional programming libraries these days?

  • FP in JS slowing down: From the trend chart, we see that the overall growth of the 3 most popular libraries seems to be slowing down. In general, there has been an increase in the popularity of reactive systems like Svelte or Vue, which watch for mutations rather than using pure functions and immutability (see also MobX vs Redux).

  • Browser / ESM support: The two successors to Underscore, Lodash (which started as a fork) and Ramda (which appealed to the hardcore FP nerds), worked on being more browser and bundler friendly by supporting ESM and tree-shaking. This helped them become more popular than the og _.

  • Language updates: The JavaScript spec has added a lot of new functionality that makes utility libraries like these less necessary. That being said, the functional programming story in JS seems to be held back by the lack of features like pattern matching.

  • The future: The reality is that JavaScript will continue to evolve, but it’s always good to remember that we are standing on the shoulders of giants — and tools like Lodash and paradigms like FP will continue to be influential.


Cool Bits logo

Cool Bits

  1. SolidJS just released SolidStart — a new framework for Solid apps that’s built on Vite and features Nested FileSystem Routing. Because apparently, the unofficial theme of this year’s Jamstack Conf was “come launch some routing stuff.”

  2. If you’re trying to hire remote developers, World Wide Teams lets you easily get your job in front of lots of remote-friendly developers. You can even specify your roles by country, state/province, and time zone. [sponsored]

  3. The Placemark team wrote about Dependency management in practice. Now I just need them to write a post called “Practicing Management in Practice”, so that I can use it to passive aggressively gently call out my team lead.

  4. Expo SDK 47 was just released with a brand new Expo Modules API. Has a single person created a React Native app in the last four years without using Expo? Are we even sure if that’s possible?

  5. James Sinclair wrote an article called Why would anyone need JavaScript Generator Functions? I don’t know, James, but maybe you should take it up with Old Man Maslow if you’ve got a problem with his hierarchy of needs.

  6. Google’s CSS Podcast made this 10-minute episode on Subgrid, which should be a stable feature in all major browsers “soon” (which means anytime between tomorrow and the year 2037).

  7. Alex Illarionov created this Supersonic Plugin For Scroll Based Animation. Like many great web innovations, this plugin was born out of a need to more easily view pictures of cats on the internet.

  8. The first stable release of Rome just came out. Time to find out if Ralph Waldo Emerson was right all along when he famously said, “Build a faster linter and the world will beat a path to your door.”