We have survived the first month of 2021. Congrats 🥳
It’s the first birthday of this Newsletter, I have written this email every month for an year now. Thanks to all of you who subscribed and supported me. 🙇♂️
It’s the jQuery birthday month 🎂.
Since jQuery turned 15, a little trivia. The first logo had a Devo energy dome hat, to pair with “New Wave JavaScript.” When we redesigned it, the tag line was “write less, do more,” but we kept a nod to Devo in the negative space. Some people thought it was a signal. That’s okay
In this month’s Newsletter Keynote, we look at three companies that had a gold rush month.
The year started off with a riot in US capitol building which then turned every social media company against President Donald Trump. While giants like Facebook and Twitter blocked the President everywhere, a conservative free speech outlet Parler started gaining followers by second. Parler started stuttering as the loads increased and later altogether as AWS banned them from their servers. But here’s a tech lesson from Parler debacle.
In other words, if you make a table in a database with an integer primary key, you can only put 2.1 billion records in it. I remember when this happened to the tweets table at Twitter. It was identified and planned for months ahead of time.
Whatsapp was all set to update it’s terms and services starting next month and share some user information with their parent company Facebook. But there was widespread outrage regarding the policy to the point that WhatsApp had to claim a misinformation campaign later. People rushed to competing platforms like Signal and Telegram; Signal in particular gaining about 40 million users.
The joy was short-lived as Signal went down for long time and most people went back to WhatsApp following full page ads promising privacy from Facebook. How useful is a chat app if some of your friends are not on it?
The third company of the month is GameStop. They are a video game retailer in US who were kinda struggling because of the pandemic, blowing off some Steam. Some very large hedge funds were shorting the stocks for GameStop (well, including AMC theatres, Bed Bath and Beyond and others) and betting on it to fail. At some point, they went completely overboard as to have borrowed 130% of the stock.
This is when a subreddit that gambles on stock market called r/wallstreetbets caught a whiff of the money going round. The subreddit in a collective effort (raid!) pushed up prices of the stock and suffice to say, it skyrocketed.
Short after hedge funds starting complaining that the free market was too free, Robinhood the popular stock trading app stopped trading $GME and $AMC making everyone involved angry.
Tech Companies caught in this gold rush:
- Reddit: The subreddit had to be taken private due to sudden influx of users.
- Discord: The subreddit moved to it’s own discord channel which had to banned as it got difficult to moderate. The channel is now back up as Discord is personally assisting their team.
- Twitch: That AOC stream
- Robinhood: Went up the ladder and fell as fast.
Releases
- Chrome 88 - Brings support for a much awaited property on the Web -
aspect-ratio. No morepadding-bottomtricks. (As always, check out browser compatibility). This update also defaults links withtarget=_blanktorel=noopenerto prevent tabnabbing. It might be too quick to switch the error off on eslint, but it’s safer now. - Houdini Worklets - CSS Houdini allows you to create worklets - Tiny functions to extend CSS (Here’s an explainer if you haven’t heard it before). This page contains examples that you can use on modern browsers right now.
- Firefox for Apple Silicon - Apple might have mentioned it’s a day task to port software to new Silicon. Firefox has published their case study of porting a browser.
- Snowpack 3 - Snowpack is a super fast web development environment and in v3 it ships with in build bundling, preloading, minification and more (in production mode of course). They have been on the rise in last few months - other alternatives are vite, wmr.
- WCAG 3 - First Public Draft. It’s supposed to be easier to read, let me know if you did that.
Tutorials
- Performance Checklist 2021 - Smashing Magazine - Always amazing checklist for web performance from SmashingMag. Check out the Low hanging fruits section for some easy wins. They have also put out a long detailed case study of improving performance their own site
- Apollo Odyssey - Learning Platform - If you want to learn GraphQL with Apollo™️, hop onto their new learning platform complete with space puns. Netlify released JamStack Explorers last month, so it seems like Space is the theme so far.
- styled-components best practices - As I reiterate every chance I get,
styled-componentshappens to be my favourite styling library. This best practices blog from Josh is an absolute treasure chest. - TailwindCSS isn’t for me - Tailwind is the new cool, but it might not be everyone. The article and comments contain some interesting distinctions and discussions. I hold that the popularity of Tailwind is not about CSS at all, it’s about how it made developers feel like they didn’t need designers (that was how bootstrap worked too). But in case you are a fan, here is a Tailwind romance novel.
Someone (not me) has written a romance novel about tailwind.css
In the Spotlight 🔦
Let’s look at state management in React.
I have maintained my apprehension against using Redux because of my experiences of using it so far. One of my favourite instances are from starting out as a contractor on a project my first ticket was that all dropdowns on the page were being triggered simultaneously. A developer had put the state for dropdown in Redux not anticipating that there could ever be two dropdowns on the same page!
I can currently live with no third party libraries, just React Context, but then that’s not state management, it’s just global state. As Mark Erickson eloquently puts it:
Context is a form of Dependency Injection. It is a transport mechanism - it doesn’t “manage” anything. Any “state management” is done by you and your own code, typically via useState/useReducer.
Link to his blog post explaining differences in detail.
There are a large number of solutions for state management that are currently available for React. Here is how they stack up:
State management libraries can be roughly categorized 2 ways: ⏺ Single (global, atomic store) vs. multi (local, distributed) ⚡️ Direct (manipulate state) vs. indirect (send events) Here’s how I’d categorize some JS state management libraries:
Redux or comparable solutions pass only the store object to the components meaning that all components in the tree do not have to rerender if one value in the store changes. But this is not the case with Context. But this is changing, once this experiment goes through, useSelectedContext will enable to users to select when they want components to rerender.
[Experiment] Context Selectors by acdlite · Pull Request #20646 · facebook/react · GitHub
Based on #20890 This is not a final API. It's meant for internal experimentation only. If we land this feature in our stable release channel, it will likely differ from the version presented he…
In Other News
- CES 2021 - CES 2021 was live this month and here’s a rundown of all the awesome stuff we saw at the virtual show and might never see again.
- State of JS - 2020 - JavaScript’s largest survey results are here, the industry is still 90% male, React and Vue are leading, Svelte is catching up.
- JavaScript Rising Stars - Deno has dethroned the 5 year consecutive star🌟 VueJS.
- Leaking a zoom meeting - I’m assuming none of you have planned something like this, but just in case you are. (Lesser I know, the better 😜)
- New campaign targeting security researchers - A phishing campaign against security researchers from North Korea.
- Australia & Google - Australian Government has asked Google to start paying publishers as they use the scrapped content across their platforms and Google has threatened to leave the Down Under.
Looking Forward
- Gatsby Conf - March 2,3