What's new in ES2022, JS1024 Results, Chrome 93, Firefox 91, Polypane 6.3

NOTE: This is issue #039 of my newsletter, which went live on Monday, September 6th. If you find this information useful and interesting and you want to receive future issues as they are published, ahead of everyone else, I invite you to join the subscriber list at frontendnexus.com.

Hey everyone and welcome to another round of Front End News. I am not back yet to the normal schedule - I am planning that for next month. There are more details about that at the end of the article. And I'm going to share more details about the things happening behind the scenes in the newsletter version (wink wink nod nod).

In this issue, we're taking a look at the new things coming in ES2022. We have the results of the JS1024 code challenge. There are updates from many browsers: Chrome 93, Firefox 91, Polypane 6.3, and four updates of Safari Technology Preview (from 128 to 131). The section on updates and releases is huge, with packages like Deno 1.13, Electron 14.0.0, Mongoose 6.0.0, TypeScript 4.4, Yarn 3.0, NodeJS, and many, many more.

What's new in ES2022?

ECMAScript specs are not the most readable documents. So it helps when people help condense and refine the information in a format easier to understand. This is the case with the elements that were included in ES2022, presented to us by Yagmur C. Tas. Here is a brief synopsis of what's coming to us next year:

Class Fields
- Class Public Instance Fields & Private Instance Fields
- Private instance methods and accessors
- Static class fields and private static methods
Ergonomic brand checks for Private Fields
RegExp Match Indices
Top-level await

Of course, there is a lot more detail in the article, with plenty of references to other sources. Enjoy!

what's new in es2022?

JS1024 Results

I've mentioned JS1024 not too long ago, in issue 036. We now have the results, and there are some awesome creations in this year's crop. Definitely worth having a look at.

JS1024 Results

Browser news

Chrome

Chrome 93 is rolling out to users and this update brings some fancy new features. You can now load CSS Modules using import statements, you can manage multiple displays with the Multi-Screen Window Placement API. This is also the start of the new release cycle, where Chrome 94 will ship out in 4 weeks instead of 6 as it did so far.

New in Chrome 93

As usual, there are plenty of changes in the DevTools as well. You can edit container queries directly in the Styles panel. Web Bundles can be previewed in the Network panel. You can measure performance with Lighthouse 8.1, and a lot more. Make sure to check the guide linked below.

What's New In DevTools (Chrome 93)

We're also getting a preview of the upcoming changes for DevTools in Chrome 94. You will be able to work using your own language, out of over 80 options. Elements with container queries now have a container label. And so much more. You can already give these changes a try using the Canary release.

What's New In DevTools (Chrome 94)

Firefox

Firefox users are also getting an update to version 91. Now all private browsing windows will automatically attempt to make all connections to websites secure. Connections will fall back to HTTP if the website does not support HTTPS. The ‘increased contrast’ setting enables High Contrast mode on macOS. Last but not least, developers can now use Visual Viewport API and some more additions to the Intl.DateTimeFormat object.

Hopping on Firefox 91

Polypane

We have a new release from Polypane as well. It brings new tools like the tunnel vision simulator, support for Web Manifest, better performance, and some UI changes (the most important one being the relocation of the reload button).

Polypane 6.3: Tunnel vision simulator, web manifest support, updated UI

WebKit

The WebKit team has been very busy during this time. They released no less than four updates to the Safari Technology Preview. That's too much for even a summary, so I'll invite you instead to check the release notes.

Software updates and releases

As expected, there are a lot of updates for some well-known libraries (and some less known, but quite interesting). Packages like Deno 1.13, Electron 14.0.0, Mongoose 6.0.0, TypeScript 4.4, Yarn 3.0, and many, many more. I even had to make a separate section for NodeJS updates.

Angular 12.2.0 - a development platform for building mobile and desktop web applications
Bootstrap 5.1.0 - the world’s most popular front-end open-source toolkit
Capacitor v3.2.0 - cross-platform apps with JavaScript and the Web
Cypress v8.3.0 - fast, easy, and reliable testing for anything that runs in a browser
Deno 1.13 - a secure JavaScript and TypeScript runtime
drift v1.5.0 - add "zoom on hover" functionality to your site's images
Electron 14.0.0 - Build cross-platform desktop apps with JavaScript, HTML, and CSS
Ember.JS v3.28.0 - a JavaScript framework for creating web applications
Hugo 0.86.0 - a fast and flexible static site generator built using Go
Hugo 0.87.0
Jasmine 3.9.0 - simple JavaScript testing framework for browsers and node.js
JavaScript Cookie v3.0.0 - A simple, lightweight JavaScript API for handling browser cookies
jest v27.1.0 - Delightful JavaScript Testing
JZZ v1.4.0 - MIDI library for Node.js and web-browsers
marked v3.0.0 - a markdown parser and compiler. Built for speed
mocha v9.1.0 - a simple, flexible, fun javascript test framework for node.js and the browser
Mongoose 6.0.0 - MongoDB object modeling designed to work in an asynchronous environment
Neutralinojs v2.7.0 - Portable and lightweight cross-platform desktop application development framework
Next.js 11.1 - the React Framework
on-change v4.0.0 - Watch an object or array for changes
OpenPGP.JS v5.0.0 - OpenPGP implementation for JavaScript
react-markdown 7.0.0 - markdown component for React
relay v12.0.0 - a JavaScript framework for building data-driven React applications
Scala.js 1.7.0 - the Scala to JavaScript compiler
socket.io v4.2.0 - Realtime application framework (Node.JS server)
svgo v2.4.0 - Node.js tool for optimizing SVG files
TypeScript 4.4
V8 release v9.3
VSCode July 2021 (version 1.59) - open source code editor
Vue 3.2 - a JavaScript framework for building UI on the web
ws v8.0.0 - a WebSocket client and server for Node.js
Yarn 3.0 - fast, reliable, and secure dependency management for JavaScript

NodeJS

I need to make a special mention for NodeJS, for there are too many updates to include in the normal listing. The Current channel went from 16.6.0 to 16.8.0, the Long Term Support (LTS) channel covered versions 12.22.4 - 12.226 and 14.17.4 - 14.17.6, and don't forget about the July and August security updates. You can see the full list of updates on the official blog:

NodeJS News from 2021

Wrapping things up

I decided to make this update for a couple of reasons. First, I wanted to cover some of the updates that have happened since the last issue. The alternative would have been a monster update and that's always hard to digest. Just look at the size of the Software Updates section.

Second, I wanted to do a live test for the changes I made to the website. I replaced a lot of hardcoded elements with functionality from Eleventy. And the most important update I made is moving the hosting from Media Temple to Netlify. I simply love the ability to deploy automatically from GitHub. There's no way I am going back to uploading files via FTP.

That's about all I have for this update. Have a great and productive time, keep yourselves safe, and I will see you again in a few weeks!