BFFs who share the hobby of bashing React

Issue #41.March 28, 2021.2 Minute read.
Bytes

We’re experiencing a little FOMO by everyone scamming their own audiences out of their hard earned money by selling them json files NFTs. Keep an eye out for our drop next week 😉.

SvelteKit Enters Public Beta

Boat

It’s doing its best

Working with a big-name OSS author sounds kinda rough sometimes. Like, guess what’s always gonna be in your tech stack?

Well, if you were building a Covid Tracker while working at the New York Times with Rich Harris last year, you already knew Svelte was gonna be involved. But those developers got another fun curve ball thrown at them when they were forced had the opportunity to use the then-unfinished SvelteKit framework too.

To be fair, it worked. And while Rich did admit that this dogfooding-on-steroids wasn’t exactly best practice, who wasn’t scrambling back in Spring 2020?

Fast forward a year, and SvelteKit just announced its public beta last week.

It calls itself “the Next.js of Svelte,” because SvelteKit is also a “meta-framework” for building web apps that uses flexible, filesystem-based routing - not because its parent company has raised $61m in funding (yet?). SvelteKit also handles all of the boring stuff like code-splitting, offline support, and server-rendered views with client-side hydration.

What’s its secret? At last October’s online Svelte Summit, Rich stared deeply into all of our souls and preached the gospel of Snowpack — telling us how using this super-fast frontend build tool under the hood of SvelteKit was a game changing alternative to heavier bundlers like Webpack and Parcel.

As we all know, this industry moves fast. Since Svelte Summit checks notes 4 months ago, Rich has been born again and now finds himself in Evan You’s house Vite. According to Rich, the refactor enlightenment happened because Vite’s built-in CSS code-splitting and SSR capabilities more closely match SvelteKit’s specific requirements.

It also probably doesn’t hurt that Rich and Evan are BFFs who share the hobby of bashing React on Twitter.

The Bottom Line

Right now, there’s a pretty big gap in Svelte interest (which is very high) and Svelte usage (which is not as high, yet). Making SvelteKit the go-to way to easily get started with Svelte should help to close that gap by making Svelte-world a lot more approachable.

Vanilla Extract – A New Way to CSS-in-JS

Mark

Alright stop, collaborate and listen

Straight Outta Melbourne… comes a new-and-improved way to do CSS-in-JS from recovering Meme Lord and one of the creators of CSS Modules, Mark Dalgleish.

Vanilla-extract is a brand new library that Mark calls “the spiritual successor to CSS Modules, but with hashed CSS Variables.” It’s also one of the best names for a new open-source library that we’ve heard in a minute (you can take the boy out of the Memes but you can’t take the Memes out of the boy).

V-E (as the cool kids would say) lets you write styles in TypeScript or JavaScript with locally scoped class names and CSS Variables, then it generates static CSS files at build time.

We don’t know a lot about vanilla-extract at this point, but here’s a few more highlights, courtesy of Mark’s announcement tweet:

  • Zero-runtime Stylesheets-in-TypeScript
  • Minimal abstraction over standard CSS
  • Works with any front-end framework
  • Locally scoped classes + CSS Variables
  • High-level theming system

The Bottom Line

Since vanilla-extract is the “spiritual successor to CSS modules,” we started thinking — what would be the spiritual successor to this newsletter?

Hear me out. We take Bytes, make it a png file, host it on Cloudinary, put that meta data in a json file, call it an NFT, ???, profit.

Don’t miss the drop next week.

What does building for the web look like 5 years from now?

“We’re going to increase the abstractions for a lot of development work. UIs for things like Babel configuration and other build tooling. Default configuration from CI products that can keep up with tooling changes faster than browsers can adopt standards. There is going to be a larger gap in the knowledge needed to build the tooling compared the knowledge needed to use the tooling.”

  • Laurie Barth is a Staff Software Engineer at Gatsby building nextgen tooling. She will be doing a member-only Event this Thursday on Modern Gatsby.

Cool Bits

  1. Speaking of our good friend Laurie, she just wrote an article called A Tale of Two Experts to illustrate how to write “human-readable” JavaScript. It was the best of specs, it was the worst of specs.

  2. Vercel released Next.js 10.0.1. Because we’re #agile, we’ve included it here for your consumption mere hours after its release.

  3. Sam wrote a tutorial on building a website with Svelte & SvelteKit that isn’t the NY Times Covid-19 tracking app.

  4. Dave Ceddia wrote a really in-depth article on how to choose between (React) State Management Libraries. We found it peculiar that he based his methodology on the United States’ Electoral College, but it is hard to argue with the effectiveness of the Iowa Caucus.

  5. Michael created a new eslint plugin for clean regex, which makes it easier than ever to use regex without actually knowing regex.

  6. Ivan wrote about how changing a single setting can make your Jest tests 20% Faster. You could technically make your Jest tests 100% faster by never testing at all and hoping for the best, but the establishment doesn’t want you to know that.

  7. Sean wrote about understanding TypeScript Generics and as a Generic white guy in tech myself I found it helpful.

  8. Anthony wrote about how he “escaped” Node.js, and how you can too. Now might be a good time to remind you that if you ever find yourself in an unhealthy relationship with your runtime, it’s best to just make a clean break.