🏄
Matsuri-tech Frontend Weekly 2024-01-26

hrdtbs

hrdtbs

2024年1月26日
MFWChromeBunClerk

社内向けに、フロントエンド関連のニュースや業務で発生したQ&A、利用しているライブラリなどの情報を定期的に書いています。

社内の開発部メンバーに向けて直近でリリースされたライブラリなどの情報をMatsuri-tech Frontend Weeklyとしてまとめています。内容は実務や趣味で使えそうなものを中心に扱っており、網羅的ではなく偏りがあります。

# Chrome 121

Chrome 121がリリースされました。今回のリリースは、WebGPUに興味がない人にとってはそこまで面白くないかもしれません。

New in Chrome 121  |  Blog  |  Chrome for DevelopersChrome 121 is rolling out now! With CSS updates, improvements to the Speculation Rules API, an origin trial for Element Capture API and there's plenty more. Adriana Jara has all the details about what's new for developers in Chrome 121.New in Chrome 121  |  Blog  |  Chrome for Developers

QualcommおよびARMのGPUを搭載したAndroid 12以上のデバイスにおいて、WebGPUがデフォルトで有効になりました。他にもWebGPUの機能がいくつか追加されています。

WebGPU の新機能(Chrome 121)  |  Blog  |  Chrome for DevelopersAndroid での WebGPU のサポート、シェーダー コンパイルでの DXC の使用、コンピューティングパスとレンダリングパスでのタイムスタンプ クエリ、シェーダー モジュールへのデフォルトのエントリ ポイント、GPUExternalTexture 色空間としての display-p3、メモリヒープ情報など。WebGPU の新機能(Chrome 121)  |  Blog  |  Chrome for Developers

DOM APIなどではないですが、ブラウザ自体の機能として生成AIを利用したタブの整理、テーマの作成、フォーム入力支援機能が追加されました。

Chrome is getting 3 new generative AI featuresThree experimental generative AI features are coming to Chrome on Macs and Windows PCs to make browsing easier and more personalized.Chrome is getting 3 new generative AI features

他、CSSの変更としては、font-paletteによるCSSアニメーションのサポート、scrolllbar-colorとscrollbar-widthによるスクロールバーのカスタマイズ、::spelling-errorと::grammer-errorを利用したスペルエラーや文法エラーのカスタマイズが出来るようになりました。

# Next.js 14.1

Next.js 14.1がリリースされました。このバージョンでは多くの機能改善を含みます。

Next.js 14.1Next.js 14 includes improvements to self-hosting, error messages, parallel and intercepted routes, Turbopack, and more.Next.js 14.1

Next.jsは特にApp Routerから「セルフホスティングが難しい」「エラーが分かりにくい」と言われていましたが、セルフホスティングのドキュメントが拡充されカスタムキャッシュハンドラーが提供され、多くのケースでエラーが丁寧なメッセージを返すようになったそうです。

他に改善と書かれていますがParallel & Intercepted Routesのバグが修正され、App RouterでもpushStateとreplaceStateが使用可能になりリロード耐性などの実装が簡単になりました。

# Bun 1.0.24

Bun v1.0.24がリリースされました。

Bun v1.0.24Fixes 9 bugs and adds Bun Shell, a fast cross-platform shell with seamless JavaScript interop. Fixes a socket timeout bug, a potential crash when socket closes, a Node.js compatibility issue with Hapi, a process.exit bug, and bun install binlinking bug, bun inspect regression, and bun:test expect().toContain bugBun v1.0.24

Bun v1.0.24では、Bun Shellというクロスプラットフォームなシェルスクリプトを記述できる関数$が提供されました。zxに似ています。

The Bun ShellThe Bun Shell is a cross-platform shell that allows you to run shell scripts in JavaScript & TypeScriptThe Bun Shell

# Deno v1.40

Deno v1.40がリリースされました。

Deno 1.40: Temporal APIDeno 1.40 introduces the Temporal API, TC39 decorators, and a range of deprecations and stabilizations, along with improvements in Node.js compatibility, LSP, diagnostics, and handling of unstable features, paving the way for a seamless upgrade to Deno 2.Deno 1.40: Temporal API

Temporal APIがサポートされました。Temporalは既存のDateオブジェクトの問題を解消し、日付と時間を扱う新しい標準APIとして提案されたものです。

またimport.meta.filenameimport.meta.dirnameがサポートされました。

console.log(import.meta.filename);
console.log(import.meta.dirname);

/*
$ deno run /dev/my_module.ts
/dev/my_module.ts
/dev/
*/

# Safari 17.3

Safari 17.3がリリースされました。

WebKit Features in Safari 17.3Last month, Safari 17.2 brought our biggest December release of web technology ever — with 39 new features and 169 bug fixes.

特に言うことがないです。Samesite=LaxだとCokkieを正しく送らなくなるバグが修正されました。

# Clerk

ClerkがシリーズBでStripeとの連携を発表しました。Stripe Billing と連携して、サブスクのプランに応じてユーザーの権限を認可するといったことが出来るようになるそうです。

Clerk raises $30M Series B from CRV and Stripe | Clerk BlogNew funding will accelerate expansion beyond authentication, into authorizationClerk raises $30M Series B from CRV and Stripe | Clerk Blog