From 5e6634fb70ac26b30b17e64cece3d3eb4618c4d7 Mon Sep 17 00:00:00 2001 From: azu Date: Sat, 2 Sep 2023 06:23:05 +0000 Subject: [PATCH 01/13] Update 659 draft --- _i18n/ja/_posts/2023/2023-09-02-659draft.md | 28 +++++++++++++++++++++ 1 file changed, 28 insertions(+) create mode 100644 _i18n/ja/_posts/2023/2023-09-02-659draft.md diff --git a/_i18n/ja/_posts/2023/2023-09-02-659draft.md b/_i18n/ja/_posts/2023/2023-09-02-659draft.md new file mode 100644 index 00000000000..1d6bb55c419 --- /dev/null +++ b/_i18n/ja/_posts/2023/2023-09-02-659draft.md @@ -0,0 +1,28 @@ +--- +title: "2023-09-02のJS: " +author: "azu" +layout: post +date : 2023-09-02T06:22:38.858Z +category: JSer +tags: +- MicroFrontend + +--- + +JSer.info #659 + +---- + +

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

+ +---- + +## Modern.js +[modernjs.dev/en](https://modernjs.dev/en "Modern.js") +

JavaScript library MicroFrontend

+ +ByteDanceのJavaScript向けのウェブアプリケーションフレームワーク。 +Reactをベースにしたクライアントサイド向けのモデルやルーティング、Rspack/ESLint/Jestなどの統合、BFFのサポート、MicroFrontendのサポートなどをしている。 + + +---- From 56001229875c9df4907c518d545022edfda37711 Mon Sep 17 00:00:00 2001 From: azu Date: Sat, 2 Sep 2023 06:33:36 +0000 Subject: [PATCH 02/13] Update 659 draft --- _i18n/ja/_posts/2023/2023-09-02-659draft.md | 20 +++++++++++++++++++- 1 file changed, 19 insertions(+), 1 deletion(-) diff --git a/_i18n/ja/_posts/2023/2023-09-02-659draft.md b/_i18n/ja/_posts/2023/2023-09-02-659draft.md index 1d6bb55c419..7a26aa82d13 100644 --- a/_i18n/ja/_posts/2023/2023-09-02-659draft.md +++ b/_i18n/ja/_posts/2023/2023-09-02-659draft.md @@ -2,10 +2,12 @@ title: "2023-09-02のJS: " author: "azu" layout: post -date : 2023-09-02T06:22:38.858Z +date : 2023-09-02T06:33:10.121Z category: JSer tags: - MicroFrontend +- bundler +- architecture --- @@ -13,6 +15,22 @@ JSer.info #659 ---- +

アーティクル

+ +---- + +## Design Trade-offs in Bundler: The Rationale Behind Creating Rspack · web-infra-dev/wg · Discussion #1 +[github.com/web-infra-dev/wg/discussions/1](https://github.com/web-infra-dev/wg/discussions/1 "Design Trade-offs in Bundler: The Rationale Behind Creating Rspack · web-infra-dev/wg · Discussion #1") +

JavaScript bundler article architecture

+ +Rspackの開発の目的やwebpack/parcel/esbuild/rollupなどのbundlerのアーキテクチャについて。 +webpackにはデバッグやパフォーマンスの問題があり、Vite/Rollupも大規模プロジェクトではパフォーマンスにビルド環境の差異の問題があり、esbuildはプラグインの柔軟性に問題がある。 +RollupはESMのみが第一級市民であり、RspackはwebpackとParcelと同じく言語に依存しないことを目的にしている。 +それぞれのbundlerのプラグインAPIの設計と複雑性、ASTの再利用とパフォーマンスの問題、Tree ShakingをASTベースで行った場合の課題について。 +また、今後のRspackが目指す方向して簡単に使えるようにすること、デバッグをしやすくすること、最適化をwebpackと同等以上にすること、リモートキャッシュなどについて触れている。 + + +----

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

---- From 0bdc91d23065b4b1fdc30b8ab21dde64354431dd Mon Sep 17 00:00:00 2001 From: azu Date: Sun, 3 Sep 2023 06:31:00 +0000 Subject: [PATCH 03/13] Update 659 draft --- ...9-02-659draft.md => 2023-09-03-659draft.md} | 18 ++++++++++++++++-- 1 file changed, 16 insertions(+), 2 deletions(-) rename _i18n/ja/_posts/2023/{2023-09-02-659draft.md => 2023-09-03-659draft.md} (76%) diff --git a/_i18n/ja/_posts/2023/2023-09-02-659draft.md b/_i18n/ja/_posts/2023/2023-09-03-659draft.md similarity index 76% rename from _i18n/ja/_posts/2023/2023-09-02-659draft.md rename to _i18n/ja/_posts/2023/2023-09-03-659draft.md index 7a26aa82d13..eb5ffaff17d 100644 --- a/_i18n/ja/_posts/2023/2023-09-02-659draft.md +++ b/_i18n/ja/_posts/2023/2023-09-03-659draft.md @@ -1,13 +1,15 @@ --- -title: "2023-09-02のJS: " +title: "2023-09-03のJS: " author: "azu" layout: post -date : 2023-09-02T06:33:10.121Z +date : 2023-09-03T06:31:00.556Z category: JSer tags: - MicroFrontend - bundler - architecture +- GraphQL +- Tools --- @@ -15,6 +17,18 @@ JSer.info #659 ---- +

ヘッドライン

+ +---- + +## nitrogql 1.0 release | nitrogql blog +[nitrogql.vercel.app/blog/release-1.0](https://nitrogql.vercel.app/blog/release-1.0 "nitrogql 1.0 release | nitrogql blog") +

GraphQL Tools Rust nodejs TypeScript ReleaseNote

+ +GraphQLからクライアントコードの生成とGraphQLのクエリの型チェック行うnitrogql 1.0リリース。 + + +----

アーティクル

---- From 16a60bc7b073ae366c822b495ae7333e7d601587 Mon Sep 17 00:00:00 2001 From: azu Date: Mon, 4 Sep 2023 10:04:54 +0000 Subject: [PATCH 04/13] Update 659 draft --- ...23-09-03-659draft.md => 2023-09-04-659draft.md} | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) rename _i18n/ja/_posts/2023/{2023-09-03-659draft.md => 2023-09-04-659draft.md} (77%) diff --git a/_i18n/ja/_posts/2023/2023-09-03-659draft.md b/_i18n/ja/_posts/2023/2023-09-04-659draft.md similarity index 77% rename from _i18n/ja/_posts/2023/2023-09-03-659draft.md rename to _i18n/ja/_posts/2023/2023-09-04-659draft.md index eb5ffaff17d..51a202f55b3 100644 --- a/_i18n/ja/_posts/2023/2023-09-03-659draft.md +++ b/_i18n/ja/_posts/2023/2023-09-04-659draft.md @@ -1,8 +1,8 @@ --- -title: "2023-09-03のJS: " +title: "2023-09-04のJS: " author: "azu" layout: post -date : 2023-09-03T06:31:00.556Z +date : 2023-09-04T10:04:54.573Z category: JSer tags: - MicroFrontend @@ -44,6 +44,16 @@ RollupはESMのみが第一級市民であり、RspackはwebpackとParcelと同 また、今後のRspackが目指す方向して簡単に使えるようにすること、デバッグをしやすくすること、最適化をwebpackと同等以上にすること、リモートキャッシュなどについて触れている。 +---- + +## Mofi - Snappy UIs With WebAssembly and Web Workers +[mofi.loud.red/blog/wasm-and-workers](https://mofi.loud.red/blog/wasm-and-workers "Mofi - Snappy UIs With WebAssembly and Web Workers") +

WebAssembly webworker article JavaScript

+ +WebAssemblyでの処理をWebWorkerの中で動かし、メインスレッドをブロックせずに処理を行うという話。 +CPUのコア数を超えてWorkerを増やすと問題があるため、ワーカープールを作成しWorker数を制御している。またWorkerから進捗状況をメッセージングする方法についてなど + + ----

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

From aed18915e0e77bc5375d1e389aed27fccba4e655 Mon Sep 17 00:00:00 2001 From: azu Date: Mon, 4 Sep 2023 11:45:57 +0000 Subject: [PATCH 05/13] Update 659 draft --- _i18n/ja/_posts/2023/2023-09-04-659draft.md | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/_i18n/ja/_posts/2023/2023-09-04-659draft.md b/_i18n/ja/_posts/2023/2023-09-04-659draft.md index 51a202f55b3..7a4fdfba2fe 100644 --- a/_i18n/ja/_posts/2023/2023-09-04-659draft.md +++ b/_i18n/ja/_posts/2023/2023-09-04-659draft.md @@ -2,7 +2,7 @@ title: "2023-09-04のJS: " author: "azu" layout: post -date : 2023-09-04T10:04:54.573Z +date : 2023-09-04T11:45:29.511Z category: JSer tags: - MicroFrontend @@ -67,4 +67,17 @@ ByteDanceのJavaScript向けのウェブアプリケーションフレームワ Reactをベースにしたクライアントサイド向けのモデルやルーティング、Rspack/ESLint/Jestなどの統合、BFFのサポート、MicroFrontendのサポートなどをしている。 +---- +

書籍関係

+ +---- + +## Nuxt 3 フロントエンド開発の教科書:書籍案内|技術評論社 +[gihyo.jp/book/2023/978-4-297-13685-7](https://gihyo.jp/book/2023/978-4-297-13685-7 "Nuxt 3 フロントエンド開発の教科書:書籍案内|技術評論社") +

Vue library book

+ +2023年9月22日発売 +Nuxtについての書籍 + + ---- From 56cd3a96676d8882661682c3aeb360d09fd41ffb Mon Sep 17 00:00:00 2001 From: azu Date: Tue, 5 Sep 2023 22:26:34 +0000 Subject: [PATCH 06/13] Update 659 draft --- ...-04-659draft.md => 2023-09-05-659draft.md} | 27 ++++++++++++++++--- 1 file changed, 24 insertions(+), 3 deletions(-) rename _i18n/ja/_posts/2023/{2023-09-04-659draft.md => 2023-09-05-659draft.md} (75%) diff --git a/_i18n/ja/_posts/2023/2023-09-04-659draft.md b/_i18n/ja/_posts/2023/2023-09-05-659draft.md similarity index 75% rename from _i18n/ja/_posts/2023/2023-09-04-659draft.md rename to _i18n/ja/_posts/2023/2023-09-05-659draft.md index 7a4fdfba2fe..b001866dde3 100644 --- a/_i18n/ja/_posts/2023/2023-09-04-659draft.md +++ b/_i18n/ja/_posts/2023/2023-09-05-659draft.md @@ -1,15 +1,15 @@ --- -title: "2023-09-04のJS: " +title: "2023-09-05のJS: " author: "azu" layout: post -date : 2023-09-04T11:45:29.511Z +date : 2023-09-05T22:26:34.270Z category: JSer tags: +- nodejs - MicroFrontend - bundler - architecture - GraphQL -- Tools --- @@ -28,6 +28,17 @@ JSer.info #659 GraphQLからクライアントコードの生成とGraphQLのクエリの型チェック行うnitrogql 1.0リリース。 +---- + +## Node v20.6.0 (Current) | Node.js +[nodejs.org/ja/blog/release/v20.6.0](https://nodejs.org/ja/blog/release/v20.6.0 "Node v20.6.0 (Current) | Node.js") +

nodejs ReleaseNote

+ +Node.js v20.6.0リリース。 +`.env`をビルトインサポート、`import.meta.resolve`をフラグなしで利用できるように、`module.register()` APIの追加。 +Loaderの`load` hookがCommonJSをサポートし、非推奨の`require.extensions`を使わなくてもCommonJSを扱うcustom loaderを書けるようになるなど + + ----

アーティクル

@@ -54,6 +65,16 @@ WebAssemblyでの処理をWebWorkerの中で動かし、メインスレッドを CPUのコア数を超えてWorkerを増やすと問題があるため、ワーカープールを作成しWorker数を制御している。またWorkerから進捗状況をメッセージングする方法についてなど +---- + +## Faster Vue.js Execution in Firefox - Mozilla Hacks - the Web developer blog +[hacks.mozilla.org/2023/09/faster-vue-js-execution-in-firefox/](https://hacks.mozilla.org/2023/09/faster-vue-js-execution-in-firefox/ "Faster Vue.js Execution in Firefox - Mozilla Hacks - the Web developer blog") +

Firefox JavaScript performance article

+ +Vueなどが使うProxyの最適化を行うことで、TodoMVC-Vuewのパフォーマンスが40%改善される。 +Firefox 118のリリースにこの変更が含まれる予定。 + + ----

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

From b730cd20b9a2db2d3a0b4d378bb963b11172852b Mon Sep 17 00:00:00 2001 From: azu Date: Tue, 5 Sep 2023 23:12:53 +0000 Subject: [PATCH 07/13] Update 659 draft --- _i18n/ja/_posts/2023/2023-09-05-659draft.md | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/_i18n/ja/_posts/2023/2023-09-05-659draft.md b/_i18n/ja/_posts/2023/2023-09-05-659draft.md index b001866dde3..65821a495a9 100644 --- a/_i18n/ja/_posts/2023/2023-09-05-659draft.md +++ b/_i18n/ja/_posts/2023/2023-09-05-659draft.md @@ -2,7 +2,7 @@ title: "2023-09-05のJS: " author: "azu" layout: post -date : 2023-09-05T22:26:34.270Z +date : 2023-09-05T23:12:26.304Z category: JSer tags: - nodejs @@ -39,6 +39,16 @@ Node.js v20.6.0リリース。 Loaderの`load` hookがCommonJSをサポートし、非推奨の`require.extensions`を使わなくてもCommonJSを扱うcustom loaderを書けるようになるなど +---- + +## Release v4.0.0 · actions/checkout +[github.com/actions/checkout/releases/tag/v4.0.0](https://github.com/actions/checkout/releases/tag/v4.0.0 "Release v4.0.0 · actions/checkout") +

Github Actions nodejs

+ +actions/checkout v4.0.0リリース。 +Node.js 20を利用するように、`show-progress`オプションを追加など + + ----

アーティクル

From 75f3bee4f6af26fde8179ba8dbc0eef9ad59c151 Mon Sep 17 00:00:00 2001 From: azu Date: Wed, 6 Sep 2023 02:16:23 +0000 Subject: [PATCH 08/13] Update 659 draft --- ...9-05-659draft.md => 2023-09-06-659draft.md} | 18 +++++++++++++++--- 1 file changed, 15 insertions(+), 3 deletions(-) rename _i18n/ja/_posts/2023/{2023-09-05-659draft.md => 2023-09-06-659draft.md} (89%) diff --git a/_i18n/ja/_posts/2023/2023-09-05-659draft.md b/_i18n/ja/_posts/2023/2023-09-06-659draft.md similarity index 89% rename from _i18n/ja/_posts/2023/2023-09-05-659draft.md rename to _i18n/ja/_posts/2023/2023-09-06-659draft.md index 65821a495a9..35752e032dc 100644 --- a/_i18n/ja/_posts/2023/2023-09-05-659draft.md +++ b/_i18n/ja/_posts/2023/2023-09-06-659draft.md @@ -1,8 +1,8 @@ --- -title: "2023-09-05のJS: " +title: "2023-09-06のJS: " author: "azu" layout: post -date : 2023-09-05T23:12:26.304Z +date : 2023-09-06T02:16:22.995Z category: JSer tags: - nodejs @@ -43,7 +43,7 @@ Loaderの`load` hookがCommonJSをサポートし、非推奨の`require.extensi ## Release v4.0.0 · actions/checkout [github.com/actions/checkout/releases/tag/v4.0.0](https://github.com/actions/checkout/releases/tag/v4.0.0 "Release v4.0.0 · actions/checkout") -

Github Actions nodejs

+

Github Actions nodejs ReleaseNote

actions/checkout v4.0.0リリース。 Node.js 20を利用するように、`show-progress`オプションを追加など @@ -98,6 +98,18 @@ ByteDanceのJavaScript向けのウェブアプリケーションフレームワ Reactをベースにしたクライアントサイド向けのモデルやルーティング、Rspack/ESLint/Jestなどの統合、BFFのサポート、MicroFrontendのサポートなどをしている。 +---- +

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

+ +---- + +## measuredco/puck: The self-hosted drag and drop editor for React. +[github.com/measuredco/puck](https://github.com/measuredco/puck "measuredco/puck: The self-hosted drag and drop editor for React.") +

React editor library

+ +D&Dで編集できるビジュアルエディタのReactコンポーネントライブラリ + + ----

書籍関係

From 5328b7b88feb8fdeaecc9c142a6ac36b027d8d06 Mon Sep 17 00:00:00 2001 From: azu Date: Thu, 7 Sep 2023 06:06:54 +0000 Subject: [PATCH 09/13] Update 659 draft --- ...-09-06-659draft.md => 2023-09-07-659draft.md} | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) rename _i18n/ja/_posts/2023/{2023-09-06-659draft.md => 2023-09-07-659draft.md} (88%) diff --git a/_i18n/ja/_posts/2023/2023-09-06-659draft.md b/_i18n/ja/_posts/2023/2023-09-07-659draft.md similarity index 88% rename from _i18n/ja/_posts/2023/2023-09-06-659draft.md rename to _i18n/ja/_posts/2023/2023-09-07-659draft.md index 35752e032dc..7f8c1356e6f 100644 --- a/_i18n/ja/_posts/2023/2023-09-06-659draft.md +++ b/_i18n/ja/_posts/2023/2023-09-07-659draft.md @@ -1,13 +1,13 @@ --- -title: "2023-09-06のJS: " +title: "2023-09-07のJS: " author: "azu" layout: post -date : 2023-09-06T02:16:22.995Z +date : 2023-09-07T06:06:26.726Z category: JSer tags: - nodejs -- MicroFrontend - bundler +- MicroFrontend - architecture - GraphQL @@ -85,6 +85,16 @@ Vueなどが使うProxyの最適化を行うことで、TodoMVC-Vuewのパフォ Firefox 118のリリースにこの変更が含まれる予定。 +---- + +## How we reduced the size of our JavaScript bundles by 33% - Dropbox +[dropbox.tech/frontend/how-we-reduced-the-size-of-our-javascript-bundles-by-33-percent](https://dropbox.tech/frontend/how-we-reduced-the-size-of-our-javascript-bundles-by-33-percent "How we reduced the size of our JavaScript bundles by 33% - Dropbox") +

JavaScript bundler article

+ +Rollupを使ってCode Splitting/Tree Shakingを行うことでbundleサイズを小さくしたという話。 +一方でRollupはメモリ上に全てのコードを持つためCIのビルドが不安定になった点、細かいchunkだと圧縮効率があまりよくなかった点についてなど + + ----

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

From a2a31185604e4f42e54e1832fa5fe9d52cc20afe Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Thu, 7 Sep 2023 06:31:47 +0000 Subject: [PATCH 10/13] Update _i18n/ja/_posts/2023/2023-09-07-node.js-v20.6.0.env-rspack-.md --- .../2023-09-07-node.js-v20.6.0.env-rspack-.md | 145 ++++++++++++++++++ 1 file changed, 145 insertions(+) create mode 100644 _i18n/ja/_posts/2023/2023-09-07-node.js-v20.6.0.env-rspack-.md diff --git a/_i18n/ja/_posts/2023/2023-09-07-node.js-v20.6.0.env-rspack-.md b/_i18n/ja/_posts/2023/2023-09-07-node.js-v20.6.0.env-rspack-.md new file mode 100644 index 00000000000..1fb903ea77c --- /dev/null +++ b/_i18n/ja/_posts/2023/2023-09-07-node.js-v20.6.0.env-rspack-.md @@ -0,0 +1,145 @@ +--- +title: "2023-09-07のJS: Node.js v20.6.0(.env)、Rspackのアーキテクチャデザイン、" +author: "azu" +layout: post +date : 2023-09-07T06:06:26.726Z +category: JSer +tags: +- nodejs +- bundler +- MicroFrontend +- architecture +- GraphQL + +--- + +JSer.info #659 - - [Node v20.6.0 (Current) | Node.js](https://nodejs.org/ja/blog/release/v20.6.0) + +--- + +- [Design Trade-offs in Bundler: The Rationale Behind Creating Rspack · web-infra-dev/wg · Discussion #1](https://github.com/web-infra-dev/wg/discussions/1) + + +---- + +{% include inline-support.html %} + +---- + +

ヘッドライン

+ +---- + +## nitrogql 1.0 release | nitrogql blog +[nitrogql.vercel.app/blog/release-1.0](https://nitrogql.vercel.app/blog/release-1.0 "nitrogql 1.0 release | nitrogql blog") +

GraphQL Tools Rust nodejs TypeScript ReleaseNote

+ +GraphQLからクライアントコードの生成とGraphQLのクエリの型チェック行うnitrogql 1.0リリース。 + + +---- + +## Node v20.6.0 (Current) | Node.js +[nodejs.org/ja/blog/release/v20.6.0](https://nodejs.org/ja/blog/release/v20.6.0 "Node v20.6.0 (Current) | Node.js") +

nodejs ReleaseNote

+ +Node.js v20.6.0リリース。 +`.env`をビルトインサポート、`import.meta.resolve`をフラグなしで利用できるように、`module.register()` APIの追加。 +Loaderの`load` hookがCommonJSをサポートし、非推奨の`require.extensions`を使わなくてもCommonJSを扱うcustom loaderを書けるようになるなど + + +---- + +## Release v4.0.0 · actions/checkout +[github.com/actions/checkout/releases/tag/v4.0.0](https://github.com/actions/checkout/releases/tag/v4.0.0 "Release v4.0.0 · actions/checkout") +

Github Actions nodejs ReleaseNote

+ +actions/checkout v4.0.0リリース。 +Node.js 20を利用するように、`show-progress`オプションを追加など + + +---- +

アーティクル

+ +---- + +## Design Trade-offs in Bundler: The Rationale Behind Creating Rspack · web-infra-dev/wg · Discussion #1 +[github.com/web-infra-dev/wg/discussions/1](https://github.com/web-infra-dev/wg/discussions/1 "Design Trade-offs in Bundler: The Rationale Behind Creating Rspack · web-infra-dev/wg · Discussion #1") +

JavaScript bundler article architecture

+ +Rspackの開発の目的やwebpack/parcel/esbuild/rollupなどのbundlerのアーキテクチャについて。 +webpackにはデバッグやパフォーマンスの問題があり、Vite/Rollupも大規模プロジェクトではパフォーマンスにビルド環境の差異の問題があり、esbuildはプラグインの柔軟性に問題がある。 +RollupはESMのみが第一級市民であり、RspackはwebpackとParcelと同じく言語に依存しないことを目的にしている。 +それぞれのbundlerのプラグインAPIの設計と複雑性、ASTの再利用とパフォーマンスの問題、Tree ShakingをASTベースで行った場合の課題について。 +また、今後のRspackが目指す方向して簡単に使えるようにすること、デバッグをしやすくすること、最適化をwebpackと同等以上にすること、リモートキャッシュなどについて触れている。 + + +---- + +## Mofi - Snappy UIs With WebAssembly and Web Workers +[mofi.loud.red/blog/wasm-and-workers](https://mofi.loud.red/blog/wasm-and-workers "Mofi - Snappy UIs With WebAssembly and Web Workers") +

WebAssembly webworker article JavaScript

+ +WebAssemblyでの処理をWebWorkerの中で動かし、メインスレッドをブロックせずに処理を行うという話。 +CPUのコア数を超えてWorkerを増やすと問題があるため、ワーカープールを作成しWorker数を制御している。またWorkerから進捗状況をメッセージングする方法についてなど + + +---- + +## Faster Vue.js Execution in Firefox - Mozilla Hacks - the Web developer blog +[hacks.mozilla.org/2023/09/faster-vue-js-execution-in-firefox/](https://hacks.mozilla.org/2023/09/faster-vue-js-execution-in-firefox/ "Faster Vue.js Execution in Firefox - Mozilla Hacks - the Web developer blog") +

Firefox JavaScript performance article

+ +Vueなどが使うProxyの最適化を行うことで、TodoMVC-Vuewのパフォーマンスが40%改善される。 +Firefox 118のリリースにこの変更が含まれる予定。 + + +---- + +## How we reduced the size of our JavaScript bundles by 33% - Dropbox +[dropbox.tech/frontend/how-we-reduced-the-size-of-our-javascript-bundles-by-33-percent](https://dropbox.tech/frontend/how-we-reduced-the-size-of-our-javascript-bundles-by-33-percent "How we reduced the size of our JavaScript bundles by 33% - Dropbox") +

JavaScript bundler article

+ +Rollupを使ってCode Splitting/Tree Shakingを行うことでbundleサイズを小さくしたという話。 +一方でRollupはメモリ上に全てのコードを持つためCIのビルドが不安定になった点、細かいchunkだと圧縮効率があまりよくなかった点についてなど + + +---- +

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

+ +---- + +## Modern.js +[modernjs.dev/en](https://modernjs.dev/en "Modern.js") +

JavaScript library MicroFrontend

+ +ByteDanceのJavaScript向けのウェブアプリケーションフレームワーク。 +Reactをベースにしたクライアントサイド向けのモデルやルーティング、Rspack/ESLint/Jestなどの統合、BFFのサポート、MicroFrontendのサポートなどをしている。 + + +---- +

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

+ +---- + +## measuredco/puck: The self-hosted drag and drop editor for React. +[github.com/measuredco/puck](https://github.com/measuredco/puck "measuredco/puck: The self-hosted drag and drop editor for React.") +

React editor library

+ +D&Dで編集できるビジュアルエディタのReactコンポーネントライブラリ + + +---- +

書籍関係

+ +---- + +## Nuxt 3 フロントエンド開発の教科書:書籍案内|技術評論社 +[gihyo.jp/book/2023/978-4-297-13685-7](https://gihyo.jp/book/2023/978-4-297-13685-7 "Nuxt 3 フロントエンド開発の教科書:書籍案内|技術評論社") +

Vue library book

+ +2023年9月22日発売 +Nuxtについての書籍 + + +---- From a82dc4f17e7a9bdf2328b1b17c2f92e3fb462ba2 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Thu, 7 Sep 2023 06:31:48 +0000 Subject: [PATCH 11/13] Delete _i18n/ja/_posts/2023/2023-09-07-659draft.md --- _i18n/ja/_posts/2023/2023-09-07-659draft.md | 136 -------------------- 1 file changed, 136 deletions(-) delete mode 100644 _i18n/ja/_posts/2023/2023-09-07-659draft.md diff --git a/_i18n/ja/_posts/2023/2023-09-07-659draft.md b/_i18n/ja/_posts/2023/2023-09-07-659draft.md deleted file mode 100644 index 7f8c1356e6f..00000000000 --- a/_i18n/ja/_posts/2023/2023-09-07-659draft.md +++ /dev/null @@ -1,136 +0,0 @@ ---- -title: "2023-09-07のJS: " -author: "azu" -layout: post -date : 2023-09-07T06:06:26.726Z -category: JSer -tags: -- nodejs -- bundler -- MicroFrontend -- architecture -- GraphQL - ---- - -JSer.info #659 - ----- - -

ヘッドライン

- ----- - -## nitrogql 1.0 release | nitrogql blog -[nitrogql.vercel.app/blog/release-1.0](https://nitrogql.vercel.app/blog/release-1.0 "nitrogql 1.0 release | nitrogql blog") -

GraphQL Tools Rust nodejs TypeScript ReleaseNote

- -GraphQLからクライアントコードの生成とGraphQLのクエリの型チェック行うnitrogql 1.0リリース。 - - ----- - -## Node v20.6.0 (Current) | Node.js -[nodejs.org/ja/blog/release/v20.6.0](https://nodejs.org/ja/blog/release/v20.6.0 "Node v20.6.0 (Current) | Node.js") -

nodejs ReleaseNote

- -Node.js v20.6.0リリース。 -`.env`をビルトインサポート、`import.meta.resolve`をフラグなしで利用できるように、`module.register()` APIの追加。 -Loaderの`load` hookがCommonJSをサポートし、非推奨の`require.extensions`を使わなくてもCommonJSを扱うcustom loaderを書けるようになるなど - - ----- - -## Release v4.0.0 · actions/checkout -[github.com/actions/checkout/releases/tag/v4.0.0](https://github.com/actions/checkout/releases/tag/v4.0.0 "Release v4.0.0 · actions/checkout") -

Github Actions nodejs ReleaseNote

- -actions/checkout v4.0.0リリース。 -Node.js 20を利用するように、`show-progress`オプションを追加など - - ----- -

アーティクル

- ----- - -## Design Trade-offs in Bundler: The Rationale Behind Creating Rspack · web-infra-dev/wg · Discussion #1 -[github.com/web-infra-dev/wg/discussions/1](https://github.com/web-infra-dev/wg/discussions/1 "Design Trade-offs in Bundler: The Rationale Behind Creating Rspack · web-infra-dev/wg · Discussion #1") -

JavaScript bundler article architecture

- -Rspackの開発の目的やwebpack/parcel/esbuild/rollupなどのbundlerのアーキテクチャについて。 -webpackにはデバッグやパフォーマンスの問題があり、Vite/Rollupも大規模プロジェクトではパフォーマンスにビルド環境の差異の問題があり、esbuildはプラグインの柔軟性に問題がある。 -RollupはESMのみが第一級市民であり、RspackはwebpackとParcelと同じく言語に依存しないことを目的にしている。 -それぞれのbundlerのプラグインAPIの設計と複雑性、ASTの再利用とパフォーマンスの問題、Tree ShakingをASTベースで行った場合の課題について。 -また、今後のRspackが目指す方向して簡単に使えるようにすること、デバッグをしやすくすること、最適化をwebpackと同等以上にすること、リモートキャッシュなどについて触れている。 - - ----- - -## Mofi - Snappy UIs With WebAssembly and Web Workers -[mofi.loud.red/blog/wasm-and-workers](https://mofi.loud.red/blog/wasm-and-workers "Mofi - Snappy UIs With WebAssembly and Web Workers") -

WebAssembly webworker article JavaScript

- -WebAssemblyでの処理をWebWorkerの中で動かし、メインスレッドをブロックせずに処理を行うという話。 -CPUのコア数を超えてWorkerを増やすと問題があるため、ワーカープールを作成しWorker数を制御している。またWorkerから進捗状況をメッセージングする方法についてなど - - ----- - -## Faster Vue.js Execution in Firefox - Mozilla Hacks - the Web developer blog -[hacks.mozilla.org/2023/09/faster-vue-js-execution-in-firefox/](https://hacks.mozilla.org/2023/09/faster-vue-js-execution-in-firefox/ "Faster Vue.js Execution in Firefox - Mozilla Hacks - the Web developer blog") -

Firefox JavaScript performance article

- -Vueなどが使うProxyの最適化を行うことで、TodoMVC-Vuewのパフォーマンスが40%改善される。 -Firefox 118のリリースにこの変更が含まれる予定。 - - ----- - -## How we reduced the size of our JavaScript bundles by 33% - Dropbox -[dropbox.tech/frontend/how-we-reduced-the-size-of-our-javascript-bundles-by-33-percent](https://dropbox.tech/frontend/how-we-reduced-the-size-of-our-javascript-bundles-by-33-percent "How we reduced the size of our JavaScript bundles by 33% - Dropbox") -

JavaScript bundler article

- -Rollupを使ってCode Splitting/Tree Shakingを行うことでbundleサイズを小さくしたという話。 -一方でRollupはメモリ上に全てのコードを持つためCIのビルドが不安定になった点、細かいchunkだと圧縮効率があまりよくなかった点についてなど - - ----- -

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

- ----- - -## Modern.js -[modernjs.dev/en](https://modernjs.dev/en "Modern.js") -

JavaScript library MicroFrontend

- -ByteDanceのJavaScript向けのウェブアプリケーションフレームワーク。 -Reactをベースにしたクライアントサイド向けのモデルやルーティング、Rspack/ESLint/Jestなどの統合、BFFのサポート、MicroFrontendのサポートなどをしている。 - - ----- -

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

- ----- - -## measuredco/puck: The self-hosted drag and drop editor for React. -[github.com/measuredco/puck](https://github.com/measuredco/puck "measuredco/puck: The self-hosted drag and drop editor for React.") -

React editor library

- -D&Dで編集できるビジュアルエディタのReactコンポーネントライブラリ - - ----- -

書籍関係

- ----- - -## Nuxt 3 フロントエンド開発の教科書:書籍案内|技術評論社 -[gihyo.jp/book/2023/978-4-297-13685-7](https://gihyo.jp/book/2023/978-4-297-13685-7 "Nuxt 3 フロントエンド開発の教科書:書籍案内|技術評論社") -

Vue library book

- -2023年9月22日発売 -Nuxtについての書籍 - - ----- From 9d06d287be6b82119d3abf4a9789167c62ce8460 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Thu, 7 Sep 2023 06:43:57 +0000 Subject: [PATCH 12/13] Update _i18n/ja/_posts/2023/2023-09-07-node.js-v20.6.0.env-rspack-.md --- .../2023-09-07-node.js-v20.6.0.env-rspack-.md | 19 +++++++++++++++++-- 1 file changed, 17 insertions(+), 2 deletions(-) diff --git a/_i18n/ja/_posts/2023/2023-09-07-node.js-v20.6.0.env-rspack-.md b/_i18n/ja/_posts/2023/2023-09-07-node.js-v20.6.0.env-rspack-.md index 1fb903ea77c..2ab629353d0 100644 --- a/_i18n/ja/_posts/2023/2023-09-07-node.js-v20.6.0.env-rspack-.md +++ b/_i18n/ja/_posts/2023/2023-09-07-node.js-v20.6.0.env-rspack-.md @@ -13,12 +13,27 @@ tags: --- -JSer.info #659 - - [Node v20.6.0 (Current) | Node.js](https://nodejs.org/ja/blog/release/v20.6.0) +JSer.info #659 - Node.js v20.6.0がリリースされました + +- [Node v20.6.0 (Current) | Node.js](https://nodejs.org/ja/blog/release/v20.6.0) + +`.env`をビルトインサポート、`import.meta.resolve`をフラグなしで利用できるように、`module.register()` APIの追加などが行われています。 +Loaderの`load` hookがCommonJSをサポートし、非推奨の`require.extensions`を使わなくてもCommonJSを扱うcustom loaderを書けるようになるなどといった変更も含まれています。 + +しかし、このv20.6.0ではこのloaderの変更によりBabelなどが動かなくなっているため、v20.6.1で修正される予定です。 + +- [[v20.6] CJS runs repeatedly when there are circular dependencies when loaded by ESM · Issue #49497 · nodejs/node](https://github.com/nodejs/node/issues/49497) +- [esm: fix loading of (recursive) CJS modules from ESM by aduh95 · Pull Request #49500 · nodejs/node](https://github.com/nodejs/node/pull/49500) + --- -- [Design Trade-offs in Bundler: The Rationale Behind Creating Rspack · web-infra-dev/wg · Discussion #1](https://github.com/web-infra-dev/wg/discussions/1) +[Design Trade-offs in Bundler: The Rationale Behind Creating Rspack · web-infra-dev/wg · Discussion #1](https://github.com/web-infra-dev/wg/discussions/1)に、Rspackの開発の目的やwebpack/parcel/esbuild/rollupなどのbundlerのアーキテクチャについて書かれています。 + +それぞれのbundlerには長所と短所がありますが、出発点としてはesbuildとRollupのいいところを取り込んだRustバージョン作るところから始まった点について書かれています。 +その過程でプラグインAPIやJavaScript以外の言語を扱う仕組みの必要性などから、webpackのアーキテクチャと似たものが必要なことが分かり、Rspackはwebpack互換のアーキテクチャを採用することになったことが書かれています。 +それぞれのbundlerのアーキテクチャや現在の課題、今後の方向性などについても書かれています。 ---- From c83fb5494e1a64f2578d9ad85def799518327075 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Thu, 7 Sep 2023 06:44:17 +0000 Subject: [PATCH 13/13] Update _i18n/ja/_posts/2023/2023-09-07-node.js-v20.6.0.env-rspack-.md --- _i18n/ja/_posts/2023/2023-09-07-node.js-v20.6.0.env-rspack-.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/_i18n/ja/_posts/2023/2023-09-07-node.js-v20.6.0.env-rspack-.md b/_i18n/ja/_posts/2023/2023-09-07-node.js-v20.6.0.env-rspack-.md index 2ab629353d0..d97232d3a80 100644 --- a/_i18n/ja/_posts/2023/2023-09-07-node.js-v20.6.0.env-rspack-.md +++ b/_i18n/ja/_posts/2023/2023-09-07-node.js-v20.6.0.env-rspack-.md @@ -33,7 +33,7 @@ Loaderの`load` hookがCommonJSをサポートし、非推奨の`require.extensi それぞれのbundlerには長所と短所がありますが、出発点としてはesbuildとRollupのいいところを取り込んだRustバージョン作るところから始まった点について書かれています。 その過程でプラグインAPIやJavaScript以外の言語を扱う仕組みの必要性などから、webpackのアーキテクチャと似たものが必要なことが分かり、Rspackはwebpack互換のアーキテクチャを採用することになったことが書かれています。 -それぞれのbundlerのアーキテクチャや現在の課題、今後の方向性などについても書かれています。 +それぞれのbundlerのアーキテクチャ、Rspackの現在の課題、今後の方向性などについても書かれています。 ----