Hope you brought your umbrella – because it’s officially Framework Week, and we’re about to make the abstractions rain. Welcome to #55.
Zuck off to fight in the framework wars
Last week, SolidJS released v1.0 of their “declarative, efficient and flexible JavaScript library for building user interfaces.”
If that sounds a little (or a lot) like React to you, buckle up because Solid also supports most React features like Fragments, Portals, Context, Concurrent Rendering, SSR & Hydration, and more.
Ryan Carniato (Solid’s creator) has said that his goal was to provide “all the flexibility of React and the simple mental model of Svelte.”
Here’s a few ways the framework does that:
No Virtual DOM – Instead, every part of Solid (including its renderer) is built on the same foundation of composable “reactive primitives” that you’ll use to build your app – which also means that every part of Solid is extensible.
Expressive AF – Despite no VDOM, all Solid apps are built using JavaScript/TypeScript and JSX (your JSX elements are just real DOM nodes). And because the compiler optimizes only the JSX (and nothing else), you have the full language at your disposal.
Fast & Furious – Solid’s “reactive primitives” approach gives it Dom-Toretto-hitting-the-NOS-boosters levels of speed. The framework tops pretty much every performance and memory utilization benchmark that you’d ever care about (and many that you wouldn’t) .
Want to see it in action? Check out this 25-minute video where we demo’d how to build a color transformation tool and dad joke search app with SolidJS.
I wanna go fast
You can always tell something is cool-and-edgy when it intentionally misspells its own name – Boyz II Men, Linkin Park, Froot Loops.
And now there’s Qwik – a bleeding edge, HTML-first framework created by Miško Hevery (some dude who apparently created this other framework called Angular??).
Qwik’s goal is to crush the time-to-interactive metric by serving static pages to the user (so they’re fast), while still retaining all of their interactivity. It does this by storing all of your app info in the DOM/HTML and by “focusing on resumability of server-side-rendering of HTML, and fine-grained lazy-loading of code.”
That’s a lot to break down, but here’s the qwik-and-dirty:
DOM-centric – Storing your app’s Qwik Component
s, Entity
s, and Event
s in the DOM means that your app can be easily re-hydrated, because the Qwik framework has no runtime info that needs to be recreated on the client
Resumablility – Qwik serializes your app so that those components and entities can be sent over HTML and resumed later, enabling fast startup times regardless of app size
Xtreme Lazy-loading – Almost all Qwik APIs can be called asynchronously so that lazy-loading can be inserted when needed, which can drastically reduce the amount of code that needs to be downloaded and executed
Check out Qwik’s live demo to see it all in action, and be sure to tell all your friends to subscribe to Bytez – the coolest-and-edgiest newsletter on the Net.
(👑) Sarah Drasner created a Fortnite VSCode theme that’ll trick your brain into thinking you’re a kid playing a fun video game, instead of an adult working for a company whose idea of “fun” is everyone ringing a gong every time they sell something to another company.
Surma wrote about The State of Web Workers in 2021 and how they can still be “a useful tool, despite their bad rep” (just like that bro in the stringer tank top who occasionally spots you at the gym).
Principles.dev is a community-created list of principles used in software engineering and team leadership. Pretty sure that Principle #1 is “Make sure all developers are properly educated on all Infinidash features.”
Ania Kubow made an awesome video on coding Mario in JavaScript using the Kaboom.js library – and Kaboom goes the dynamite.
Tauri is a framework for building small, fast desktop apps with a web frontend. We’re still waiting on the framework for building large, slow apps – cowards.
Henrik and Andre created IndiePen, a privacy-friendly tool to embed HTML, CSS, and JS code examples that doesn’t embed cookies. Too bad I gave up on privacy a long time ago when I decided to download Numb Encore from Limewire on the family computer.
The TLDR Newsletter is a free daily newsletter with links and TLDRs for the most interesting stories in tech, science, and coding. It’s covers a broader scope of topics than Bytes, but it’s a good way to stay informed on stuff beyond just the JavaScript ecosystem (if you’re into that sort of thing). [Sponsored]
GitHub just announced Copilot – “your new AI pair programmer” that’s powered by OpenAI and trained on billions of lines of public code. Does anyone have opinions on this? We’ve been looking everywhere and can’t find any.
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.