JSer.info #673 - Safari 17.2がリリースされました。
さまざまな変更が含まれています。
- HTMLでは、
<detail name>
のサポート、<input autocomplete="one-time-code">
のサポートなど - CSSでは、Nestingのルール緩和、
cap
unit、rem()
/mod()
/round()
の追加、mask-border
のサポート、Custom Highlight APIのサポートなど - JavaScriptでは、Import attributesのサポートなど
その他には、<link rel=preload>
でimagesizes
/imagesrcset
属性でのresponsive imageをサポート。
SVG画像を<image crossorigin>
で読み込むときにCORSを考慮して扱えるようになり、
Fetch Priorityのサポート、HTML Formのform.reportValidity()
APIをサポートなども含まれています。
Deno 1.39がリリースされました。
WebGPU APIを再導入、deno coverage --html
でHTMLのカバレッジレポートを表示できるように、deno compile
の改善が含まれています。
deno task
でnode_modules/.bin/
へのPATHを通すように、Object.prototype.__proto__
を有効化する--unstable-unsafe-proto
フラグが追加されています。
その他には、Jestのexpect互換のstd/expect
を追加、コマンドライン引数のパースをするstd/cli
を追加などの変更も含まれています。
SvelteKit 2がリリースされました。
load
関数でのPromisesの扱いに一貫性を持たせるように、paths.relative
をデフォルトでtrue
に変更、dangerZone.trackServerFetches
の削除などの変更が含まれています。
次のコマンドでマイグレーションができるようになっていて、合わせてマイグレーションガイドも公開されています。
$ npx svelte-migrate sveltekit-2
JSer.infoをサポートするには
- 😘 知り合いにJSer.infoをおすすめする
- ❤️ GitHub Sponsorsで@azuのスポンサーになる
- 🐦 X(Twitter)で@jser_infoをフォローする
JSer.info Sponsors
JSer.info SponsorsはGitHub SponsorsとしてJSer.infoを支援してくれている方々です。
ヘッドライン
ECMAScript proposal updates @ 2023-11 | ECMAScript Daily
ecmascript-daily.github.io/ecmascript/2023/12/10/ecmascript-proposal-update
2023-11のTC39ミーティングでのECMAScript Proposalのステータス変更のまとめ。
Array GroupingとPromise.withResolvers
がStage 4となりES2024に含まれる。
WebKit Features in Safari 17.2 | WebKit
www.webkit.org/blog/14787/webkit-features-in-safari-17-2/
Safari 17.2リリース。
HTMLでは、<detail name>
のサポート、<input autocomplete="one-time-code">
のサポートなど。
CSSでは、Nestingのルール緩和、cap
unit、rem()
/mod()
/round()
の追加、mask-border
のサポート、Custom Highlight APIのサポートなど。
JavaScriptでは、Import attributesのサポート。
その他には、<link rel=preload>
でimagesizes
/imagesrcset
属性でのresponsive imageをサポート。
SVG画像を<image crossorigin>
で読み込むときにCORSを考慮して扱えるように。
Fetch Priorityのサポート、HTML Formのform.reportValidity()
APIをサポートなど
Oxlint General Availability | The JavaScript Oxidation Compiler
oxc-project.github.io/blog/2023-12-12-announcing-oxlint.html
Oxlintが公開された。
ESLintと同じようにJavaScriptやTypeScriptのLintをするツール。
パフォーマンスを目的として設計されており、色々なESLintのルールをコアに取り込んでいる。
Deno 1.39: The Return of WebGPU
Deno v1.39リリース。
WebGPU APIを再導入、deno coverage --html
でHTMLのカバレッジレポートを表示できるように、deno compile
の改善。
deno task
でnode_modules/.bin/
へのPATHを通すように。
Object.prototype.__proto__
を有効化する--unstable-unsafe-proto
フラグを追加。
Jestのexpect互換のstd/expect
を追加、コマンドライン引数のパースをするstd/cli
を追加など
Announcing SvelteKit 2
SvelteKit 2リリース。
load
関数でのPromisesの扱いに一貫性を持たせるように、paths.relative
をデフォルトでtrue
に変更、dangerZone.trackServerFetches
を削除など
アーティクル
npm install --productionみたいなの色々ありすぎ問題
zenn.dev/zawa_kyo/articles/d671e0935ae0c0
npm install --omit=dev
や--production
、--inculde
フラグについて
Vite は使ってないけど Jest を Vitest に移行する
zenn.dev/sa2knight/articles/migrating_vitest_from_jest
JestからVitestへの移行方法について
Baseline's evolution on MDN | MDN Blog
developer.mozilla.org/en-US/blog/baseline-evolution-on-mdn/
主要なブラウザでサポートされてるかをわかりやすく表示するBaselineについて。
MDNやcaniuseでのAPIのサポート状況の表示に利用されているBaselineの定義について
Storybook for React Server Components
storybook.js.org/blog/storybook-react-server-components/
StorybookのReact Server Components(RSC)のサポートについて。
RSCをクライアントサイドでレンダリングして対応予定。Storybook 8のα版で利用できるようになっている。
【月間9000万PVのPR TIMES】プレスリリース掲載ページの Next.js 移行でやったこと | PR TIMES 開発者ブログ
developers.prtimes.jp/2023/12/13/replace-press-release-page-with-nextjs/
Next.jsのPages Routerに移行し、キャッシュの処理はCDN(Fastly)に寄せるという話。
1年かけてNext.jsのapp routerへ完全移行した話
zenn.dev/urotea/articles/3fbaa77d77b788
Next.jsのPages RouterからApp Routerへの移行について。
移行の手順、App Routerへの移行後のメリットやデメリットについて。
Intercepting Routesでのダイアログ管理、layoutやエラー画面の管理、キャッシュの問題について
一休レストランで Next.js App Router から Remix に乗り換えた話 - 一休.com Developers Blog
user-first.ikyu.co.jp/entry/2023/12/15/093427
Next.jsのApp RouterからRemix Runに移行した話。
Next.jsのApp RouterではCache-Controlが暗黙的で変更できない問題、RemixではResponseを自由に変更できるなどの違いについて。
サイト、サービス、ドキュメント
BuilderIO/hydration-overlay: Overlay for hydration errors with explicit diff between renders.
github.com/BuilderIO/hydration-overlay
ReactのHydrationでのmismatchのエラーをDiff表示するライブラリ。
SSRとCSRでのレンダリング結果にズレがある場合にHydrationエラーのデバッグに利用できる。
ソフトウェア、ツール、ライブラリ関係
Onyx Programming Language
WebAssemblyへとコンパイルできる言語
書籍関係
実装で学ぶフルスタックWeb開発 エンジニアの視野と知識を広げる「一気通貫」型ハンズオン | 株式会社オープントーン, 佐藤 大輔, 伊東 直喜, 上野 啓二 |本 | 通販 | Amazon
www.amazon.co.jp/dp/4798179337/
2023年12月18日発売
Next.jsとDjangoでのウェブ開発についての書籍。
サンプルアプリケーションを通してウェブシステム開発を学ぶ書籍