JSer.info #554 - MDNなどが利用するブラウザ実装の互換データを管理している @mdn/browser-compat-data 4.0.0がリリースされました。

Release v4.0.0 · mdn/browser-compat-data

互換リストにDenoのデータが追加されています。

Deno on MDN | Deno Blog

スキーマにpreviewとaccepts_flagsの追加、XPathとXSLTのデータが不完全であるため削除などの変更も含まれています・

The State Of Mobile First and Desktop First - Ahmad Shadeedという記事では、CSSを書くときにMobileとDesktop向けのどちらを先に書くかについて書かれています。

MobileとDesktopのどちらかを先に書いて、もう一方をMedia Queryで上書きしたときのコード量や拡張性の違いについて比較しています。
また、ベースに加えてMobileとDesktopの対応をそれぞれ書いた場合の難しい点についても書かれています。
発展としてFlexboxやCSS Grid、Container Queriesなどの新しいCSS機能を使うことでより簡単に書けるようになっている話なども含まれています。

From Create-React-App to Next | Kitty Giraudelという記事ではCreate React App(CRA)からNext.jsへの移行をどのようにしたかについて書かれています。

<head>やスタイリングなどの項目ごとに、CRAからNext.jsにどのように移植したのかが書かれています。
また移行後に<Link>以外はどちらの環境でも実行できたため、移行の動作確認として両方の環境で動かしてテストする方法についても書かれています。

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

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

JSer.info Sponsors

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

ヘッドライン

Announcing React Native 0.65 · React Native

reactnative.dev/blog/2021/08/17/version-065

React iOS Android

React Native 0.65リリース。
Hermes 0.8にアップグレードし、Hadesというガベージコレクタの実装、ECMAScript i18n APIのサポート、Apple M1のサポートなど。

Release v9.1.0 · mochajs/mocha

github.com/mochajs/mocha/releases/tag/v9.1.0

node.js testing library ReleaseNote

Mocha 9.1.0リリース。
--fail-zero、--node-optionのサポート、JSONレポーターの追加など

Release Notes for Safari Technology Preview 130 | WebKit

webkit.org/blog/11958/release-notes-for-safari-technology-preview-130/

safari ReleaseNote

フラグ付きでArray.prototype.findLastとArray.prototype.findLastIndexのサポート、WebAudioでWebM/Opusコンテナのサポートなど

Release v4.0.0 · mdn/browser-compat-data

github.com/mdn/browser-compat-data/releases/tag/v4.0.0

mdn JavaScript library ReleaseNote

MDNなどで使われるウェブ技術の互換性リストであるbrowser-compat-data 4.0.0リリース。
スキーマにpreviewとaccepts_flagsの追加、Denoを追加、XPathとXSLTのデータが不完全であるため削除など

Deno on MDN | Deno Blog

The npm registry is deprecating TLS 1.0 and TLS 1.1 | The GitHub Blog

github.blog/2021-08-23-npm-registry-deprecating-tls-1-0-tls-1-1/

npm Github security news

npm registryでTLS 1.0とTLS 1.1を非推奨化し、2021年9月29日でサポートを終了する予定。
Node.js 0.10.0未満のバージョンを使っているケースやカスタムしたバイナリを使っているケースが対象となるがすでに99%はTLS 1.2を利用しているとのこと。

アーティクル

The State Of Mobile First and Desktop First - Ahmad Shadeed

ishadeed.com/article/the-state-of-mobile-first-and-desktop-first/

CSS article

CSSを書くときにMobileとDesktop向けのどちらを先に書くかについて。
MobileとDesktopのどちらかを先に書いて、もう一方をMedia Queryで上書きしたときのコード量や拡張性の違いについて。
また、ベースとそれぞれを書いた場合やFlexboxやContainer Queryといった最近の機能を使って書いた場合についてなど

mouseover 中に表示される DOM のデバッグ | blog.jxck.io

blog.jxck.io/entries/2021-08-20/how-to-debug-mouseover.html

DOM debug article

mouseover中に表示されるDOM要素を開発者ツールでデバッグする方法について

'return await promise' vs 'return promise' in JavaScript

dmitripavlutin.com/return-await-promise-javascript/

Promises JavaScript article

return await promiseとreturn promiseで動作が異なるケースについて。
try...catchで囲まれている場合には、awaitによってthrowされると結果が異なる

複数リポジトリ間におけるeslint・prettierの設定共通化 - LIVESENSE ENGINEER BLOG

made.livesense.co.jp/entry/2021/08/24/083000

ESLint article

ESLintの設定を社内で共有管理するために、scoped packagesとして公開して利用方法について

Why WASM is not the future of Babylon.js | by Babylon.js | Aug, 2021 | Medium

babylonjs.medium.com/why-wasm-is-not-the-future-of-babylon-js-5832b09c9b10

WebAssembly article JavaScript

WebAssemblyはC++などのネイティブな言語をコンパイルして利用するのが目的であるため、TypeScriptで書かれたBabylon.jsをWasmにする正当な理由がまだないという話。
WasmとJS間のコミュニケーションコストやデバッグが難しい、メモリ管理なども含むためサイズが大きくなるなどの問題点について。
また、Babylon.jsの物理エンジンなどの一部領域ではWasmをすでに利用していることなどについても書かれている。

From Create-React-App to Next | Kitty Giraudel

kittygiraudel.com/2021/08/24/from-cra-to-next/

React Next.js article

Create-React-Appで書かれていたアプリをNext.jsに移行した話。
ボイラープレート、<head>、ルーティング、コンポーネントのDynamic Import、Styling、CSR/SSR、Lintなどについて。
また<Link>以外はどちらの環境でも実行できたため、移行の動作確認として両方の環境で動かしてテストする方法について