Fork me on GitHub

2023-01-24のJS: Bun v0.5、Remix v1.11.0、メモリリークの調査

Edit on GitHub 編集履歴を見る

JSer.info #628 - Bun v0.5がリリースされました。

package.jsonworkspacesを使ったインストールをサポートしています。
Node.jsとの互換性としてnode:dnsnode:tlsnode:netnode:readlineのサポートが追加されています。
また、モジュール解決時の識別子の優先度の変更なども含まれています。


Remix v1.11.0がリリースされました。

deferを使ってレスポンス待ちを減らせるように、@remix-run/css-bundleでのCSSファイルのロード、CSS Modules、Vanilla Extractのサポートが追加されています。
また、Remix v2で導入予定のFlat Routesをopt-inで利用できるようになっています。


Fixing a Memory Leak in a Production Node.js Appという記事と動画では、Node.jsのウェブアプリケーションで発生したメモリリークの原因を調査し、どのように修正していったかについて書かれています。

動画でのライブデバッグでは、Node.jsのMemory Profilter(Chrome DevTools)を使いメモリリークの原因をデバッグしています。
heap snapshotsをつかったメモリリークのデバッグやautocannonというHTTPベンチマークツールを使い継続的にリクエストを送って状況を再現させる方法などを紹介しています。


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

JSer.info Sponsors

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


ヘッドライン


Bun v0.5 | Bun Blog

bun.sh/blog/bun-v0.5.0

Bun rlee

Bun 0.5.0リリース。
workspacesのインストールをサポート。
Node.jsとの互換性としてnode:dnsnode:tlsnode:netnode:readlineのサポート。
モジュール解決時の識別子の優先度を変更など


Release v2.0.0-alpha.1 · reduxjs/redux-toolkit

github.com/reduxjs/redux-toolkit/releases/tag/v2.0.0-alpha.1

library redux ReleaseNote

Redux Toolkit v2.0.0-alpha.1リリース。
ESM形式とCJS形式のDual Packageへの変更、thunk関数をredux-thunkパッケージへ移動。
v2正式版にはImmer 10を含める予定など


Q1 Roadmap · Issue #17475 · denoland/deno

github.com/denoland/deno/issues/17475

deno issue proposal

Denoの2023 Q1のロードマップ。
deno.jsonに直接import mapを埋め込めるように、type=modulepackage.jsonをサポート、node: prefixのサポート。
deno.land/x での semver指定のサポート、deno bundleをDeprecateにし、deno packの追加など


Safari 16.3 Release Notes | Apple Developer Documentation

developer.apple.com/documentation/safari-release-notes/safari-16_3-release-notes

safari ReleaseNote

Safari 16.3リリース。
fetch()Content-Encoding: gzipのコンテンツをダウンロードしたとき問題を修正、Cross-Origin-Embedder-Policyのバグを修正。
CSPにprefetch-srcディレクティブの追加など


Release v29.4.0 · facebook/jest

github.com/facebook/jest/releases/tag/v29.4.0

JavaScript jest ReleaseNote

Jest v29.4.0リリース。
equalのアルゴリズムをカスタマイズできるexpect.addEqualityTesters()の追加、オブジェクトのプロパティをモックするjest.replaceProperty()の追加など


Release v1.11.0 · remix-run/remix

github.com/remix-run/remix/releases/tag/remix%401.11.0

Remix ReleaseNote

Remix 1.11.0リリース。
deferを使ってレスポンス待ちを減らせるように、@remix-run/css-bundleでのCSSファイルのロード、CSS Modules、Vanilla Extractのサポート。
Flat Routesをopt-inで利用できるように


アーティクル


Next.js製アプリケーションのコンパイルを約100倍高速化した話

zenn.dev/mkt/articles/543669021d9a1e

Next.js article performance

Next.jsのビルド速度の問題を.next/traceのトレースデータを見て分析する方法について


Why Not document.write()? – CSS Wizardry – Web Performance Optimisation

csswizardry.com/2023/01/why-not-document-write/

JavaScript article performance

document.write()がなぜ遅いかについて。


Why Is My Jest Test Suite So Slow? | by Steven Lemon | Jan, 2023 | Bits and Pieces

blog.bitsrc.io/why-is-my-jest-suite-so-slow-2a4859bb9ac0

JavaScript testing article performance

Jestのテストのパフォーマンスのボトルネックの調べ方について。
起動時間、jsdomのロード、キャッシュ、テストファイルのロード、実際のテストの実行時間について。
Node.jsのプロファイラーを使ってどこに問題があるかを調べる方法について


Fixing a Memory Leak in a Production Node.js App

kentcdodds.com/blog/fixing-a-memory-leak-in-a-production-node-js-app

node.js JavaScript debug article video

Node.jsのアプリケーションでメモリリークが発生し、実際にどのようにデバッグして問題を見つけていったかという記事。
動画ではshikiが使うvscode-onigurumaのメモリ解放処理を呼んでいないことが原因だと判断し、Workerで処理するように変更した。
しかし、実際にはexpress-http-proxyがリクエストURLを保持していて、Image CDNのURLが長いためメモリを圧迫していた。


SSSVG: An Interactive SVG Reference | fffuel

fffuel.co/sssvg/

SVG tutorial

実際に触りながらSVGのタグを見れるリファレンスサイト


Optimize Time to First Byte

web.dev/optimize-ttfb/

performance browser article

Time to First Byte (TTFB)の改善について。
Serving-Timingヘッダを使い詳細化、CDNの利用、ページのリダイレクトを避ける、SSR時にStreaming Server Renderingを行う。
Service Workerを使ったキャッシュ戦略、103 Early Hintsについてなど


サイト、サービス、ドキュメント


amandaghassaei/gpu-io: A GPU-accelerated computing library for physics simulations and other mathematical calculations

github.com/amandaghassaei/gpu-io

WebGL JavaScript library

WebGLを使ったGPU処理を扱うライブラリ


ソフトウェア、ツール、ライブラリ関係


Brooooooklyn/canvas: High performance skia binding to Node.js. Zero system dependencies and pure npm packages without any postinstall scripts nor node-gyp.

github.com/Brooooooklyn/canvas

node.js canvas library

native addonsを使ったskia backendのCanvas APIの実装ライブラリ。
アーキテクチャに合わせたoptionalDependenciesでprebuildのSkiaを含めたバイナリがダウンロードされるため、システムに対して事前に依存をインストールを追加する必要がない


この記事へ修正リクエストをする
JSer.info Slackに参加する