JSer.info #656 - Next.js v13.4.16がリリースされています。 Release v13.4.16 · vercel/next.js v13.4.16には、実験的な機能としてtest modeというPlaywrightとMSWを使ったテストする仕組みが追加されています。 Next.jsのApp Directoryでは、MSWがNext.jsの処理に差し込めるポイントがなかったため、MSWが動かないなどの問題がありました。このtest modeではそれらが一部解決されてきています。 Support Next.js 13 (App directory) · Issue #1644 · mswjs/msw まだ検証目的の実験的な機能であるため今後はわかりませんが、次のDiscussionでNext.jsを使ったアプリケーションのテストについて議論されています。 RFC:

JSer.info #647 - Rustで書かれたwebpack互換のbundlerであるRspack 0.2がリリースされました。 Announcing Rspack 0.2 - Rspack Plugin Hooksの追加、ESM形式のoutputに対応、SplitChunksPluginの実装、Data URIのサポートが追加されています。 また、Vue/Svelte/NestJSのloaderのサポートが追加されています。 Modern CSS in Real Life - Chris Coyierという記事では、最近CSSに追加され利用できるようになった機能について紹介されています。 Logical Properties、Container Queries、Cascade Layers、CSS Colorsとoklch()、View Transitions APIについて現実の

JSer.info #643 - Next.js 13.4リリースされました。 Blog - Next.js 13.4 | Next.js App RouterをStableに変更されています。 まだApp Routerについての参考になるリソースは少ないですが、次のドキュメントや記事などが参考になります。 App Router | Next.js 5 Lessons Learned From Taking Next.js App Router to Production - Inngest Blog また、Next.js 13.4ではTurbopackをBetaに変更、実験的な機能としてServer Actionsを追加なども行われています。 Firefox 113.0がリリースされました。 Firefox 113.0, See All New Features, Updates and

JSer.info #632 - ブラウザ上でコード編集とプレビューができるSandpack 2.0がリリースされました。 Announcing Sandpack 2.0 and a Node.js runtime for any browser Sandpack 2.0では、Node.jsのコードをブラウザ上で実行できるNodeboxという機能が追加されています。 先週、APIとして利用できるようになったWebContainersと仕組みは似ています。 WebContainer API is here. Sandpackでは、厳密なNode.jsのエミュレートよりも、Node.jsで書かれたツールやアプリケーションの実行を目的としています。 また、SharedArrayBufferなどcross origin isolationな環境でしか使えないAPIを避けることで、色々な場所で動作す

JSer.info は、JavaScriptの最新の情報を紹介していくサイトで、2011年1月16日からやっています。 今日で、JSer.info が12周年を迎えました🎉 2011-01-16のJS: JSer.info初投稿の記事 - JSer.info コメントなどがあれば、次のコメント欄やTwitterの #jserinfo などに投稿してくれると嬉しいです！ Tweet 昨年からやったこと 昨年からの変更点です。 SlackにJSer.infoのRSSを追加しやすくしました サイドバーにあるボタンからSlackにRSSを追加するコマンドが簡単にコピーできるようになりました /feed subscribe https://jser.info/rss/ Product NameのAPIを追加した $ curl "https://jser-product-name.deno.dev/

JSer.info #625 - 2022 Year In Review | The Vue Pointという記事では、Vue 2のEnd of Life (EOL)が改めて周知されています。 Vue.js - Vue 2 LTS, EOL & Extended Support Vue.js 2は2023年12月31日にEOLとなり、サポートが終了されます。 サポート終了後はセキュリティリリースも行われなくなる予定です。 NextAuth.jsがAuth.jsの一部という扱いに変更されました。 これによって、SvelteKitやSolidStartでもNextAuthが実装していた認証、認可の仕組みが利用できるようになっています。 React NativeがTypeScriptをFirst-classとしてサポートすることが発表されました。 First-class Support for

JSer.info #612 - Deno 1.26がリリースされました。 Deno 1.26 Release Notes Cache APIのサポート、新しいパーミッションとして--allow-sysフラグが追加されています。 また、node_modulesディレクトリを扱う--node-modules-dirフラグの追加し、Node.jsとの互換モードであった--compatフラグを削除しています。 compat modeはnpm:識別子によって置き換えられた形になります。 またNode.jsコアモジュールへの互換性の改善、Deno.serve() APIなどパフォーマンス改善、TypeScrtipt 4.8へのアップデートなども含まれています。 HTTPクライアントライブラリのaxios v1.0.0がリリースされました。 Release v1.0.0 · axios/axios 複

JSer.info #604 - Chrome 105 Betaがリリースされました。 Chromium Blog: Chrome 105 Beta: Custom Highlighting, Fetch Upload Streaming, and More Chrome 105 betaでは、Custom Highlight APIの実装、Container Queryの実装、:has擬似クラスの実装、Fetch Upload Streamingの実装などが追加されています。 また、navigator.mediaDevices.getDisplayMediaにsystemAudioオプションの追加、HTML Sanitizer APIの追加、import.meta.resolve()メソッドの追加、Response.json()メソッドの追加なども行われています。 非推奨だったWebSQ

JSer.info #601 - Node.js 18.6.0がリリースされました。 Node v18.6.0 (Current) | Node.js Node.js 18.6.0ではexperimentalで実装されている--loaderの挙動の変更が含まれています。 複数の--loaderを指定した場合の順番を変更。またloaderの実装はshortCircuitを返すのが必須となっています。 そのため、すでに公開されているloaderが動かなくなっている場合があります。 詳しくは、次のIssueと記事で解説されています。 esm: add chaining to loaders by JakobJingleheimer · Pull Request #42623 · nodejs/node Custom ESM loaders: Who, what, when, where, why

JSer.info #590 - pnpm 7.0.0がリリースされました。 Release v7.0.0 · pnpm/pnpm コマンドラインフラグの変更やデフォルト値の変更などの破壊的な変更が中心となっています。 Node.js 12のサポート終了、root packageはpnpm -r execなどの対象からデフォルトで除外するように変更。--filterがglobをサポート、@types/*を自動的にhoistしないようになるといった変更が含まれています。 その他には、strict-peer-dependenciesがデフォルトで有効となる変更も含まれています。 Mocha 10.0.0がリリースされました。 Release v10.0.0 · mochajs/mocha こちらもサポート終了した機能を削除するといった破壊的な変更が中心となっています。 Node.js 12のサ

JSer.info #588 - Lexicalというテキストエディタを作るためのJavaScriptフレームワークが公開されました。 facebook/lexical: Lexical is an extensible text editor framework that provides excellent reliability, accessibility and performance. エディタの状態をdouble-bufferingで管理して、状態の変更をdiff/patchで表示に反映させる仕組みを持っている。 またcontentEditableを使っているが、外部からの変更をMutationObserverで監視し、エディタの状態を更新している。 Lexicalは同じくFacebookが作成しているDraft.jsの後継となるライブラリで、APIの互換性はありませんが、今

JSer.info #586 - React 18が正式リリースされました。 React v18.0 – React Blog Internet Explorerのサポートが終了されています。 主な変更としてConcurrent Renderingに対応するための変更と新しいAPIが追加されています。 setStateの呼び出しを自動的にバッチ化とopt-outするためのflushSyncを追加、緊急と緊急ではない状態の更新を扱うTransition APIがされています。 クライアントのReactDOM.renderとReactDOM.hydrateとサーバのrenderToStringはそれぞれ非推奨となっています。 これに対応する新しいAPIとして、クライアントにcreateRoot/hydrateRoot、サーバにrenderToPipeableStream/renderToRea

JSer.info #587 - TypeScript 4.7 Betaがリリースされました。 Announcing TypeScript 4.7 Beta - TypeScript TypeScript 4.5 Betaで導入されNightlyでテストされていた、Node.jsのECMAScript Moduleサポートを再び有効化されています。 これに関連してpackage.jsonのexportsフィールドのサポート、"module": "nodenext"、.mts/ctsの拡張子のサポートが追加されています。 また、Node.jsではファイルがモジュールかどうかはpackage.jsonのmoduleフィールドなどによって暗黙的に異なります。 そのため、ファイルがモジュールかどうかを判定方法を制御できるmoduleDetectionオプションも追加して、強制的(force)にモジ

JSer.info #583 - React 18 RCがリリースされました。 How to Upgrade to the React 18 Release Candidate – React Blog React 18 RCではIEのサポートが終了しています。 ReactDOMのrender APIをDeprecatedとし、createRoot APIの利用が推奨となっています。 SSR APIのrenderToNodeStreamを非推奨化し、SuspenseをサポートしたrenderToPipeableStreamとrenderToReadableStreamが追加されています。 setStateなどのステート更新を自動的にバッジ処理するようにし、React 17の挙動を再現するためのflushSyncAPIが追加されています。 また、ReduxなどのReact外でステート管理する

JSer.info #564 - Babel 7.16.0がリリースされました。 7.16.0 Released: ESLint 8 and TypeScript 4.5 · Babel Babel 7.16.0ではClass static blocksが@babel/preset-envに含まれるようになっています。 また、TypeScript 4.5 Betaへの対応、Stage 2であるPipe Operatorへのオプションの追加などが行われています。 また、@babel/eslint-parserがESLint 8へ対応しています。 Node.js向けのTest RunnerであるAVA 4 RC1がリリースされました。 Release AVA 4 Release Candidate 1 · avajs/ava AVA 4 RC1の破壊的な変更としてNode 10のサポート終了、

JSer.info #559 - Web Componentsを扱うライブラリであるLit 2がリリースされました。 Announcing Lit 2 stable release – Lit Lit 2.0 Release Livestream - YouTube Lit 2は今までLitElement 2.xとlit-html 1.xという別々のパッケージになったものを統合していて、litという新しいパッケージ担っています。 classベースのDirectives API、非同期Directives、Reactive Controllersの追加されています。 要素全体に対して影響を与えられるElement expressions、タグ名などに変数を使えるStatic expressionsなども追加されています。 また、実験的にSSRのサポートなども追加されています。 LitElem

JSer.info #552 - パッケージマネージャであるpnpm 6.12.9がリリースされました。 Release v6.12.0 · pnpm/pnpm pnpm 6.12.0ではpnpm env use --global 16.5.0のように、Node.jsをインストールするコマンドが追加されています。 pnpm自体をsingle binaryとして配布した場合に、Node.jsがグローバルにインストールされていない環境でもpnpmが利用できるようになります。 そのような場合に、pnpmでNode.jsをインストールするためにpnpm envが追加されています。 Using pnpm as a Node.js version manager · Discussion #3434 · pnpm/pnpm webpack 5.49.0がリリースされました。 Release v5.49

JSer.info #558 - Deno 1.14がリリースされました。 Deno 1.14 Release Notes | Deno Blog Deno 1.14.0 がリリースされたので新機能や変更点の紹介 deno lintとdeno fmtがオプションをサポートしてquoteやindentなどの設定ができるようになっています。 URLPatternのサポート。fetchがMutual TLSをサポートなども追加されています。 また、unstableな機能としてFile locking APIsのサポートが追加されています。 その他にはURL parsingやstd/httpモジュールのパフォーマンス改善などが含まれています。 ChromeのUser-Agent文字列削減のスケジュールが改めて公開されています。 Chromium Blog: User-Agent Reduction

JSer.info #556 - Electron 14.0.0がリリースされました。 Electron 14.0.0 | Electron Blog 依存がそれぞれChromium 93、Node.js 14.17.0、V8 9.3へとアップデートされています。 破壊的な変更としてapp.allowRendererProcessReuseオプションの削除、worldSafeExecuteJavaScriptオプションを削除(trueがデフォルト)されています。 また、Electron 12でDeprecatedとなっていたremoteモジュールを削除し、@electron/remoteという外部モジュールへと変更されています。 RendererとMain(Node.js)のやり取りには、基本的にはcontextBridgeを使っていく方向になっています。 Electron（v.14.0.

JSer.info #551 - Yarn 3.0がリリースされました。 Yarn 3.0 🚀🤖 Performances, ESBuild, Better Patches, ... - DEV Community 👩‍💻👨‍💻 berry/CHANGELOG.md at master · yarnpkg/berry Node.js 10のサポート終了、.pnp.cjsにリネーム、@yarnpkg/pnpifyを3つのパッケージに分解などの変更を含んでいます。 @yarnpkg/sdks: Editor SDKs @yarnpkg/pnpify: PnPと互換性のないツールを実行するツール @yarnpkg/nm: node_modules linker また、 exportsフィールドのサポート、pnpmライクなハードリンクのサポート、シェル構文のサポート改善、 ESBuil