|
| 1 | +--- |
| 2 | +title: "2021-07-20のJS: Node.js 16.5.0(WHATWG Stream)、npm 7.20.0(`npm pkg`)、Ember 4のロードマップ" |
| 3 | +author: "azu" |
| 4 | +layout: post |
| 5 | +date : 2021-07-20T02:16:58.055Z |
| 6 | +category: JSer |
| 7 | +tags: |
| 8 | +- node.js |
| 9 | +- Vue |
| 10 | +- ECMAScript |
| 11 | +- proposal |
| 12 | +- CSS |
| 13 | + |
| 14 | +--- |
| 15 | + |
| 16 | +JSer.info #549 - Node.js 16.5.0がリリースされました。 |
| 17 | + |
| 18 | +- [Node v16.5.0 (Current) | Node.js](https://nodejs.org/en/blog/release/v16.5.0/) |
| 19 | + |
| 20 | +16.5.0では試験的に、WHATWGで仕様策定されウェブブラウザに実装されている[WHATWG Streams API](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API)が実装されました。(`stream/web`) |
| 21 | +Node.jsでは、すでに[Node.js Stream](https://nodejs.org/api/stream.html) APIがありますが、これとは異なる実装です。 |
| 22 | + |
| 23 | +Node.js StreamとWHAWG STreamの違いについては次のドキュメントにも書かれています。 |
| 24 | + |
| 25 | +- [streams/FAQ.md at main · whatwg/streams](https://github.com/whatwg/streams/blob/main/FAQ.md#what-are-the-main-differences-between-these-streams-and-nodejs-streams) |
| 26 | + |
| 27 | +Node.jsでWHATWG Streamを実装している理由としてはQUIC/HTTP3のサポートなどが挙げられています。 |
| 28 | + |
| 29 | +- [HTTP/3 support · Issue #38478 · nodejs/node](https://github.com/nodejs/node/issues/38478) |
| 30 | + |
| 31 | +また、Node.js StreamとWHATWGT Streamの棲み分けや相互運用性については次のIssueで議論されています。 |
| 32 | + |
| 33 | +- [Future of streams · Issue #39093 · nodejs/node](https://github.com/nodejs/node/issues/39093) |
| 34 | + |
| 35 | +---- |
| 36 | + |
| 37 | +npm 7.20.0がリリースされました。 |
| 38 | + |
| 39 | +- [Release v7.20.0 · npm/cli](https://github.com/npm/cli/releases/tag/v7.20.0) |
| 40 | + |
| 41 | +npm 7.20.0では、`package.json`の任意のフィールドを読み書きできる`npm pkg`コマンドが追加されています。 |
| 42 | + |
| 43 | +- [feat: npm pkg by ruyadorno · Pull Request #3487 · npm/cli](https://github.com/npm/cli/pull/3487/files) |
| 44 | + |
| 45 | +--- |
| 46 | + |
| 47 | +[The Road to Ember 4.0](https://blog.emberjs.com/the-road-to-ember-4-0/)という記事では、Ember 4のロードマップが公開されています。 |
| 48 | + |
| 49 | +Ember 4は2021年9月20日にリリース予定としています。 |
| 50 | +Emberではメジャーアップデートには新しい機能は含まないため、DeprecatedなAPIの削除、Ember Classicが廃止などが中心となります。 |
| 51 | + |
| 52 | +それぞれのマイグレーションガイドも公開されています。 |
| 53 | + |
| 54 | +- [Ember.js - Deprecations](https://deprecations.emberjs.com/v3.x/) |
| 55 | +- [Introduction - Octane Upgrade Guide - Ember Guides](https://guides.emberjs.com/v3.27.0/upgrading/current-edition/) |
| 56 | + |
| 57 | +また、Ember 4ではIEをサポートしない予定となっています。 |
| 58 | + |
| 59 | +- [Browser Support - Ember.js](https://emberjs.com/browser-support/) |
| 60 | + |
| 61 | +---- |
| 62 | + |
| 63 | +<h1 class="site-genre">ヘッドライン</h1> |
| 64 | + |
| 65 | +---- |
| 66 | + |
| 67 | +## Node v16.5.0 (Current) | Node.js |
| 68 | +[nodejs.org/en/blog/release/v16.5.0/](https://nodejs.org/en/blog/release/v16.5.0/ "Node v16.5.0 (Current) | Node.js") |
| 69 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">node.js</span> <span class="jser-tag">ReleaseNote</span></p> |
| 70 | + |
| 71 | +Node.js 16.5.0リリース。 |
| 72 | +WHATWG Stream APIを試験的にサポート。 |
| 73 | + |
| 74 | + |
| 75 | +---- |
| 76 | + |
| 77 | +## Release v1.0.0 · vuejs/composition-api |
| 78 | +[github.com/vuejs/composition-api/releases/tag/v1.0.0](https://github.com/vuejs/composition-api/releases/tag/v1.0.0 "Release v1.0.0 · vuejs/composition-api") |
| 79 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">Vue</span> <span class="jser-tag">library</span> <span class="jser-tag">ReleaseNote</span></p> |
| 80 | + |
| 81 | +Vue 2向けのComposition APIを提供する@vue/composition-api 1.0.0リリース。 |
| 82 | + |
| 83 | + |
| 84 | +---- |
| 85 | + |
| 86 | +## Release v7.20.0 · npm/cli |
| 87 | +[github.com/npm/cli/releases/tag/v7.20.0](https://github.com/npm/cli/releases/tag/v7.20.0 "Release v7.20.0 · npm/cli") |
| 88 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">npm</span> <span class="jser-tag">ReleaseNote</span></p> |
| 89 | + |
| 90 | +npm 7.20.0リリース。 |
| 91 | +`package.json`の値を読み書きできる`npm pkg`コマンドの追加、`npm config`に`--location`フラグの追加など |
| 92 | + |
| 93 | + |
| 94 | +---- |
| 95 | + |
| 96 | +## Release v6.0.0 · riot/riot |
| 97 | +[github.com/riot/riot/releases/tag/v6.0.0](https://github.com/riot/riot/releases/tag/v6.0.0 "Release v6.0.0 · riot/riot") |
| 98 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">library</span> <span class="jser-tag">ReleaseNote</span></p> |
| 99 | + |
| 100 | +Riot.js 6.0.0リリース。 |
| 101 | +TypeScriptでcastがエラーとなる問題の修正、より厳密な型定義へ変更など |
| 102 | + |
| 103 | + |
| 104 | +---- |
| 105 | + |
| 106 | +## Deno 1.12 Release Notes | Deno Blog |
| 107 | +[deno.com/blog/v1.12](https://deno.com/blog/v1.12 "Deno 1.12 Release Notes | Deno Blog") |
| 108 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">deno</span> <span class="jser-tag">ReleaseNote</span></p> |
| 109 | + |
| 110 | +Deno 1.12リリース。 |
| 111 | +Web Crypto APIの改善、REPLでTypeScriptのコードとimport文のサポート、`MessagePort`と`MessageChannel`のサポート。 |
| 112 | +`deno test`に`--shuffle`と`--fail-test`の追加、`fetch`にProxyするための`client`オプションの追加。 |
| 113 | +`WeakRef`のバグ修正、Chrome DevToolsの対応改善など |
| 114 | + |
| 115 | +- [Release v1.12.0 · denoland/deno](https://github.com/denoland/deno/releases/tag/v1.12.0 "Release v1.12.0 · denoland/deno") |
| 116 | +- [Deno 1.12.0 がリリースされたので新機能や変更点の紹介](https://zenn.dev/magurotuna/articles/deno-release-note-1-12-0 "Deno 1.12.0 がリリースされたので新機能や変更点の紹介") |
| 117 | + |
| 118 | +---- |
| 119 | + |
| 120 | +## ECMAScript proposal updates @ 2021-07 | ECMAScript Daily |
| 121 | +[ecmascript-daily.github.io/ecmascript/2021/07/19/ecmascript-proposal-update](https://ecmascript-daily.github.io/ecmascript/2021/07/19/ecmascript-proposal-update "ECMAScript proposal updates @ 2021-07 | ECMAScript Daily") |
| 122 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">ECMAScript</span> <span class="jser-tag">proposal</span> <span class="jser-tag">news</span></p> |
| 123 | + |
| 124 | +2021年7月のTC39 MeetingでStageが変更されたProposalのまとめ。 |
| 125 | +Private FieldsのBrand ChecksがStage 4へ、RealmsがStage 3となった |
| 126 | + |
| 127 | + |
| 128 | +---- |
| 129 | + |
| 130 | +## Release v4.0.0 · mongodb/node-mongodb-native |
| 131 | +[github.com/mongodb/node-mongodb-native/releases/tag/v4.0.0](https://github.com/mongodb/node-mongodb-native/releases/tag/v4.0.0 "Release v4.0.0 · mongodb/node-mongodb-native") |
| 132 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">node.js</span> <span class="jser-tag">MongoDB</span> <span class="jser-tag">library</span> <span class="jser-tag">ReleaseNote</span></p> |
| 133 | + |
| 134 | +MongoDB Node.js Driver 4.0リリース。 |
| 135 | +MongoDB 5.0をサポート。 |
| 136 | +Time Series Collectionsをサポート、SecondaryでSnapshotの読み取りをサポートなど |
| 137 | + |
| 138 | +- [Launched Today: MongoDB 5.0, Serverless Atlas, and the Evolution of our Application Data Platform | MongoDB](https://www.mongodb.com/blog/post/launched-today-mongodb-5-0-serverless-atlas-evolution-application-data-platform "Launched Today: MongoDB 5.0, Serverless Atlas, and the Evolution of our Application Data Platform | MongoDB") |
| 139 | + |
| 140 | +---- |
| 141 | +<h1 class="site-genre">アーティクル</h1> |
| 142 | + |
| 143 | +---- |
| 144 | + |
| 145 | +## Vue 3 Migration Build: safely upgrade your app to Vue 3 (Pt. 1) | Vue Mastery |
| 146 | +[www.vuemastery.com/blog/vue-3-migration-build/](https://www.vuemastery.com/blog/vue-3-migration-build/ "Vue 3 Migration Build: safely upgrade your app to Vue 3 (Pt. 1) | Vue Mastery") |
| 147 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">Vue</span> <span class="jser-tag">article</span></p> |
| 148 | + |
| 149 | +`@vue/compat`を使ったVue 3へのマイグレーションについての記事 |
| 150 | + |
| 151 | + |
| 152 | +---- |
| 153 | + |
| 154 | +## The Road to Ember 4.0 |
| 155 | +[blog.emberjs.com/the-road-to-ember-4-0/](https://blog.emberjs.com/the-road-to-ember-4-0/ "The Road to Ember 4.0") |
| 156 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">Ember</span> <span class="jser-tag">JavaScript</span> <span class="jser-tag">article</span></p> |
| 157 | + |
| 158 | +Ember 4.0のロードマップについて。 |
| 159 | +Ember 4は2021年9月20日にリリース予定。 |
| 160 | +Emberのメジャーアップデートには新しい機能は含まないため、DeprecatedなAPIの削除、Ember Classicが廃止となりOctaneへのアップデートを推奨。 |
| 161 | +また、IEのサポートを終了予定。 |
| 162 | + |
| 163 | + |
| 164 | +---- |
| 165 | + |
| 166 | +## The performance effects of too much lazy-loading |
| 167 | +[web.dev/lcp-lazy-loading/](https://web.dev/lcp-lazy-loading/ "The performance effects of too much lazy-loading") |
| 168 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">performance</span> <span class="jser-tag">article</span></p> |
| 169 | + |
| 170 | +HTTP Archiveのデータによる`loading=lazy`はウェブサイトの17%で使われていて、その大部分はWordPressのサイトとなっている。 |
| 171 | +WordPressのサイトはLazy LoadingをAbove the foldな画像に対しても行っていたため、Lazy Loadしない場合に比べてLCPが悪化している問題について。 |
| 172 | + |
| 173 | + |
| 174 | +---- |
| 175 | +<h1 class="site-genre">スライド、動画関係</h1> |
| 176 | + |
| 177 | +---- |
| 178 | + |
| 179 | +## tc39\_study\_2 - Speaker Deck |
| 180 | +[speakerdeck.com/jxck/tc39-study-2](https://speakerdeck.com/jxck/tc39-study-2 "tc39\_study\_2 - Speaker Deck") |
| 181 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">ECMAScript</span> <span class="jser-tag">proposal</span> <span class="jser-tag">slide</span></p> |
| 182 | + |
| 183 | +ECMAScript Proposal紹介の詰め合わせ的なスライド |
| 184 | + |
| 185 | + |
| 186 | +---- |
| 187 | +<h1 class="site-genre">サイト、サービス、ドキュメント</h1> |
| 188 | + |
| 189 | +---- |
| 190 | + |
| 191 | +## mrbbot/miniflare: 🔥 Fully-local Cloudflare Workers Simulator |
| 192 | +[github.com/mrbbot/miniflare](https://github.com/mrbbot/miniflare "mrbbot/miniflare: 🔥 Fully-local Cloudflare Workers Simulator") |
| 193 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">cloudflare</span> <span class="jser-tag">debug</span></p> |
| 194 | + |
| 195 | +Cloudflare Workersのローカルで動くシミュレータツール。 |
| 196 | +ローカル開発時に`wrangler dev`の代わりとして利用できる |
| 197 | + |
| 198 | + |
| 199 | +---- |
| 200 | +<h1 class="site-genre">ソフトウェア、ツール、ライブラリ関係</h1> |
| 201 | + |
| 202 | +---- |
| 203 | + |
| 204 | +## elad2412/the-new-css-reset: The New Simple and Lighter CSS Reset |
| 205 | +[github.com/elad2412/the-new-css-reset](https://github.com/elad2412/the-new-css-reset "elad2412/the-new-css-reset: The New Simple and Lighter CSS Reset") |
| 206 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">CSS</span> <span class="jser-tag">library</span></p> |
| 207 | + |
| 208 | +`unset`や`:where`などの新しい機能を使ったCSS resetライブラリ |
| 209 | + |
| 210 | + |
| 211 | +---- |
| 212 | + |
| 213 | +## grafana/k6: A modern load testing tool, using Go and JavaScript - https://k6.io |
| 214 | +[github.com/grafana/k6](https://github.com/grafana/k6 "grafana/k6: A modern load testing tool, using Go and JavaScript - https://k6.io") |
| 215 | +<p class="jser-tags jser-tag-icon"><span class="jser-tag">golang</span> <span class="jser-tag">JavaScript</span> <span class="jser-tag">TEST</span></p> |
| 216 | + |
| 217 | +GoとJavaScriptを使った負荷テストツール。 |
| 218 | +JavaScriptでスクリプトを書いて、負荷/性能テストができる。 |
| 219 | + |
| 220 | +- [Our exciting next step - k6 is now part of Grafana Labs!](https://k6.io/blog/joining-grafana-labs/ "Our exciting next step - k6 is now part of Grafana Labs!") |
| 221 | + |
| 222 | +---- |
0 commit comments