JSer.info #443 - Babel 7.5.0がリリースされました。
現在Stage 1 ProposalsであるPipeline Operatorの変換がサポートされています。
2019年6月のTC39 MeetingでDynamic ImportがStage 4となりました。(ES2020にDynamic Importが入る)
そのため、Babelでも@babel/preset-envがDynamic Importをデフォルトでサポートするようになりました。
(今までは別途プラグインが必要になっていた)
また、babel/plugin-transform-typescript
がallowNamespaces
というオプションでTypeScriptのnamespacesを試験的にサポートしています。
Reactを使ったフレームワークであるNext.js 9がリリースされました。
Next.js 6で@zeit/next-typescript
を使ったTypeScriptが入っていましたが、Next.js 9でTypeScriptのビルトインサポートしています。
また、path-to-regexp形式でDynamically Routingのサポート、api/
に置いたファイルがAPIになるAPI Routesのサポートしています。
その他にもページごとのconfigを設定できるようになり、ビルドの最適化などが含まれています。
JSer.infoをサポートするには
- 😘 知り合いにJSer.infoをおすすめする
- ❤️ GitHub Sponsorsで@azuのスポンサーになる
- 🐦 X(Twitter)で@jser_infoをフォローする
JSer.info Sponsors
JSer.info SponsorsはGitHub SponsorsとしてJSer.infoを支援してくれている方々です。
ヘッドライン
Release v7.5.0 · babel/babel
github.com/babel/babel/releases/tag/v7.5.0
Babel 7.5.0リリース。
dynamic importのサポートを@babel/preset-env
に追加、
babel-plugin-transform-typescript
がnamespaceをサポートなど
Release 0.7.0 · markedjs/marked
github.com/markedjs/marked/releases/tag/v0.7.0
marked 0.7.0リリース。
XSS脆弱性を修正、sanitize
とsanitizer
オプションを非推奨化しDOMPurifyなどの外部ライブラリの利用を推奨するように変更。
TableサポートをGFMオプションに移動など
Announcing React Native 0.60 · React Native
facebook.github.io/react-native/blog/2019/07/03/version-60
React Native 0.60リリース。
アクセシビリティの改善、スタート画面の変更、AndroidXのサポート、CocoaPodsの対応改善、コアからコミュニティに移動したNetInfo
、WebView
、Geolocation
を削除など
Blog - Next.js 9 | Next.js
Next.js 9リリース。
TypeScriptのビルトインサポート、Next.jsのコアをTypeScriptで書き直し、Dynamically Routingのサポート、api/
でAPI Routesのサポート。
また、ページごとのconfigをサポート、ビルドの最適化など
Node v12.6.0 (Current) | Node.js
nodejs.org/en/blog/release/v12.6.0/
Node.js 12.6.0リリース。
child_process.exec
/execFile
の返すPromiseオブジェクトがchild
プロパティを持つように、process.resourceUsage()
の追加など
アーティクル
Automatically detect memory leaks with Puppeteer - Article by Christoph Guttandin - Media Codings
media-codings.com/articles/automatically-detect-memory-leaks-with-puppeteer
Puppeteerを使ってウェブページのメモリリークテストを書く方法について。
page.queryObjects
を使って処理前後のHeapにあるオブジェクトの数を比較することでテストする方法について
- page.evaluateHandle(pageFunction[, ...args])
- page.queryObjects(prototypeHandle)
- standardized-audio-context/memory.js at master · chrisguttandin/standardized-audio-context
Request.destinationでリソースの種類別にキャッシュ戦略 | フロントエンドBlog | ミツエーリンクス
www.mitsue.co.jp/knowledge/blog/frontend/201907/05_0944.html
Fetch APIのRequest.destination
について。
Service Workerで取得先のリソースの種類に応じたキャッシュの切り分けなどについて
Using Slots In Vue.js — Smashing Magazine
www.smashingmagazine.com/2019/07/using-slots-vue-js/
VueのSlotについての記事。
<slot>
の使い方、v-slot
ディレクトティブ、Scoped Slotについて。
また再利用可能なコンポーネントの書き方についてなど
Fetch API: Building a Fetch Polyfill From Scratch (For Fun and Promise)
www.valentinog.com/blog/fetch-api/
Fetch APIの簡単なPolyfillを書きながら、Fetch APIとPromiseについて学ぶ記事。
CSS Custom Properties In The Cascade — Smashing Magazine
www.smashingmagazine.com/2019/07/css-custom-properties-cascade/
CSS Custom Propertiesについての記事。
コンポーネント側の変数の定義とカスケーディング、コンポーネントとCSS Custom Propertiesなど応用的な内容
ソフトウェア、ツール、ライブラリ関係
tilk/digitaljs: Teaching-focused digital circuit simulator
ブラウザで動作する教育用の電子回路シミュレータ
jsdoctypeparser/jsdoctypeparser: Parser module for JsDoc or Closure Compiler format type-annotation.
github.com/jsdoctypeparser/jsdoctypeparser
JSDocパーサライブラリ。
Closure Compiler形式、TypeScript形式などに対応していて、JSDocをパースしてASTを出力する。
greggman/twgl.js: A Tiny WebGL helper Library
WebGLヘルパーライブラリ
frenic/csstype: Strict TypeScript and Flow types for style based on MDN data
MDNのデータをつかいCSSプロパティのTypeScript型定義を生成したライブラリ