‘It’s a miracle anything about this ecosystem works at all.’

#​637 — May 4, 2023

Read on the Web

Psst.. if you’re wondering about the context of today’s subject line, see the first ⚡️ In Brief.

JavaScript™ Weekly

Angular v16 Released — With the “biggest release since the initial rollout of Angular”, v16 of the extensive framework introduces a preview of a new signals-based reactivity model (a.k.a. Angular Signals), RxJS interop, improved SSR and hydration, experimental esbuild support, Jest unit testing, and more.

Minko Gechev

???? See the end of this issue where Minko makes the case for Angular in 2023.

Qwik Reaches v1.0 — In “other big JS frameworks that aren’t React” news, Qwik has hit a major milestone too. Qwik’s selling point remains performance through serving up as little code as needed on initial page load. “Think of it as streaming for your JavaScript,” they say. Nonetheless, you get the JSX, directory-based routing, and middleware options you may be familiar with.

Qwik Team

Bring Your Team from Zero to 100 Deploys a Day — Curious about how companies such as Atlassian, Google, and Netflix deploy hundreds of times a day? What strategies do they use to achieve efficiency? This guide provides you with tips and tricks on how these companies scaled their deployments so that you can do the same.

Sleuth sponsor

????????  The German Government Invests in JavaScript — Sort of. Germany’s Sovereign Tech Fund has made a big investment in the OpenJS Foundation, a Linux Foundation project that supports the JS ecosystem and hosts projects including Electron, jQuery, Node.js, Node-RED, and webpack.

Robin Ginn (OpenJS Foundation)

⚡️ IN BRIEF:

Mark Erikson (Redux) wrote a Twitter thread about ???? things he has to keep in mind when publishing a library in 2023 – it’s a lot. He summarized: “It’s a miracle anything about this ecosystem works at all.”

We plan to write about this in a future issue, but Deno KV is a new in beta key value store now baked into both the Deno runtime (as of Deno 1.33) and available in the cloud.

The latest VS Code release is out, with improvements to the terminal, new default dark and light color themes, support for profile templates, a built-in color picker, and support for strict nulls for JavaScript in HTML script blocks.

A roundup of what’s new in the Svelte world.

Node.js can now run on every major browser engine as WebContainers now run on Safari, iOS and iPadOS, as well as Chrome and Firefox. Live demo.

Chrome is to replace the ???? icon in the location bar with a vaguer ‘tune’ icon.

Popular app hosting platform Vercel has added three new first-class storage options for files, Postgres databases, and Redis-like key/value stores.

RELEASES:

Capacitor 5.0 – Build cross-platform native PWAs.

Node.js v20.1.0 (Current)

pnpm 8.4 – Efficient package manager.

React Native macOS 0.71

Electron 24.2

???? Articles & Tutorials

A Practical Guide to Not Blocking the Event Loop — Engines typically run JavaScript in a single thread with an event loop. However, the nature of mixing synchronous and asynchronous tasks, along with the increasing popularity of workers for running code on separate threads, makes the landscape harder to navigate than it used to be.

Slava Knyazev

The Interactive Guide to Rendering in React — An interactive, illustrated guide exploring why, when and how React renders, complete with a series of well thought out animations.

Tyler McGinnis

Breakpoints and console.log Is the Past, Time Travel Is the Future — 15x faster JavaScript debugging than with breakpoints and console.log, supports Vitest, jest, karma, jasmine, and more.

Wallaby.js sponsor

The const ‘Deception’ — If the exact role of const has confused you in the past, this will be a handy primer that digs into the distinction between “assignment” and “mutation” in JavaScript.

Josh W Comeau

Write Better CSS by Borrowing Ideas from JS? — A curious look at taking best practices from the JavaScript space for writing better CSS.

Yaphi Berhanu

Crafting the Next.js Website — The official Next.js site is impressive, but what went into it? One of the designers shares some of the implementation details which aren’t particularly React-y but may prove inspiring to you.

Rauno Freiberg

Exposing a Rust Library to Node with NAPI-RS

John Murray

???? Code & Tools

date-fns 2.30: A Modern Date Utility Library — It’s been a couple of years since we linked to this “lodash for dates” that’s packed with over 200 date and time manipulation functions, but it continues to get updates and a v3 is on the way. GitHub repo.

Sasha Koss

Chart.js 4.3: Canvas-Based Charts for the Web — One of those libraries that feels like it’s been there forever but still looks fresh and continues to get good updates. Bar, line, area, bubble, pie, fonut, scatter, and radar charts are all a piece of cake to render. Samples and GitHub repo.

Chart.js Contributors

Beautiful Security and License Compliance Reports for Your App’s Dependencies — Free & Open Source: Try the Better NPM Audit for Your App Now.

Sandworm․dev sponsor

Axios 1.4: Promise-Based HTTP Client for Browser and Node — A long standing project and still getting frequent updates despite rapidly being seen as the ‘jQuery of HTTP request libraries.’ If you need it, you’ll know.

Matt Zabriskie

Marked.js 5.0: A Fast Markdown Parser and Compiler — A low-level Markdown compiler built for speed and available as a client-side library, server-side library, and even a CLI. v5.0 deprecates some options in favor of using external plugins. Here’s a live demo.

Christopher Jeffrey

Mock Service Worker 1.2: REST/GraphQL API Mocking Library — Intercepts requests which you can then mock. Capture outgoing requests using an Express-like routing syntax, complete with parameters, wildcards, and regexes. GitHub repo.

Artem Zakharchenko

The Fastest JavaScript Data Grid Component

Bryntum Grid sponsor

Pretty TypeScript Errors: Make Errors Prettier and Human-Readable in VS Code

Yoav Balasiano

next-sitemap: Sitemap Generator for Next.js Apps

Vishnu Sankar

???? Jobs

Team Lead Web Development — Experienced with Node, React, and TS? Join us and lead a motivated team of devs and help grow and shape the future of our web app focused on helping millions explore the outdoors.

Komoot

Find JavaScript Jobs with Hired — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now.

Hired

????‍???? Got a job listing to share? Here’s how.

QUICK RELEASES:

Tremor 2.4 – React library to build dashboards.

oclif 3.9 – Node.js CLI app framework.

github-script 2.1 – GitHub Actions workflows in JS.

Highlight.js 11.8 – Syntax highlighter.

Plotly.js 2.22 – Data visualization library.

ngx-stripe 16.0 – Angular wrapper for Stripe Elements.

???? A quick word from Angular’s Minko Gechev

When Minko reached out to remind us of the Angular v16 launch, we decided we’d remind him that most JavaScript Weekly readers aren’t using Angular (sorry Minko!) but to ask if he’d like to make the case as to why JavaScript developers shouldn’t sleep on Angular in 2023. Here’s what he had to say:

The problem in the JavaScript ecosystem we’re solving with Angular is to provide a reliable, integrated solution that gives you all the core libraries and tools you need to focus on building apps, rather than fixing incompatible dependencies/API changes, etc. I understand that’s what most technologies claim, the difference with Angular is that:

We’re testing all core modules such as framework, router, forms, etc. on over 4,000 Google projects on every commit to guarantee stability and integration.
We’re sharing updates in a predictable release schedule (twice a year) where we evolve everyone via the same mechanism we use to keep every project at Google to the HEAD commit on the main branch on GitHub. It’s integrated as part of the ng update command of the CLI.

With the recent updates we’ve been:

Catching up with some of the use cases we were missing.
Advancing the performance and developer experience, while setting the foundation for more advancements throughout 2023 and 2024.

On the second point, we’re expecting lots of more improvements in reactivity and SSR in the next 12 months.

So there you have it.

NodeForest Status Report – Earth Day Project

In an effort to mitigate our environmental impact and increase awareness among Nodesourcers, NodeSource collaborated with Pal/Projectability to conduct a tree-planting activity in 2022. The initiative was a resounding success, resulting in the planting of a forest called __NodeForest__, which exceeded the original target by 52%.

Read the previous blog-post here ???????? https://nodesource.com/blog/Nodeforest-experience

Ensuring the sustainability of the plantation is a critical aspect of this project. As such, one year after the tree-planting activity was conducted, this report serves to provide a follow-up on the growth of the trees and ensure that they are thriving under optimal conditions.

How are the status of #NodeForest today?

The maintenance of the newly planted trees has been managed by the village aqueduct __AVEZA__, who owns the conservation lands where the trees were planted. We are pleased to report that all trees have been growing in healthy conditions, as verified on-site. These trees represent an important step towards environmental sustainability, and we are committed to ensuring their continued growth and health.

Img 1 – NodeForest

Note: The images are obtained from the rural community that lives in the area.

The Incredible Impact of our Tree Planting Program ‘NodeForest’

During the first year of planting, the estimated impacts are significant.

Img 2 – Individuals In Flowering Stage

Firstly, each tree has the potential to absorb between 16 to 24 kg of carbon dioxide per year, resulting in an average capture of 3 to 4 tons of CO2 during the first year.
Secondly, each tree can provide habitat for around 7 to 10 different species, benefiting more than 1,200 fauna individuals in the area and promoting biodiversity.
Thirdly, trees can prevent erosion by fixing 30% of the runoff water and retain approximately 130 liters of water per year, contributing to the retention of more than 20,000 liters of water annually.

Additionally, the planting will enhance the visual landscape and microclimate of the area and lastly, the planting will have a positive social impact, directly contributing to the production of water for the village aqueduct serving more than 816 families in the region.

Moreover, this initiative create environmental awareness among our NodeSourcers ????.

To locate the planting location, please follow this link: https://goo.gl/maps/8BgLkKpUcg3JHibS7.

Growing a Green Culture: Our Company’s commitment to NodeForest

In NodeSource, we are committed to promoting an environmental culture among our stakeholders that is focused on conserving the planet for current and future generations.

To further promote our organizational environmental culture, we have planned a variety of activities. These include:

Intensifying our tree planting efforts.
Organizing river and stream cleaning days.

Additionally, we have established policies to compensate for our environmental impact, such as the comparison of carbon credits to support specific projects. We are dedicated to making a positive impact on the environment and are continually seeking ways to improve our efforts.

Making Every Day Earth Day – N|Solid

The use of technology has significantly increased the amount of data that is produced and stored. This has led to an increase in energy consumption and a larger carbon footprint.

However, there are solutions available that can help reduce this overhead. A more sustainable future begins with more efficient software; N|Solid is one such solution that enables efficient applications, which in turn reduces energy consumption and lowers costs. By consuming less cloud resources, businesses can help decrease their digital footprint, contributing towards a more sustainable future.

It’s important to note that every effort counts towards this cause , and small changes can make a big difference. #InvestInOurPlanet @Earthday

NodeForest by NodeSource

If you felt inspired by this #NodeForest story. We invite you to create an N|Solid account and helping us to create a forest that will further mitigate the environmental impact of using the Internet and its servers. Remember that with N|Solid, you can observe and have control of your processes to produce more efficient software.

Just give us the green light here, and we’ll plant a tree in your name. ???? ???? #NodeForest by NodeSource

Suggested Resources for ‘EarthDay’

Earth Observatory by NASA – https://earthobservatory.nasa.gov/

Celebrate Earth Day, Digital skills by Google: https://applieddigitalskills.withgoogle.com/c/en/earth-day