Tech Snacks by Passionate People

A recurring segment during our weekly company call (This week at Passionate People), is called "Tech Snacks" where we share some interesting tech updates, releases, blog posts and news from all across the web, curated specially for our team.

Passionate People Tech Snacks for Week 27, 2021

Designing a Dataflow Editor With TypeScript and React | Protocol Labs Research
This is a design report – a story about the tradeoffs and challenges that we encountered while building a medium-complexity React component in TypeScript. These include state modeling (“making illegal states unrepresentable”) basic type-level programming in TypeScript DX patterns for generically typed React components DX patterns for reusable controlled components using a Redux-like action/dispatch state paradigm These topics all deal with the external interface and TypeScript typings; lower-level implementation challenges (like optimizing drag interactions and sharing state between React and D3) have been left to a future post.
Dependency injection for React hooks. Contribute to garbles/react-facade development by creating an account on GitHub.
Enforce, Enable, & Empower
Understanding the spectrum of control in design systems
Five reasons your first design system will fail |
In the course of three years of consulting and problem solving for companies with existing design systems, one fact has become (at times, painfully) obvious: Design systems are hard to get right.
When a Click is Not Just a Click
The click event is quite simple and easy to use; you listen for the event and run code when the event is fired. It works on just about every HTML element
Improving Cumulative Layout Shift at Telegraph Media Group
How Telegraph, the leading UK news website managed to improve their 75th percentile CLS by 250% from 0.25 to 0.1 in a couple of months.
Instant Vitals
Instant Vitals is an open source library to identify parts of your website that are degrading your Web Vitals scores.
Fast, offline, and free documentation browser for developers. Search 100+ docs in one web app including HTML, CSS, JavaScript, PHP, Ruby, Python, Go, C, C++, and many more.
`export default thing` is different to `export { thing as default }`
Here's how they differ, and when it matters…
JavaScript – Base64 Data URLs Outside of the Latin1 Range
It’s A (Front-End Testing) Trap! Six Common Testing Pitfalls And How To Solve Them — Smashing Magazine
When writing front-end tests, you’ll find a lot of pitfalls along the way. Let’s explore common mistakes developers make, and how to avoid them. Testing doesn’t need to be painful, after all.
TablesNG — Improvements to <table> rendering in Chromium
Shipped with Chromium 91 is TablesNG, a under-the-hood rewrite regarding tables. Here's a list of interesting fixes it contains.
RenderingNG - Chrome Developers
In 2021, we will largely complete the process of designing, building and shipping RenderingNG, a next-generation rendering architecture for Chromium.
The State Of Web Workers In 2021 — Smashing Magazine
The web is single-threaded. This makes it increasingly hard to write smooth and responsive apps. Workers have a bad rep, but can be an important and useful tool in any web developer's toolbelt for these kinds of problems. Let’s get up to speed on Workers on the Web!
Query language for efficient data extraction from Wikipedia - zverok/wikipedia_ql
JS is weird
A fun and tricky JavaScript quiz
Solid · Reactive Javascript Library
Solid is a purely reactive library. It was designed from the ground up with a reactive core. It's influenced by reactive principles developed by previous libraries.
The Internet Is Rotting
Too much has been lost already. The glue that holds humanity’s knowledge together is coming undone.

Would you like to learn more about how we can help you and your teams get to the next level?

Contact us