JSer.info #545 - Node.js向けのHTTPクライアントであるUndici 4がリリースされました。

Introducing Undici@4. After a few years since the first… | by Node.js | Jun, 2021 | Medium
Release v4.0.0 - Unified API, Docs Site, WASM, Redirect and Mocking · nodejs/undici

Undiciは、Node.jsのhttpの代わりとして使えるように、netやtlsを使って一から書き直されているHTTPクライアントです。

It’s implemented from scratch. The old client cannot be due to inefficient design of the internals, as well as years of maintaining legacy APIs!
— Matteo Collina (@matteocollina) February 15, 2021

Undici 4.0では、Node.js 10のサポートが終了されています。
HTTPパーサにllhttpのWasmビルドを利用、maxRedirectionsでのリダイレクトサポート、nockをインスパイアしたモックのサポートなどが含まれています。

また、4.0にあわせて https://undici.nodejs.org/ にウェブサイトが公開されています。

Next.js 11がリリースされました。

Blog - Next.js 11 | Next.js

Next.js向けの設定でLintをするnpx next lintというESLintの連携が追加されています。

Basic Features: ESLint | Next.js

パフォーマンス改善、Scriptロードコンポーネントのnext/scriptを追加、next/imageで自動で画像サイズの判定やプレースホルダーの設定ができるようになっています。
また、webpack 5がデフォルトとなっています。

その他には、Create React Appからのマイグレーションツールも公開されています。

Safari 15 Beta相当のSafari Technology Preview 126がリリースされています。

Safari 15 Betaでは、次のような変更が含まれています。

HTMLでは、autocomplete=one-time-codeの対応、theme-color属性とmedia属性のサポートなど
JavaScriptでは、Top-Level await、WorkerでのESMサポート、Error Causeのサポートなど
CSSでは、Box要素でのaspect-ratioのサポート、lab()/lch()/hwb()のカラー構文のサポートなど
Mediaでは、MediaSession API、iPadでVP9とWebMのハードウェアアクセラレーションが有効化、WebMでOpusコーデックをサポートなど。
Security & Privacyでは、アドレスバーでURLを入力する際にhttps://をデフォルトにする変更など
- Chrome 90でも同様の変更が含まれている
WebAssemblyでは、Streaming compilationとReference typesのサポートなど
その他には、WebGL 2とWeb Share Level 2のサポートなど

また、iOSとiPadOSでSafariの拡張をサポートし、declarativeNetRequest APIの実装なども含まれています。

JSer.infoをサポートするには

😘 知り合いにJSer.infoをおすすめする
❤️ GitHub Sponsorsで@azuのスポンサーになる
🐦 X(Twitter)で@jser_infoをフォローする

JSer.info Sponsors

JSer.info SponsorsはGitHub SponsorsとしてJSer.infoを支援してくれている方々です。

ヘッドライン

Wasmer 2.0, Its a big deal!

wasmer.io/posts/wasmer-2.0

WebAssembly ReleaseNote

WebAssembly RuntimeのWasmer　２．０リリース。
SIMD、Reference Typesへの対応、パフォーマンスの改善など。

Release 2.0.0 · wasmerio/wasmer

Introducing Undici@4. After a few years since the first… | by Node.js | Jun, 2021 | Medium

nodejs.medium.com/introducing-undici-4-1e321243e007

node.js ReleaseNote

Node.js向けのHTTPクライアントあるUndici 4リリース。
Node.js 10のサポート終了、ウェブサイトの公開。
HTTPパーサにllhttpのWasmビルドを利用、maxRedirectionsでのリダイレクトサポート、nockをインスパイアしたモックのサポートなど

Release v1.0.0 · pmndrs/jotai

github.com/pmndrs/jotai/releases/tag/v1.0.0

JavaScript library ReleaseNote React

React向けのステート管理ライブラリのJotai 1.0.0リリース。

Release v1.6.0 : RTK Query! · reduxjs/redux-toolkit

github.com/reduxjs/redux-toolkit/releases/tag/v1.6.0

redux library ReleaseNote

redux toolkit 1.6.0リリース。
別プロジェクトとして開発していたRTK(Redux Toolkit) Queryが同梱された。

Blog - Next.js 11 | Next.js

nextjs.org/blog/next-11

Next.js ReleaseNote

Next.js 11リリース。
ESLint連携、パフォーマンス改善、Scriptロードコンポーネントのnext/scriptを追加、next/imageで画像のサイズを検出して設定できるように、webpack 5がデフォルト化。
Create React Appからのマイグレーションツールも公開されている。

Basic Features: ESLint | Next.js

Release Notes for Safari Technology Preview 126 with Safari 15 Features | WebKit

webkit.org/blog/11727/release-notes-for-safari-technology-preview-126-with-safari-15-features/

safari ReleaseNote

Safari Technology Preview 126リリース。
Safari 15相当の変更を含む。
autocomplete=one-time-codeの対応、theme-colorとmediaのサポート。
JavaScriptではTop-Level await、WorkerでのESMサポート、Error Causeのサポートなど。
MediaSession API、iPadでVP9とWebMのハードウェアアクセラレーションが有効化、WebMでOpusコーデックをサポートなど。
WebAssemblyのStreaming compilationとReference typesのサポートなど。
また、WebGL 2とWeb Share Level 2のサポートなど。
その他には、iOSとiPadOSでSafariの拡張をサポートし、declarativeNetRequest APIの実装など

Tailwind CSS v2.2 – Tailwind CSS

blog.tailwindcss.com/tailwindcss-2-2

CSS library ReleaseNote

Tailwind CSS v2.2リリース。
JITモードの変更、CLIを書き直して--watchなどのサポート。
JITモードで、before/after/ first-letter/first-lineなどの疑似要素のサポート。
また、selectionやmark variantのサポート、color:などのtypeをつけることで柔軟な値指定ができるようになるなど

Release v2.2.0 · tailwindlabs/tailwindcss

Release 3.15.0 - 2021.06.21 · zloirock/core-js

github.com/zloirock/core-js/releases/tag/v3.15.0

JavaScript polyfill library ReleaseNote

core-js 3.15.0リリース。
RegExpのnamed capture group、dotAllフラグのサポート、組み込み用のJavaScriptエンジン向けなどにAnnex Bの機能polyfillを追加など

アーティクル

A Visual Guide to NodeJS Streams. In NodeJS, stream module provides the… | by Deepal Jayasekara | Jun, 2021 | Deepal’s Blog

blog.insiderattack.net/a-visual-guide-to-nodejs-streams-9d2d594a9bf5

node.js stream article

Node.jsのStreamについての解説記事。
Reaable. Writable, Duplex, Transform, Piping Streamについてそれぞれ図とともに動作を紹介している。
また、back pressureとhighWaterMarkについて

CSS System Colors - Jim Nielsen’s Blog

blog.jim-nielsen.com/2021/css-system-colors/

CSS article

文字色と背景色のLight/Darkモードの切り替え対応はOSのシステムカラーを扱うcolor-scheme: light dark;とシステムカラーを指定できるCanvas値を使って対処する話

Benchmarking JavaScript Memory Usage - WebPageTest Blog

blog.webpagetest.org/posts/benchmarking-javascript-memory-usage/

JavaScript article performance

performance.measureUserAgentSpecificMemory()でのメモリ使用量の取得と他のメトリクスとメモリ使用量に相関についての記事。
ページロード時においての、JavaScriptのサイズがメモリ使用量と相関関係の調査、各種フレームワークを利用しているサイトごとのメモリ使用量の調査など