Bytes #52 - thE sUSpenSe iS KIlliNg mE

thE sUSpenSe iS KIlliNg mE

Issue #52.June 14, 2021.2 Minute read.

It's been exactly one year since we started Bytes 🎉. Thanks for reading and telling your friends. We love all 87,000 of you (some more than others, admittedly).

Feel free to reply to this email with you singing us your favorite birthday song. It doesn't have to be by Jeremih, but it doesn't not have to.


In this issue we break down React 18, talk about building websites without JavaScript (kind of), and learn how Vue 3.1 is not a planet.


Spongebob Meme

thE sUSpenSe iS KIlliNg mE

React 18 is Live! (Kinda)

The React Team published their plan for React 18 last week and released the first alpha version. Along with it they also created an invite-only "working Group to prepare the community for gradual adoption of new features in React 18".

We weren't invite, but it's cool because like we didn't really want to be. We're already in a working group anyway, you probably don't know her - she goes to another High School.

New Stuff:

  • Concurrent ~~Mode~~ Features -- Instead of an all-or-nothing "mode" that could've broken a whole bunch of apps, React 18 will come with a set of opt-in "Concurrent Features", with no breaking changes to components 🙏. You can use all, some, or none of them and be just fine. Highlights include SSR with selective hydration (helps your app load and become interactive faster) and startTransition (keeps your app responsive during large screen updates).

  • Suspense -- Here's to hoping this kills all the "thE sUSpenSe iS KIlliNg mE" puns. I can't take anymore. OK let's continue. Wtf does <Suspense> *actually* do? Tl;dr -- it lets your components "wait" for something (like data) before rendering. React 18 will provide stable support for all Suspense functionality, including exciting new stuff like data fetching (!!).

  • New Root API -- ReactDOM.createRoot will replace ReactDOM.render() as the way to "kick off" your React app. When you switch to createRoot, you'll get all of the new features of React 18 by default. Nice.

The Bottom Line

Y'all have been sleeping on React, but it's time to wake the h*ck up... even though the public beta is still "months away."


Springboard

Get that bread [sponsored]

Springboard wants to help you make more money

This just in: you can no longer get hired as a software engineer by "knowing a little HTML and CSS" and being "pretty good with computers" 😱 . The glory days of 1997 are long gone, but if you're trying to break into web dev, at least you've got Springboard.

They created the world's first software engineering bootcamp with deferred tuition and a job guarantee -- so if you're not hired in 6 months you never pay anything. They partnered with Colt Steele to build out the curriculum and gave every student 1:1 mentorship from a senior engineer.

And it seems to be working out so far. 97% of Springboard's students have landed a job within that 6-month window, and the graduates have increased their salaries by $25.8k on average.

So if you're trying to land that first web dev job (or you know someone who is), it's time to drag yourself out of YouTube tutorial hell and check out Springboard.


Imagine meme

It's easy if you try

Astro is shipping websites without JavaScript (gasp)

Whether you're trying to build faster websites or reduce traffic in the Suez Canal, the advice is the same: just ship less.

But that's become a lot tougher these days as ~~product managers~~ users (?) demand more and more features that require more and more JavaScript. Astro wants to change all that with its new static-site generator that "ships zero JavaScript by default."

How TF does that work? Astro renders your entire site to static HTML and only ships JavaScript to the parts of your site that need it via an Islands Architecture approach. Interactive components (like image carousels and shopping carts) get loaded by Astro -- but if a user never sees an interactive element, they never load the JavaScript required to run it. (This seems similar to code splitting to me, but that doesn't quite have the same ring as "we don't ship JavaScript".)

But what about my frameworks? Calm yourself, Iago. You can still use any framework you want (and any other npm package like TypeScript or Tailwind) to build your UI components. Astro just renders everything that doesn't need JavaScript to static HTML during the build.

The Bottom Line

Astro was built by Fred K. Schott -- the creator of Snowpack and a clear proponent of the Using-your-middle-initial-makes-you-seem-smarter Theory. The Snowpack connection is important, because Astro's "JavaScript on-demand" approach is only possible because of these newer, less-bundled build tools like Snowpack, Parcel, esbuild, and others.

As these build tools continue to gain ground on the Webpacks of the world, we can't help but wonder -- will we eventually be saying the same thing about Astro gaining on the top SSG/SSR frameworks like Next.js and Gatsby?


Cool Bits

  1. SnipSnap is a VS Code extension that makes it easy to share and use code templates. It's also what Michael Scott says to Jan when he's trying to explain how she "has no idea the physical toll that three vasectomies have on a person."

  2. Vue.js 3.1 was released with a new "migration build" that makes it easier to upgrade from Vue 2 to Vue 3. They named this release "Pluto", because they want to make it very clear that Vue 3.1 is also not a planet.

  3. Spokestack is a collection of open-source libraries & tools that makes it super easy to customize machine learning for voice interfaces that runs on any platform. We're coming for you, Siri & Google![Sponsored]

  4. Dennis wrote an article called The Art of Frontend Engineering that kind of feels like art as you scroll through it, tbh.

  5. JS is Weird is a JavaScript quiz that shows you 25 quirky expressions and has you guess the output for each one. Think Brendan ever gets tired of floating point number jokes?

  6. Kapolos wrote a cheeky article on Rust from a JavaScript perspective, which is hosted on the blogs.harvard.edu site. Because what my brother's trying to say is that the whole site is based on the idea that girls wanna get with guys who go to Harvard. Nice flex, Kapolos.

  7. Ryan Dahl went on The ChangeLog Podcast to talk about building Node, leaving Node, building Deno, his obsession with 4-letter anagrams, the existence of extra-terrestrial life, why the Utah Jazz will win the NBA championship this year, and more.

  8. Low-defy is an open-source, low-code framework that lets you build web apps, admin panels, and BI dashboards with YAML or JSON configuration files. Not Included: them baggy sweatpants and the Reeboks with the straps.


Job Posts

2x Sr. Frontend Engineers - React | 100% Remote

Close.com is looking for two experienced individuals that have a solid understanding of React and want to help design, implement and launch major user-facing features. They are a 100% globally distributed team of ~45 high-performing, happy people that are dedicated to building a product our customers love.

G2i is seeking Senior React, React Native, or Node Developers | 100% Remote

Looking for highly competent engineers that take pride in their craft, are never satisfied with their knowledge base, and bring enthusiasm to building applications in React, React Native, and/or Node. Ideal candidates are comfortable working in dynamic engineering environments and display strong communication and documentation skills.

Join Bytes

Delivered to 70,048 developers every Monday