JEM - Web in July - JavaScript Every Month Newsletter

Hey August 👋

When I took up software engineering, we used to joke in the college dorms: "Nobody died because of software engineering." It seemed like one of the least risky jobs out there, and I believed that for a long time.

This might not have been true even then, but in the post-corona era, it's definitely far from the truth. Many people learned this lesson the hard way this month when a Crowdstrike update brought down scores of services. It didn't matter whether you'd heard of Crowdstrike before, whether you had a Windows device, or whether you had updates turned on. Airports, hospitals, television programs, government services, and even digital signages were affected, disrupting all forms of activity. Note that the update impacted just under 1% of all Windows-based devices.

More about the Crowdstrike update issue:

• Preliminary Post Incident Review (PIR) - Crowdstrike
• How One Bad CrowdStrike Update Crashed the World’s Computers - Wired
• Crowdstruck (Windows Outage) - Computerphile
  

Releases

Browsers

Firefox 128

• The target attribute of the <base> element now disallows ASCII newlines, tabs, or the < character, changing the value to _blank if any are present. This prevents dangling markup injection attacks that use an unclosed target attribute.
• [Baseline] Relative color syntax, which allows a CSS <color> value to be defined relative to another color is enabled by default.
• [Baseline] The content property supports alternative text for content that includes an image.
• [Baseline] Support for the @property rule and related JavaScript APIs

Chrome 127

• [Baseline] The font-size-adjust CSS property provides a way to modify the size of lowercase letters relative to the size of uppercase letters, which defines the overall font-size. This property is useful for situations where font fallback can occur.
• [Baseline] The content property now supports alternative text for content that includes an image. (same time in Chrome and Firefox)
• Support for the View Transition API in iframes

Safari 12.6

• [Baseline] Added support for the safe keyword in Flexbox properties.

MeteorJS 3.0

With some Node.js upgrades, the core of Meteor had to be rewritten, a process that took several years. The update has finally arrived with the release of MeteorJS 3.0 as a major version. The team hosted multiple events titled The Renaissance of Meteor.js to celebrate this milestone.

Astro 4.3

• Server islands- experimental
• Request rewriting is now stable
• Automatic generation of JSON schemas for data content collections

Fred talked about Future of Astro at Astro Together conference last month.

Uppy 4.0

• TypeScript rewrite
• Google Photos support
• Two new React hooks: useUppyState and useUppyEvent

ESLint 9.8

• Ignoring the directory where ESLint runs is no longer possible. Previously, a global ignores pattern like "/" would ignore the entire base directory.

In a blog post, ESLint team explains how they are going through a rewrite to support languages other than JavaScript.

Wasp Beta

• Rails-like framework for React, Node.js and Prisma.

StackOverflow 2024 Developer Survey results

• 90% of developers use documentation to learn.
• JS is still the most popular language. But among developers who are learning right now, Python is most popular.
• NodeJS and ReactJS remain the most popular JS ecosystem frameworks.

React flow 12

• Server side rendering support
• Hooks and helpers for computing flows
• Dark mode
• Better DX via TSDoc

In the Spotlight 🔦

Conference Talk updates

• ReactConf talks are split up and available on YouTube
• dotJS talks are on the website.
• CSS Day 2024 talks are available on YouTube.

NodeJS 🔥

NodeJS set the stage this month with two PRs raising the heat:

• node:sqlite
• --experimental-strip-types

The TypeScript stripping is done by one of the first major usages of Rust in NodeJS with Amaro, a wrapper around @swc/wasm-typescript.

Tutorials

CSS Grid Areas - ishadeed

This blog provides interactive examples demonstrating the usefulness of named grid areas and columns. Grid numbers can be confusing without devtools enabled, so having the option to name grid areas is incredibly helpful. The blog also includes scenarios where naming grid areas and columns is the best approach.

Isolated Declarations - Speeding up JavaScript ecosystem

When you click on TypeScript function from a library in your editor, you would have noticed that it takes you to .d.ts file instead of the actual source. This is because the editor gets types of the function from this file instead of the source. This is changing with isolatedDeclaration declaration feature shipped in TypeScript 5.5.

React Owner Components

Brad Westfall brings back the term "owner" in React context to make a difference to the "parent".

function UserProfile() {  <----- owner of Avatar and ProfileLayout
  const [user, setUser] = useState({})
  return (
    <ProfileLayout> <--- parent of Avatar
      <Avatar />
    </ProfileLayout>
  )
}

He goes on to explain how this terminology will make it easier to understand the boundaries of React server components.

How not to use Box shadows

This is a creative blog that pushes the boundary of box shadows and their usage on a single div.

Introducing let in angular

Angular introduces the @let syntax to define and reuse variables within component templates.

@let name = 'Frodo';
<h1>Dashboard for </h1>
Hello, 

In Other News

What is AI - MIT Technological Review

When asked if AGI would be achieved, Jensen Huang, CEO and Founder of NVIDIA, responded, "That depends on if you can define AGI." This made me realize that if AGI cannot be defined, it cannot be achieved. This article, however, poses an even more fundamental question: what is AI? Has it now become synonymous with ChatGPT?

It’s math—a hell of a lot of math. Nobody disputes that. But is it just that, or does this complex math encode algorithms capable of something akin to human reasoning or the formation of concepts?

AI Updates for the month

• Llama 3.1 - Meta open sourced three models - 8B, 70B and the largest 405B. The license structure was also changed so that other models can be trained on Llama outputs.
• Mistral Large 2 - An update to their flagship model that supports dozen languages and 128k context window.
• Midjourney 6.1 - More coherent images and better image quality.
• Github Models - You can now experiment with open source AI models for free with GitHub codespaces.
• SearchGPT - OpenAI's new competitors mirroring Google AI overview and Preplexity, currently with a waitlist.
• GPT 4o Mini - OpenAI's new cost-efficient model that performs sufficiently well on most benchmarks.

Switzerland mandates software source code disclosure for public sector: A legal milestone

Switzerland has enacted the "Federal Law on the Use of Electronic Means for the Fulfilment of Governmental Tasks" (EMBAG), establishing a mandatory requirement for open source software within public sector bodies. I hope more countries adopt this approach of open source for public.

Intel is laying off over 15,000 employees and will stop ‘non-essential work’

First, Apple transitioned to their M1 chips. Now, Windows is following suit with Qualcomm ARM chips. AMD is outperforming Intel in almost all use cases with their new Zen 5 chips. While we knew Intel was struggling, the situation escalated quickly, leading to a stock freefall and marking its worst day in the market.

Looking Ahead

• React Rally - August 12-14