Young React #87 – The New Brandeis Movement

I started learning Rust based on Rustlings, and it has been a joy. I love that the tooling enabled a newcomer like me to focus on learning, instead of tooling. It reminds me of my college projects. This should be how onboarding should feel like.

Software Engineering ⚙️

Stop using isLoading booleans – Kent C. Dodds

The most complicated component began its life with a simple isLoading. But after 2, or 3 more state variables, the number of states becomes unmanageable. Worse yet, Typescript’s exhaustive type checking aggravates the issue. I’ve been avoiding using state machines due to my lack of familiarity, but Kent C. Dodds pushed me over the edge.

A Guide to GraphQL Errors – Marc-Andre Giroux

This guide is the most comprehensive one on GraphQL error handling I’ve found so far.

Introducing Rome – Sebastian McKenzie

Rome is a comprehensive toolchain to bring compiler, linter, formatter, bundler, testing framework into one. The original author behind Babel builds it, so I am keeping a close eye on it. I first found the tool last March, and it is now in beta.

How GPT3 Works – Visualizations and Animations – Jay Alammar

I find how all these different deep learning models work confusing. But these visualizations enlightened me a little.

People ❤️

Equity for all? – Emily Kramer

Carta’s former Head of Marketing sued Carta for alleged gender discrimination. This lawsuit reminds me that the path to true inclusion is long and hard, and a politically correct press release isn’t going to cut it. I have to stay vigilant and actively fight against discrimination.

How to Break Up with Your Commitments – Elizabeth Grace Saunders

Not being able to say “no” is my worst weakness. I’d reluctantly agree to do something, then procrastinate (which is also from stress), and keep repeating the pain. The article made me reevaluate my current commitments at work.

Business 💸

The New Brandeis Movement: America’s Antimonopoly Debate – Lina Khan

The issue with the current tech monopolies is no longer about consumer harm. We all choose to use Google and Facebook. It’s about how the market is structured and who owns the power. This article summarizes this new perspective on tech regulation.

Young React #86 – Records & Tuples for React

My wife and I are heading out for a week-long vacation this week. Due to the ongoing pandemic, we will stay at a nearby Airbnb for a change of scenery. I hope you, too, try and make the best of the situation 🌴.

Software Engineering ⚙️

Records & Tuples for React – Sébastien Lorber

Records & Tuples is a stage 2 ECMAScript proposal to introduce native immutable data structures. Sébastien goes into how this could improve React’s unidiomatic techniques like useMemo. But I worry about the performance of the deep equality check, which will scale with the size of the records. Hopefully, the native equality check is faster than what we have now.

Incident Report: TaskRouter JS SDK Security Incident – July 19, 2020 – Twilio

AWS S3 is notoriously tricky to configure correctly, and this incident won’t be the last of its kind. Twilio left one of its public S3 buckets editable by anyone, and a hacker group injected malicious code into the SDK.

The Edge Computing Opportunity: It’s Not What You Think – Cloudflare

This article is a marketing piece from Cloudflare. But it does highlight the changing regulatory landscape as one of the factors developers now need to consider.

Business 💸

The Big Tech Hearing Proved Congress Isn’t Messing Around – Wired

The US Congress held a hearing with the CEOs of the biggest US tech companies, and presented the pointed critiques. With other news of how politics changes tech, this week feels like the beginning of a new chapter.

Microsoft to continue discussions on potential TikTok purchase in the United States – Microsoft

Microsoft officially confirms that it is negotiating a purchase of TikTok operations in the US. There will not be one global “tech” industry as the tension between the US and China escalates.

Hurting People At Scale” – BuzzFeed

This piece summarizes the ongoing internal turmoil at Facebook due to the mismanaged content moderation.

Young React #85 – What Does Sponsorship Look Like?

My wife has started her Master’s study at UC Berkeley, which is super exciting (She wrote about her journey to grad school here). Since she will take her classes remotely, I will be able to eavesdrop on her classes and get some free education as well. I am especially looking forward to a case-study class of tech companies.

However, we also ran into a predicament when she and I had meetings/classes at the same time. We live in a one-bedroom apartment, and our desks are sitting right next to each other. When we speak at the same time, our voices bleed into the other’s microphone and get in the way. But it’s already too late to get a bigger place since we just signed a new lease. Well, this explains why the housing price in the area went up.

Photo by Petr Macháček on Unsplash

Software Engineering ⚙️

TypeScript React Apollo – The Guild

In my current GraphQL-Typescript setup, I have to manually type individual useQuery and useMutation hooks, which is tedious and error-prone. This code generation tool autogenerates the typed hooks.

Relatedly, graphql-typescript-definitions from Shopify alleviates that problem by providing the necessary interfaces right from the graphql document. But it still requires manual typing at the end.

Svelte ❤ TypeScript – Svelte

The Svelte team recently announced that Svelte now supports Typescript. I have to admit that I had quite a simplistic view of what it means to support Typescript before reading this. The integration was quite involved since Svelte has its syntaxes and language server; the Svelte team extended its language server to understand Typescript and provide the language information to IDE based on the common interface.

jest-axe – Nick Colley

This accessibility testing tool integrates with Jest so that you can unit-test your components for their accessibility. I love that I only have to assert toHaveNoViolations at the container element. A word of caution though: this test does not guarantee your app’s accessibility.

People 💖

What Does Sponsorship Look Like? – Lara Hogan

I learned that, at a larger org, my access to opportunities (visible and impactful projects) matters as much as my ability to execute them. Without the opportunity, I can’t learn from experiences. Without the experience, few will offer the opportunity. Sponsorship, promoting others for the new opportunities, is a great tool to break that logjam. And I am deeply grateful to Lauren for giving me that chance.

Business 💸

Content, Cars, and Comparisons in the “Streaming Wars” – Matthew Ball

I always found how content accounting works strange. All content spends are treated as assets, and they are amortized over the same number of years when some turn out to be a dud right off the gate. The article reminds me that, even if accounting works mechanically, the quality of execution (talents, and IP) matters.

Young React #84 – Apollo Client 3, and React Aria

I was notified this week that I passed one major milestone in getting the US pI was notified this week that I passed one major milestone in getting the US permanent residency. So my wife and I hurried to get our paperwork ready as soon as possible. The process asked for everything in my life: my bank statements, all my immigration documents collected over the last 12 years, my birthplace, my parents’ birthplace, my current address, my address five years ago, and so on. It is when faced with this immigration bureaucracy, I feel the most foreign to this place I’d like to call home.

Photo by Christa Dodoo on Unsplash

Software Engineering 🌐

Announcing the Release of Apollo Client 3.0 – Apollo

Apollo Client 3, one of the most popular and powerful GraphQL clients, is finally out of its beta. There are quite a few features, but I look forward to the improved pagination handling and the simplified package the most.

React Aria – Adobe

This React hook library lets you build accessible components by generating the correct props for HTML elements. It is an easy and impactful first step to make an accessible product. My team is already looking into bringing this library into our component library.

New in Chrome: CSS Overview – Robin Rendle

CSS Overview is an experimental addition to Chrome Debugger that shows the used colors, fonts, and unused declarations (super excited about this). I didn’t realize that we have three different blacks and four different dark grays in my codebase 🤦. I won’t use this feature daily, but it would be good to audit our styling periodically.

super-expressive – Francis Stokes

This library adds a more readable DSL to make regex patterns more maintainable and reviewable. I like the idea.

Business 💸

Trump’s freeze on new visas could threaten US dominance in AI – MIT Technology Review

Given the uncertainty around immigration, it does make me wonder if I made the right choice to immigrate here. Once a nation of immigrants, the US does not feel welcoming anymore.

Young React #83 –

I am reading this book on the life of a British on-demand courier (think UberEats or Doordash driver), and it’s been eye-opening. I realize I haven’t paid much attention to the human cost of these platforms where the companies offload the risk and the variability onto those individuals, hiding behind the faceless apps. As builders of these platforms, we engineers can and should affect changes for a more equitable platform. We all are workers.

Riding for Deliveroo: Resistance in the New Economy

Software Engineering 🌐

🌟 – Google Developers

This report compares the documented capabilities of the most popular web bundlers. I was surprised to find that Rollup ranked higher than Webpack. But before you switch your bundlers to Rollup, there are two caveats: first, the test only uses the documented features. It may be possible to achieve what you need with other bundlers. Second, you may not need all these capabilities.
On the website, you can go deeper to see what individual tests are and how they are measured.

Getting Started with FAST Components – Microsoft

I’ve never seen a component library based on WebComponents, and FAST is the first one. From its documentation, I learned how to integrate with a WebComponent library and to create WebComponents. I loved that the codebase was in Typescript, which made it easier to follow its code. I wonder how to typecheck the usages of web component libraries when the hosting code is in Typescript.

Cascading Cache Invalidation – Philip Walton

I haven’t run into this problem of cascading cache invalidation since I haven’t tried code-splitting yet. But I still found this invalidation problem intellectually stimulating.

People ❤

My Time as a Black Woman Software Engineer at Capital One – Sailor Ghoul

This article is a horrific recount of how bad management and lack of support for BIPOC colleagues can leave lasting damage not just on their career but on their health as well.

Business 💸

The Slack Social Network – Ben Thompson

Ben Thompson argues that Microsoft Teams is a vertically integrated product, whereas Slack is a horizontal product. The argument made sense until Slack acquires an enterprise identity provider service, which will create an entry into other enterprise products.

Silicon Valley Elite Discuss Journalists Having Too Much Power in Private App – Vice

Naturally, the powerful and connected would love to avoid accountability and exposure, and, thus, have tension with the press. But harassment is many steps too far. This specific article is on how Silicon Valley elites attacked a New York Times reporter for her recent reports.

Young React #82 – Mozilla Hubs, and Speed as a Habit

I found this fantastic tool called Hubs from Mozilla. It’s incredible how we can run an interactive 3D environment on a browser without needing to install any plugins. At the same time, it’s a bit depressing how little I know about these technologies.

Regardless of my insecurity, the tool is equipped with spatialized audio (meaning the closer you are to another, the louder you will hear), virtual pens, and objects, and even emoji reactions! Try it out next time you hang out with your friends or team!Image

Latenight hanging out with my wife 😍

Software Engineering 🌐

Observables, Reactive Programming, and Regret – Ben Lesh

Ben Lesh looks back at his work on RxJS and shares his regrets, the biggest of which is the community’s lack of distinction between Observable and RxJS. A few key takeaways are (disclaimer: I am a noob with Observables and RxJS):

  • Observables are not RxJS.
  • Reactive programming isn’t necessarily observables.
  • RxJS is a library of functions built around observables, not the other way around.

Introducing GitHub Super Linter: one linter to rule them all – Github

I like how different projects with different languages can use this Github Action. We spend way too much time configuring our tools and infrastructure. That being said, I wonder how I’d be able to use a beta version of typescript or apply lint rules private to the company.

Lies, Damned Lies, and Keynotes – Corey Quinn

An excellent reminder from Corey Quinn that we all get excited about new services, libraries, frameworks, and then just get back to the old ways

People ❤

Speed as a Habit – Dave Girouard

Even at Netflix, I too often see meetings end without a firm commitment to the next steps. A simple nudge like “when can this be done?” and “can this be done sooner?” will transform an ambiguous agreement into a concrete action plan.

Ask the EM: Can You Really Measure Individual Developer Productivity? – Gergely Orosz

Many tools track productivity statistics on your projects now; Gitlab has its own, and Github has many integrated tools as well. However, the statistics are not the end of a story, and it’s managers’ job to add the context and act on it.

Business 💸

The three Fs of cloud pricing – David R Griffin

An interesting analysis of how relationships with cloud providers change at different stages. I mostly agree with this view, but there are a few more things at play: First, we may be minuscule relative to the entire AWS revenue, but we may be the most significant account to your AWS sales rep. Second, when we had a high (~90%) margin (think SaaS), our AWS bill just didn’t matter.

How will the startups created in 2020 be different from startups built before? – Protocol

The big themes across the responses are: adopting distributed work, building a diverse and inclusive work culture, and running a lean company.

Young React #81 – Being Responsible For Other Lives

My wife and I decided to foster two kittens for the next five weeks. We didn’t make the decision lightly. But as we drove home with the kittens, it dawned on me that this would be the first time I am responsible for other lives.

Since fostering is short, it is not the same as adopting pets, or, much less, having kids. Nonetheless, I feel the pressure and responsibility. I have to feed them regularly, give them medications, and socialize them so that they will find a caring permanent home. To fulfill their needs, I had to adjust some of my routines and tolerate getting disturbed while working.

After a few days, I realize I never fully understood what working parents struggle with: new priorities, daily distractions, and energy drain. I knew it with my head but never felt it myself. This is another reminder that genuine empathy is hard without actually experiencing something similar.

Meet Jelly and Boba 🐈❤️

Software Engineering 🌐

Announcing TypeScript 4.0 Beta – Daniel Rosenwasser

Even though the major version changed from 3 to 4, there are no significant breaking changes. There are additions to type systems like variadic tuple types and labeled tuple elements, and developer experience improvements. I especially look forward to partial editing mode since my project already takes too long to start up.

Variadic tuple types – Anders Hejlsberg

If you were intimidated by the term “variadic tuple types,” I was, too. This PR to Typescript goes deep into what variadic tuple types are, and how it will work in Typescript. In short,

A variadic element is a spread element of the form …T, where T is a generic type constrained to any array or tuple type (specifically, any type that is assignable to readonly any[]).

People ❤

Written communication is remote work super power – Snir David

We need to consider several factors when we think about asynchronous communication: first, the purpose: are we transferring knowledge or creating new? Second, the scope: are we communicating within or without our team? Third, the feasibility: can our team meet synchronously? Depending on the answers, synchronous communication will be preferable. But I agree with the article that we need to choose asynchronous communication more than we currently do.

Reflections on Being a Female Founder – Tracy Young

Before joining Netflix, I had an offer from PlanGrid, the company she founded. So I watched her TechCrunch interview from 2015, in which she disappointed with her lack of gender sensitivity. I love that she courageously, and publicly admits her faults, and shares her learnings.

Business 💸

The Global AI Talent Tracker – MacroPolo

A quantitative argument for allowing more mobility across borders with a beautiful visualization. More relevant now than ever, in the light of the US ban on working visas.

I just hit $100,000/yr on GitHub Sponsors 🎉 – Caleb Porzio

This article is a cool story of how a freelancing developer grew his Github Sponsorship. Most of the sponsorship came from private videos, which means his value proposition was more similar to a paid newsletter or a paid podcast than Patreon.

Good Questions, Real Answers: How Does Facebook Use Machine Learning to Deliver Ads? – Facebook

A short but helpful article on how Facebook’s programmatic ad bidding works.

Young React #80 – What is a “Frontend Developer”?

After 3.5 months of stay-in-place, it’s amazing what a slight change in routine can do for my mood. My wife and I started going out for a picnic every weekend, and I feel most invigorated after the picnic. We also booked a one-week trip to a local Airbnb, just so that we get a change in scenery.

The biggest benefit of remote work is how we can experiment with our time and place. None of us chose to work remotely, but we can still try to make most of it. I hope all of us try something new!

Our picnic snack! (Rice cakes, homemade smoothie, and some leftover fries)

Software Engineering 🌐

🌟 When frontend means full stack – Chris Coyier

Chris Coyier goes into different challenges we UI developers face.

Even though we all technically fall within the same big-tent title, many frontend developers wind up specializing.

Throughout my frontend career, I’ve enjoyed figuring out the data and business logic more than perfecting the beautiful user interactions, or building design systems. So I work on internal tools, and this is the specialization I am happy with.

Type-Safe Error Handling In TypeScript – Giorgio Delgado

Typescript code with many exceptions loses type-safety, especially with multiple layers with their failure states (network error, parsing error, business logic error, etc.). Other languages have “throw” annotations to guarantee safety but not Typescript.

Returning an error, rather than throwing an error is a type-safe solution for this problem. A similar technique can be used on GraphQL to provide typesafe errors.

tota11y: an accessibility visualization toolkit – Khan Academy

I find it hard to improve an app when I don’t see how my users use the app. This barrier exists in all forms: different browsers, slower network, smaller screen size, and, most importantly, assistive technologies. total11y helps me see what’s lacking in my app with a button click.

Picking Your Tech Stack For Dummies (and the future) – Stay Sassy

As a startup, your job is to innovate on one thing and one thing only. Otherwise, you are stretching yourself too thin.

People ❤

5 Engineering Manager Archetypes – Pat Kua

Pat Kua’s article is similar to Chris Coyier’s article above in that it unwraps the meaning of the title “engineering manager.” Just as we distinguish design-focused UI engineers and data-focused UI engineers, Pat Kua differentiates engineering managers with different focuses on tech, team, process, or product. Although all posted job titles sound the same, we need to find the match between what the rolerequires and what each of us enjoys.

Why we can’t stop fighting about cancel culture – Vox

To cancel someone (usually a celebrity or other well-known figure) means to stop giving support to that person. –Merriam-Webster

I hear the term “cancel culture” around but didn’t quite get it, so I read more about it. In essence, social media gives voices to the ignored and holds our establishments and leaders to the higher standard.

Business 💸

Apple doubles down on its right to profit from other businesses – Techcrunch

Despite WWDC 2020 starting this week, Apple and its Appstore policy are embroiled in the controversy with Hey, a Basecamp’s email client. Apple’s seemingly arbitrary and opaque bureaucracy has been a burden on the iOS developers for a long time. I doubt that, given its dominant and lucrative position, Apple will change its policies unless the regulators step in.

The two-year fight to stop Amazon from selling face recognition to the police – MIT Technology Review

I doubt these decisions by the big companies can contain facial recognition technology employed by the small dev shops (the tech is mostly open-sourced). How will we hold not just the big tech companies but those providers accountable?

Young React #79 – Monorepo Challenges, Aspirational Hourly Rate

Over the last three weeks, I interviewed five manager candidates for my team. The conversations were fascinating, where I wish I had more time to hear more of their stories. Here are my key takeaways:

  • I was surprised that most candidates were directors, managing multiple teams. I heard before that Netflix engineering managers operate at a director capacity. I wonder if that translated into the sourcing target.
  • I was glad to see racially diverse candidates: three females, one Hispanic and one Black. I have given positive feedback to my director about this.
  • I had a hard time judging between a weak yes and a weak no on the scale of 1-4. Even when I wasn’t too excited about the candidate, I felt like they would do a decent job and gave 3. Should that be a strong no, given Netflix’s high-performance culture? I need more calibration on the scale.

I loved talking to managers from small startups to big corporations. The notes from this experience will come in handy when I return to management in the future.

Software Engineering 🌐

GraphQL has two distinct type systems by design: nominal (for output type) and structural (for input types).” – Ivan Goncharov

I have been confused about GraphQL backward compatibility because whether GraphQL uses a nominal or structural type system was not clear from the spec. This comment on Github is the only source I found about GraphQL’s nominal output type. To be more specific, input types are structural, but individual fields are nominal.

Speeding up a Git monorepo at Dropbox with <200 lines of code – Dropbox

It is always eye-opening when the seemingly constant operations like “git status” start slowing down at scale. I never thought about git commands’ linear performance.

Spark Joy by Running Fewer Tests – Shopify

Here is another article on tackling challenges with regards to a monorepo’s scale. Metaprogramming and dynamic types make Ruby an ideal language for small teams. However, the language does not scale as the organization grows.

As a side note, I like their chosen metrics to measure success. I wonder if Shopify’s deployment quality stayed the same.

2020 Developer Survey – Stack Overflow

I am late to the party here; Stack Overflow released the survey result late May. Rust is the most beloved language, and Windows is the most used development OS (surprise!). There is a gender divide as well: men are asking for Stack Overflow dark mode when women are talking about its toxic culture.

By the way, if you live in a non-English speaking country, I wouldn’t pay too much attention to it. The survey skews heavily towards the western world and the English speaking population.

People ❤

Set an Aspirational Hourly Rate – Naval Ravikant

Since I started working, I tried to make tradeoffs in hourly rates, too. As a result, I treated my out of office time as “free” because none was going to pay me for it. So Naval’s point, “no one is going to value you more than you value you,” or instead, I should value myself more than the market does, is a significant shift for me.

Business 💸

Solving online events – Benedict Evans

An excellent dissection of offline conferences (content, networking, meetings) and what is easy to do online and what is hard. Will networking be accomplished online? More importantly, will it be less biased by where you are and how you look? I hope so.

Amazon’s New Competitive Advantage: Putting Its Own Products First – ProPublica

Amazon, like any other retail distributors, has its private brands. That’s why some argue this isn’t an anti-trust issue. But Amazon’s listing page isn’t just a dumb shelf at Walmart. It’s driven by a recommendation engine that consumers trust to produce the best results for them. There is potential consumer harm here when the recommendation pushes more of Amazon’s products.

Young React #78 – UI Library with builtin Web Workers, Vue 3 with compile-time optimizations

I am feeling certain powerlessness being a foreigner. While the events around you impact you, you can’t enact changes.

Software Engineering 🌐

neo.mjs concepts – neo.mjs

This UI library is the only library I know that uses Web Workers to boost its performance. More specifically, it has three workers to handle app logic, data fetching, and virtual dom reconciliation, with main thread handling event fetching and DOM manipulation. I like the idea of using Web Workers very much, but its API is too different for widespread adoption anytime soon (not sure if its JSON template is a good idea). Also, the popular UI libraries are often fast enough.

Solid: A declarative, efficient, and flexible JavaScript library for building user interfaces – Ryan Carniato

Solid is a compile-time UI library, similar to Svelte. It also uses Proxy to figure out dependencies in its state instead of requiring explicit dependencies like React. I appreciate that it uses JSX syntax and has APIs similar to React’s.

The process: Making Vue 3 – Evan You

Vue 3 is also adding compile-time optimizations to improve performance, among other changes. This change made me think that React or Vue will survive and embrace new techniques like compile-time tooling and Web Workers, spurred by the new generation of UI libraries.

Changes to How We Manage DefinitelyTyped – Orta Therox

DefinitelyTyped is core to the Typescript ecosystem. But it is a weird, unwieldy repository from which thousands of npm libraries are published. Microsoft is improving how the repository is managed, and this is the kind of synergy I hoped to see with Microsoft owning both Github and npm.

People ❤

Stripe’s remote engineering hub, one year in – Stripe

This article is Stripe’s retrospective on its experiment with a remote engineering group. The key learning is that “moving multiple remote engineers simultaneously onto a team has yielded much better results for their productivity and happiness.” On the contrary, when my team had one remote engineer last year, we bungled that up. We kept talking about the “productivity tax” of having that one remote engineer, which put the onus on him to adapt. That mindset, unfortunately, didn’t work.

Business 💸

Reddit, and Facebook pondering changes to their moderation policies

Both companies are under immense pressure (Facebook employee walkout, Reddit co-founder’s resignation) to proactively deal with hate speeches, false information, and anything alike. As I said before, dealing with user-generated content is a lose-lose proposition.

Dust in the Light – Ben Thompson

On a related note, Ben Thompson here argues that the internet merely exposes reality by reducing friction to disseminate information.