JSer.info #531 - Safari Technology Preview 122がリリースされました。
Safari Technology Preview 122では色々な機能が実装されています。
実験フラグ付きでCSS :focus-visibleとCSS Color 5のcolor-mix()/color-contrast()/Relative color syntaxが実装されています。
ES Proposal Stage 3のPrivate method、Static private methods、Top-Level await、RegExp Match Indicesのサポート。
Web WorkerとService Workerでtype: moduleをサポート、Paint Timingの(再)有効化なども含まれます。
Safariとは直接関係しませんが、2021年6月ごろにリリースされる予定のECMAScript 2021のリリース候補も公開されています。
SvelteKitのソースコードが公開されています。
SvelteKitはSvelteベースのNext.jsライクなフレームワークであったSapperを置き換える目的で作られています。
まだソースコードの公開だけでリリースはされていません。
What is SvelteKit? | SK Incognitoというチュートリアルサイトでは、SvelteKitがどのようなものか紹介されているので、興味がある人は見てみるといいかもしれません。
React Native 0.64がリリースされました。
AOTによる事前コンパイルでfootprintを最適化してアプリの起動速度などを改善する目的であるHermes JS EngineがiOSでも利用可能になっています。
また、HermesにES2015のProxy objectのサポートが追加されています。
その他には、MetroでInline Requiresがデフォルトで有効化、React 17へアップデートなどが含まれています。
JSer.infoをサポートするには
- 😘 知り合いにJSer.infoをおすすめする
- ❤️ GitHub Sponsorsで@azuのスポンサーになる
- 🐦 X(Twitter)で@jser_infoをフォローする
JSer.info Sponsors
JSer.info SponsorsはGitHub SponsorsとしてJSer.infoを支援してくれている方々です。
ヘッドライン
Release v0.9.0 · evanw/esbuild
github.com/evanw/esbuild/releases/tag/v0.9.0
esbuild 0.9.0リリース。
package.jsonのexportsフィールドのサポート、esbuild.startService() APIの削除、bannerとfooterを言語ごとに指定できるように
Release Notes for Safari Technology Preview 122 | WebKit
webkit.org/blog/11577/release-notes-for-safari-technology-preview-122/
Safari Technology Preview 122リリース。
実験フラグ付きでCSS :focus-visibleとCSS Color 5の実装を追加。
ES ProposalのPrivate method、Top-Level await、RegExp Match Indicesのサポート。
Workerでtype: moduleをサポート、Paint Timingの有効化など
Chromium Blog: Chrome 90 Beta: AV1 Encoder for WebRTC, New Origin Trials, and More
blog.chromium.org/2021/03/chrome-90-beta-av1-encoder-for-webrtc.html
Chrome 90 Betaリリース。
AV1 Encoderのサポート。
Origin TrialとしてgetCurrentBrowsingContextMedia()、Breakout Box、WebAssembly Exception Handlingのサポート。
CSSのaspect-ratioとwidthかheightが指定されているときに推論されるように、:state、overflow: clipのサポート。
Feature-Policyに代わるPermissions-Policy、StaticRangeのサポートなど。
navigator.pluginsとnavigator.mimeTypesが空要素を返すようになるなど
Announcing React Native 0.64 with Hermes on iOS · React Native
reactnative.dev/blog/2021/03/12/version-0.64
React Native 0.64リリース。
iOSでもJSエンジンのHermesを利用可能に、MetroでInline Requiresがデフォルトで有効化、HermesがES Proxyのサポート、React 17へアップデートなど
sveltejs/kit: A monorepo for SvelteKit and friends
SvelteKitのソースコードが公開された
Release ES2021 Candidate March 2021 · tc39/ecma262
github.com/tc39/ecma262/releases/tag/es2021-candidate-2021-03
ECMAScript 2021のリリース候補が公開された。ECMAScript 2021に入る予定の機能は決定され仕様もフリーズされたため、masterブランチはES 2022となった
Socket.IO 4.0.0 | Socket.IO
socket.io/blog/socket-io-4-release/
Socket.IO 4.0.0リリース。
破壊的な変更としてサーバ側のio.to()がimmutableに変更、protocolは互換性を維持している。
pingTimeoutのデフォルト値を5秒から20秒へ変更、Utilityメソッドの追加、autoUnrefオプションの追加など
- Migrating from 3.x to 4.0 | Socket.IO
- fix: set default protocol version to 3 to allow backward compatibilit… by simonemazzoni · Pull Request #616 · socketio/engine.io
アーティクル
Debugging layout shifts
web.dev/debugging-layout-shifts/
Layout Instability APIでのCumulative Layout Shift (CLS)の計測とCLSの特定とデバッグ方法について
Digging Into CSS Logical Properties
ishadeed.com/article/css-logical-properties/
RTLに対応したCSSの書き方とmargin-inline-endについて。
レシピサービスのフロントエンドに CSS in JS を採用した話 - クックパッド開発者ブログ
techlife.cookpad.com/entry/2021/03/15/090000
emotionを使ったCSS-in-JSについて。
styled-componentsの記法ではなくString Stylesを採用した理由、stylelintを使ったLint、Jestを使ったスナップショットテストについてなど
JavaScript: What is the meaning of this?
いろいろなケースのthisの意味について解説している記事
Beyond Console.log() – Level up Your Debugging Skills - SitePoint
www.sitepoint.com/beyond-console-log-level-up-your-debugging-skills/
Console APIやChrome DevToolsを使ったデバッグについての記事。
ログフォーマット、Console APIの紹介、Dev Tools上で使える関数、Overrides、VScodeとの連携についてなど
The Death of a Node.js Process - Thomas Hunter II
thomashunter.name/posts/2021-03-08-the-death-of-a-nodejs-process
Node.jsにおけるプロセス終了とエラーについて。
uncaughtException、unhandledRejectionでのエラーのキャッチとprocess.exitでのプロセス終了方法。
また、Signalとそれをハンドリングできるかどうかについてのまとめ
サイト、サービス、ドキュメント
Post-Spectre Web Development
w3c.github.io/webappsec-post-spectre-webdev/
Spectre以後のウェブ開発における脅威モデルと戦略についてのドキュメント。
Isolation、サブリソース、クロスオリジンを意図した操作についてなど
What is SvelteKit? | SK Incognito
sk-incognito.vercel.app/learn/what-is-sveltekit
SvelteKitのチュートリアルサイト
ソフトウェア、ツール、ライブラリ関係
Cloud9c/taro: A lightweight 3D game engine for the web.
three.jsとcannon-esを使った3Dゲームエンジンライブラリ
rsms/estrella: Lightweight and versatile build tool based on the esbuild compiler
esbuildとtscのラッパーツール。
esbuildでビルドしながら、tscでの型チェックを同時に実行できるビルドツール
