JSer.info #504 - Chrome 86 베타 릴리스
CSS 의사 클래스 :focus-visible, 의사 요소 ::marker를 지원하고
Document Policy, FetchEvent.handled, Shadow DOM Distribution API, ParentNode.replaceChildren() 등도 지원한다.
또, Origin Trial로서 WebHID API, Window placement API, <meta name="battery-savings"> 등을 시험적으로 사용할 수 있다.
그 외로 FTP 지원이 단계적인 폐지 단계에 있다.
Chrome 86에서는 FTP가 비권장되고 87에서는 기본적으로 해당 기능이 비활성화되며 88에서는 코드베이스에서 삭제 될 예정
Underscore 1.11.0 릴리스
이번 릴리스에는 ECMAScript Modules(ESM)를 대응하는 번들 파일이 추가됐다. 이를 위해 Underscore의 코드베이스를 각 함수 별로 모듈화(ES Modules) 했다.
또, 이를 진행한 Julian Gonggrijp가 Undescore 모듈 버전 이용 방법에 대한 글도 공개했다.
위 글에는 기존(모노리틱) 사용 방법부터 ES Modules 사용 방법, 빌드 크기 최적화, Underscore 2.0 등에 대해 작성돼 있다.
JavaScript 입문서 JavaScript Primer(일본어) 2.0이 릴리스 됐다.
- Release 2.0.0: ECMAScript 2020対応 · asciidwango/js-primer
- JavaScript Primer 2.0 - ECMAScript 2020에 대응한 입문서를 공개했습니다 | Web Scratch(일본어)
JavaScript Primer 2.0에는 ES2020에 추가된 String.prototype.matchAll, globalThis, BigInt, Nullish coalescing(??), Optional chainin（?.）에 대한 내용이 포함됐다.
헤드라인
Release 13.7.0 · stylelint/stylelint
github.com/stylelint/stylelint/releases/tag/13.7.0
stylelint 13.7.0 릴리스.
*-blacklist, *-requirelist, *-whitelist가 비권장화 되고 *-disallowed-list, *-required-list으로 이름이 변경됐다.
stylelint-disable 코멘트에 설명구를 작성할 수 있다.
ESLint v7.8.0 released - ESLint - Pluggable JavaScript linter
eslint.org/blog/2020/08/eslint-v7.8.0-released
ESLint 7.8.0 릴리스.
ecmaScript 옵션으로 2021를 사용할 수 있고 Logical assignment operators, numeric separators를 대응한다.
Release v4.0.0 · typescript-eslint/typescript-eslint
github.com/typescript-eslint/typescript-eslint/releases/tag/v4.0.0
TypeScript-ESLint 4.0.0 릴리스.
Optional Chaining과 decorators의 AST 변경, Scope 해석을 개선하여 결과적으로 no-unused-vars 등의 규칙 개선, ban-ts-comment의 기본값이 변경 됐다.
또, TypeScript 4.0에는 TypeScript-ESLint 3.10.0으로 대응하고 있다.
webpack 5 release plan · Issue #11406 · webpack/webpack
github.com/webpack/webpack/issues/11406
webpack 5 릴리스 계획.
webpack 5는 2020년 10월 10일 릴리스 될 예정이며 RC는 9월에 릴리스.
사소한 버그는 webpack 5 릴리스 후에 수정할 예정.
Chromium Blog: Chrome 86: Improved Focus Highlighting, WebHID, and More
blog.chromium.org/2020/09/chrome-86-improved-focus-highlighting.html
Chrome 86 베타 릴리스.
CSS 의사 클래스 :focus-visible, 의사 요소의 ::marker 지원.
Document Policy, FetchEvent.handled, Shadow DOM Distribution API, ParentNode.replaceChildren() 지원.
또, Origin Trial로서 WebHID API, Window placement API, <meta name="battery-savings"> 등 지원.
그 외로 FTP 지원이 비권장 됐다.
- window-placement/EXPLAINER.md at master · webscreens/window-placement
- battery-savings/explainer.md at master · chrishtr/battery-savings
Underscore.js
underscore 1.10.0 릴리스.
각 함수를 별도의 ES Modules로 작성하고 ES Modules의 엔트리포인트로 underscore-esm.js가 추가됐다.
_.isArrayBuffer, _.isDataView, _.isTypedArray가 추가됐고 _.flatten에서 깊이를 지정할 수 있는 두 번재 인수를 지원한다.
Update on Adobe Flash Player End of Support - Microsoft Edge Blog
blogs.windows.com/msedgedev/2020/09/04/update-adobe-flash-end-support/
MSEdge는 Flash Player를 2021년 1월 Edge 88에서 삭제할 예정.
이 삭제 계획은 Chromium에 맞춘 것으로 보인다.
아티클
Minimal React: getting started with the frontend library
2ality.com/2020/08/minimal-react.html
snowpack, react, htm, immer를 이용해 설명하는 React 튜토리얼.
Introducing: Modern Web
modern-web.dev/blog/introducing-modern-web/
웹 개발 범용 도구와 가이드를 개발하는 Modern Web 프로젝트 소개.
먼저 Web Test Runner라는 브라우저를 사용한 테스트 도구를 릴리스하고 있다.
향후 Web Dev Server와 같은 개발용 서버나 개발 가이드 등도 추가해 나갈 것으로 보인다.
Introducing Modular Underscore—Julian Gonggrijp
juliangonggrijp.com/article/introducing-modular-underscore.html
underscore 1.11.0의 ES Modules 이전과 해당 모듈을 이용하는 방법 소개.
기존(모노리틱) 사용 방법과 ES Modules 사용 방법, 빌드 크기 최적화, Underscore 2.0에 대해서 이야기한다.
Browsers may throttle requestAnimationFrame
mattperry.is/writing-code/browsers-may-throttle-requestanimationframe-to-30fps
requestAnimationFrame의 프레임 레이트가 브라우저에 의해 억제되는 경우를 소개.
iOS의 low-power mode, Safari의 cross-origin iframes 조건 아래에 억제되는 경우를 설명,
또, Firefox에서 performance.now()의 정밀도가 떨어지는 부분과 cross-origin isolate에 대해서도 언급하고 있다.
소프트웨어, 도구, 라이브러리
andnp/SimplyTyped: yet another Typescript type library for advanced types
TypeScript 타입 유틸리티 라이브러리.
타입 정의 보조와 런타임 보조 함수 등을 제공한다.
mizchi/minlink: Minimum(> 1kb) and isomorphic worker wrapper with comlink like rpc.
Web Worker / Node.js의 worker_thread에서 RPC를 하기 위한 라이브러리.
comlink 처럼 함수를 호출해 postMessage를 주고받는다.
도서
이 책에 대해서 · JavaScript Plugin Architecture
azu.github.io/JavaScript-Plugin-Architecture/(일본어)
JavaScript의 플러그인 아키텍처를 주제로 한 작은 크기의 책.
jQuery, ESLint, Connect, gulp, Redux의 플러그인 구조를 구현하면서 이해할 수 있도록 소개.
Release 2.0.0: ECMAScript 2020 대응 · asciidwango/js-primer
github.com/asciidwango/js-primer/releases/tag/v2.0.0(일본어)
JavaScript 입문서 JavaScript Primer 2.0.0 릴리스.
ES2020의 String.prototype.matchAll, globalThis, BigInt, Nullish coalescing(??), Optional chainin（?.） 대응.
