diff --git a/_i18n/ja/_posts/2022/2022-05-24-deno-1.22-storybook-6.5webpack-lazy-compilation-next.js-layouts-rfc.md b/_i18n/ja/_posts/2022/2022-05-24-deno-1.22-storybook-6.5webpack-lazy-compilation-next.js-layouts-rfc.md new file mode 100644 index 00000000000..2fcd758118b --- /dev/null +++ b/_i18n/ja/_posts/2022/2022-05-24-deno-1.22-storybook-6.5webpack-lazy-compilation-next.js-layouts-rfc.md @@ -0,0 +1,230 @@ +--- +title: "2022-05-24のJS: Deno 1.22、Storybook 6.5(webpack Lazy Compilation)、Next.js Layouts RFC" +author: "azu" +layout: post +date : 2022-05-24T03:06:17.234Z +category: JSer +tags: +- video +- Tools +- browser +- testing +- google + +--- + +JSer.info #593 - Deno 1.22がリリースされました。 + +- [Deno 1.22 Release Notes](https://deno.com/blog/v1.22) + +Denoには、3つの型チェックモードがあります。 + +- Full: ローカルとリモートの依存関係を含めた全ての型をチェックする +- Local: ローカルの型のみをチェックする +- None: 型をチェックしない + +1.21まではコマンドによっては"Full"モードで型チェックをしていましたが、1.22からは"Local"モードで型チェックをするのがデフォルトとなりました。 +また、次のリリース予定である1.23では、`deno run`と`deno cache`はデフォルトで"None"モードとなり型チェックをしなくなる予定となっています。 + +そのほかの変更として、`Deno.emit()`を削除、Worker内でも`Deno`名前空間がデフォルトで有効化、`--no-config`フラグの追加などが行われています。 +また、`Navigator.userAgent`のサポート、[`Response.json()`静的メソッド](https://github.com/whatwg/fetch/pull/1392)の追加なども含まれます。 + +--- + +Storybook 6.5.0がリリースされました。 + +- [Release v6.5.0 · storybookjs/storybook](https://github.com/storybookjs/storybook/releases/tag/v6.5.0) + +webpack 5のlazy compilationをサポートが追加され、開発モードでの起動速度や再ビルドのパフォーマンスが改善されています。 + +- [Storybook Lazy Compilation for Webpack](https://storybook.js.org/blog/storybook-lazy-compilation-for-webpack/) +- [Storybook Performance: Vite vs Webpack](https://storybook.js.org/blog/storybook-performance-from-webpack-to-vite/) + +その他には、React 18の`createRoot`のサポート、MDX2のサポートが行われています。 +また、Viteの設定ファイル(`vite.config.js`)がある場合は、自動的にViteを使うように変更されています。 + +---- + +

ヘッドライン

+ +---- + +## Deno 1.22 Release Notes +[deno.com/blog/v1.22](https://deno.com/blog/v1.22 "Deno 1.22 Release Notes") +

deno ReleaseNote

+ +Deno 1.22.0リリース。 +デフォルトの型チェックの対象が依存関係を含まないローカルのみとなる。 +`Deno.emit()`を削除、Worker内でも`Deno`名前空間がデフォルトで有効化、`--no-config`フラグの追加。 +`Navigator.userAgent`のサポート、`Response.json()`静的メソッドの追加など + +- [Release v1.22.0 · denoland/deno](https://github.com/denoland/deno/releases/tag/v1.22.0 "Release v1.22.0 · denoland/deno") + +---- + +## Release v6.5.0 · storybookjs/storybook +[github.com/storybookjs/storybook/releases/tag/v6.5.0](https://github.com/storybookjs/storybook/releases/tag/v6.5.0 "Release v6.5.0 · storybookjs/storybook") +

JavaScript debug Tools ReleaseNote

+ +Storybook v6.5.0リリース。 +webpack 5のlazy compilationをサポート、React 18の`createRoot`のサポート、MDX2のサポート。 +また、Viteの設定ファイルがある場合は、自動的にViteを使うように変更されている。 + +- [storybook/MIGRATION.md at next · storybookjs/storybook](https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#from-version-64x-to-650 "storybook/MIGRATION.md at next · storybookjs/storybook") + +---- + +## 7.18.0 Released: Destructuring private elements and TypeScript 4.7 · Babel +[babeljs.io/blog/2022/05/19/7.18.0](https://babeljs.io/blog/2022/05/19/7.18.0 "7.18.0 Released: Destructuring private elements and TypeScript 4.7 · Babel") +

babel ReleaseNote

+ +Babel v7.18.0リリース。 +TypeScript 4.7のoptional variance(`in`/`out`)、instantiation expressionsなどに対応。 +Stage 2のPrivate destructuringのサポート、`regenerator-runtime`を自動的にinline化する変更など + + +---- + +## Release v4.0.0 · capricorn86/happy-dom +[github.com/capricorn86/happy-dom/releases/tag/v4.0.0](https://github.com/capricorn86/happy-dom/releases/tag/v4.0.0 "Release v4.0.0 · capricorn86/happy-dom") +

DOM library ReleaseNote

+ +Happy DOM v4.0.0リリース。 +Void Elementのシリアライズバグを修正。 +``を``にシリアライズ、一方でSVG要素は``を``へとシリアライズするように修正。 + + +---- + +## Release v2.2.0 · MithrilJS/mithril.js +[github.com/MithrilJS/mithril.js/releases/tag/v2.2.0](https://github.com/MithrilJS/mithril.js/releases/tag/v2.2.0 "Release v2.2.0 · MithrilJS/mithril.js") +

JavaScript library ReleaseNote

+ +mithril.js v2.2.0リリース。 + + +---- + +## Node v18.2.0 (Current) | Node.js +[nodejs.org/en/blog/release/v18.2.0/](https://nodejs.org/en/blog/release/v18.2.0/ "Node v18.2.0 (Current) | Node.js") +

node.js ReleaseNote

+ +Node.js 18.2.0リリース。 +OpenSSLのセキュリティ修正、`http.Server`に`closeAllConnections`と`closeIdleConnections`を追加。 +`perf_hooks`に`PerformanceResourceTiming`のサポートを追加など + + +---- + +## nvh95/jest-preview: Debug your Jest tests. Effortlessly.🛠🖼 +[github.com/nvh95/jest-preview](https://github.com/nvh95/jest-preview "nvh95/jest-preview: Debug your Jest tests. Effortlessly.🛠🖼") +

jest browser testing library

+ +Jestで実行中のテストに`debug()`関数を仕込むことで、実行中のテストが作成したHTMLをブラウザでプレビューしながらデバッグできるライブラリ。 + + +---- + +## adriancooney/puppeteer-heap-snapshot: API and CLI tool to fetch and query Chome DevTools heap snapshots. +[github.com/adriancooney/puppeteer-heap-snapshot](https://github.com/adriancooney/puppeteer-heap-snapshot "adriancooney/puppeteer-heap-snapshot: API and CLI tool to fetch and query Chome DevTools heap snapshots.") +

puppeteer library Tools

+ +Puppeteerを使いサイトへアクセスして、Heap Snapshotを取得し、そのSnapshotから特定のプロパティ名にマッチするオブジェクトを取り出すスクレイピングライブラリ。 + +- [Web Scraping via Javascript Runtime Heap Snapshots - Adrian Cooney's Blog](https://www.adriancooney.ie/blog/web-scraping-via-javascript-heap-snapshots "Web Scraping via Javascript Runtime Heap Snapshots - Adrian Cooney's Blog") + +---- + +## Release electron v19.0.0 · electron/electron +[github.com/electron/electron/releases/tag/v19.0.0](https://github.com/electron/electron/releases/tag/v19.0.0 "Release electron v19.0.0 · electron/electron") +

Electron ReleaseNote

+ +Electron v19.0.0リリース。 +Chromium 102、V8 10.2、Node.js 16.14.2にアップデート。 +Electron 20からpreload scriptsは自動的にsandboxで実行される。 +そのため、`nodeIntegration: true` かつ `sandbox`が無指定の場合に警告が出るようになった。 + + +---- + +## Release v7.0.0 · faker-js/faker +[github.com/faker-js/faker/releases/tag/v7.0.0](https://github.com/faker-js/faker/releases/tag/v7.0.0 "Release v7.0.0 · faker-js/faker") +

JavaScript library ReleaseNote

+ +Faker v7.0.0リリース。 +default exportを削除、ES2020をサポートしている環境をターゲットに変更、Node.js 12のサポート終了など + + +---- +

アーティクル

+ +---- + +## The Surprising Truth About Pixels and Accessibility: should I use pixels or rems? +[www.joshwcomeau.com/css/surprising-truth-about-pixels-and-accessibility/](https://www.joshwcomeau.com/css/surprising-truth-about-pixels-and-accessibility/ "The Surprising Truth About Pixels and Accessibility: should I use pixels or rems?") +

CSS fonts accessibility article

+ +`px`と`rem`について。 +`px`指定はブラウザのデフォルトフォントサイズの影響を受けないが`rem`は影響を受ける。 +使う場所による違い、デフォルトフォントサイズを大きくして確認する方法、ルートのフォントサイズを小さくする問題についてなど + + +---- + +## Blog - Layouts RFC | Next.js +[nextjs.org/blog/layouts-rfc](https://nextjs.org/blog/layouts-rfc "Blog - Layouts RFC | Next.js") +

Next.js article proposal

+ +Next.jsの新しいLayout RFCを解説する記事。 +`app/`というディレクトリでopt-inする形となり、`layout.js`と`page.js`というファイル名の命名規則使ったルーティングとレイアウトの仕組みについて。 +また、この新しいLayout RFCではReact Server Componentsがデフォルトとなることについてなど + +- [RFC: Layouts · Discussion #37136 · vercel/next.js](https://github.com/vercel/next.js/discussions/37136 "RFC: Layouts · Discussion #37136 · vercel/next.js") + +---- +

スライド、動画関係

+ +---- + +## Web at I/O 2022 - YouTube +[www.youtube.com/playlist?list=PLNYkxOF6rcIDKuCU73tmdRN\_-mI3tKFPD](https://www.youtube.com/playlist?list=PLNYkxOF6rcIDKuCU73tmdRN_-mI3tKFPD "Web at I/O 2022 - YouTube") +

google web video Conference

+ +Google I/O 2022のWeb関係の動画まとめ + + +---- + +## Playwright 1.22: Component Tests (preview) Overview - YouTube +[www.youtube.com/watch?v=y3YxX4sFJbM](https://www.youtube.com/watch?v=y3YxX4sFJbM "Playwright 1.22: Component Tests (preview) Overview - YouTube") +

playwright JavaScript browser testing video

+ +Playwright v1.22で試験的に実装されたComponent Tests機能の解説動画。 +どのような仕組みでブラウザにコンポーネントをmountしているか、コンポーネントのテスト実行、デバッガーとの連携、キーボード入力やスクリーンショットの撮影などについて + +- [Release v1.22.0 · microsoft/playwright](https://github.com/microsoft/playwright/releases/tag/v1.22.0 "Release v1.22.0 · microsoft/playwright") + +---- +

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

+ +---- + +## markdoc/markdoc: A powerful, flexible, Markdown-based authoring framework. +[github.com/markdoc/markdoc](https://github.com/markdoc/markdoc "markdoc/markdoc: A powerful, flexible, Markdown-based authoring framework.") +

Markdown document library

+ +Markdownベースのドキュメントオーサリングライブラリ。 +パーサ、バリデーション、カスタムタグなどを拡張に対応している。 +markdown-itのtokenize結果をもとにASTを組み立て、それをレンダリングするRendererを持つ + + +---- + +## honojs/hono: Ultrafast web framework for Cloudflare Workers. Fast, but not only fast. +[github.com/honojs/hono](https://github.com/honojs/hono "honojs/hono: Ultrafast web framework for Cloudflare Workers. Fast, but not only fast.") +

cloudflare library JavaScript

+ +Cloudflare Workers向けのルーティングライブラリ + + +----