Fork me on GitHub

2019-06-25のJS: ESLint 6.0.0、Vue Function API、Google検索とService Worker

Edit on GitHub 編集履歴を見る

JSer.info #441 - ESLint 6.0.0がリリースされました。

メジャーアップデートであるため破壊的な変更が含まれています。
6.0.0ではeslint:recommendedの設定が変更され、次のルールが追加されています。

また、eslint:recommendedの設定から次のルールが取り除かれています。

詳細は次のページを参照してください。

またプラグインの読み込み時の動作変更、不正な設定値のチェックの厳密化、正規表現をオプション値として受け付ける場合にuフラグをデフォルトにする変更などが含まれています。


次期Vueで導入を計画しているFunction-based Component APIのRFC(Request for Comments)が公開されています。

Vue 3.xを対象に後方互換性を保った新しい機能としてFunction-based Component APIを導入するProposalとなっています。
テンプレートの構文などはそのままで、コンポーネントのライフサイクルに関する部分をReact Hooksのような関数ベースで書けるようにする提案です。

すでにVue 2.xでもRFCの動作を再現したプラグインが公開されていますが、公式でも2.xで動作するプラグインを提供する予定とのことです。

まだRFCなのでどのように実装するかは決まっていませんが、興味がある人は次のIssueを見るとよさそうです。


Bringing service workers to Google Search  |  web.devという記事ではGoogle検索でService Workerをどのように導入し配信しているかについて書かれています。

Navigation Preloadでのオーバーヘッドの対応、SWのScopeの問題とルーティング、SWでクッキーが扱えない問題の対応、ユーザー毎にSWスクリプトの動的作成など実際におきた問題ベースで解説されています。またSWスクリプトのHTTPヘッダをCache-Control: private, max-age=1500で配信している理由やアプリに合わせたSWの設定が必要といった話も書かれています。


ヘッドライン


V8 release v7.6 · V8

v8.dev/blog/v8-release-76

V8 ReleaseNote

V8 7.6リリース。
JSON.parseObject.freezeされた配列のパフォーマンス改善。
ES ProposalのPromise.allSettledの実装、BigIntIntl.DateTimeFormatの対応改善など


The npm Blog — Protecting Package Publishers: npm Token Security...

blog.npmjs.org/post/185680936500/protecting-package-publishers-npm-token-security

npm Github security

GitHubにnpmのtokenが誤って公開された場合に自動的にrevokeされるようになった。


Introducing Microsoft Edge preview builds for Windows 7, Windows 8, and Windows 8.1 - Microsoft Edge Blog

blogs.windows.com/msedgedev/2019/06/19/introducing-microsoft-edge-preview-builds-for-windows-7-windows-8-and-windows-8-1/

MSEdge ReleaseNote

Chromium版MSEdgeのプレビュービルドがWindows 7、8、8.1に対応した。


ESLint v6.0.0 released -

eslint.org/blog/2019/06/eslint-v6.0.0-released

ESLint ReleaseNote

ESLint 6.0.0リリース。
eslint:recommendedのルール更新、プラグインの読み込み時の動作変更、不正な設定値のチェックの厳密化、正規表現をオプション値として受け付ける場合にuフラグをデフォルトとするように変更など


[Release News] TOAST UI Grid 4.0 is Finally Here! - TOAST UI - Medium

medium.com/@toastui/release-news-toast-ui-grid-4-0-is-finally-here-585934ddf091

JavaScript library ReleaseNote

Preactを使ったグリッドUIライブラリのTOASTUI Grid 4.0リリース。
ファイルサイズの削減、TypeScriptに書き換え、Column Virtual Scrollの対応など


rfcs/0000-function-api.md at function-apis · vuejs/rfcs

github.com/vuejs/rfcs/blob/function-apis/active-rfcs/0000-function-api.md

Vue proposal issue

VueにReact HooksのようなFunction-basedコンポーネントを導入するRFCが公開された。
Vue 2.x、3.xを対象に後方互換性を保った新しい機能として追加するProposal。


アーティクル


Why we prefer CSS Custom Properties to SASS variables | CodyHouse

codyhouse.co/blog/post/css-custom-properties-vs-sass-variables

CSS article

Sassの変数とCSS Custom Propertiesの役割の違いについて。
CSS Custom Propertiesを使った場合の利点についてなど


React-axe で React アプリケーションのアクセシビリティを向上させる - Mercari Engineering Blog

tech.mercari.com/entry/2019/06/18/190000

React article accessibility

React-axeでReactアプリケーションのアクセシビリティについてをチェックすることについて。
React-axeで自動的にチェックできる項目とできない項目についてなど


Bringing service workers to Google Search  |  web.dev

web.dev/google-search-sw/

JavaScript ServiceWorker article

Google検索でのService Worker利用と工夫について。
Navigation Preloadでのオーバーヘッドの対応、SWのScopeの問題とルーティング、SWでクッキーが扱えない問題の対応、ユーザー毎にSWスクリプトの動的作成。
SWスクリプトのCache-Controlの設定、アプリに合わせたSWの設定についてなど


Array.prototype.flat and Array.prototype.flatMap · V8

v8.dev/features/array-flat-flatmap

JavaScript ECMAScript article

ES2019で入る予定のArray#flatとArray#flatMapの使い方について


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


yankouskia/get-browser: 💻 Lightweight tool to identify the browser (+ mobile/desktop detection)📱

github.com/yankouskia/get-browser/

JavaScript library

UserAgentベースのブラウザ判定ライブラリ


pirix-gh/ts-toolbelt: 👷 Higher type safety for TypeScript

github.com/pirix-gh/ts-toolbelt

TypeScript library

TypeScriptの型ユーティリティライブラリ


daybrush/scenejs: 🎬 Scene.js is JavaScript & CSS timeline-based animation library

github.com/daybrush/scenejs

JavaScript animation library

CSS Animationベースのアニメーションライブラリ


microsoft/just: The task library that just works

github.com/microsoft/just

JavaScript Tools

Task Runner/Build library。
just-taskではgulpのようにタスクを定義して実行できる。just-scriptsというTypeScript/Jest/webpackなどを簡単に扱えるビルドライブラリが用意されている。


この記事へ修正リクエストをする
記事を紹介する