JSer.info #335 - Safari 11.0의 릴리즈 노트가 공개됐습니다.
JavaScript 관련해서는 WebRTC, WebAssembly, Media Capture API, WebCrypto API 알고리즘이 추가됐고 Resource timing API를 지원하여 CSS 관련해서는 Variable fonts, CSS stroke 지원이 이뤄졌습니다.
또, Mobile Safari나 Chrome for Android의 정책 사항인 MediaElement 자동 재생 제한이 macOS의 Safari에도 적용됐습니다.
Safari 11.0는 아직 릴리즈 안됐지만 거의 Safari Technology Preview 32와 동일한 버전일 것 같습니다.
완고한(Opinionated) 코드 포맷팅 도구인 Prettier 1.4.0이 릴리즈됐습니다.
1.4.0에서는 TypeScript와 PostCSS(CSS, Less, SCSS)의 포맷팅도 지원합니다.
또, 에디터 용 API로써 cursorOffset 옵션이 추가됐습니다.
필자가 시험해 본 Prettier의 TypeScript(TSX)와 CSS 포맷팅 예는 아래 저장소를 통해 살펴볼 수 있습니다.
ESLint 4.0.0이 릴리즈됐습니다.
eslint:recommended가 변경됐고 indent 규칙이 더 엄격하게 동작하도록 변경 됐으며 space-before-function-paren 등 일부 규칙의 기본값이 변경됐습니다. 또, 설정 파일(.eslintrc)이 보다 엄밀하게 검사되도록 강화됐습니다.
3.x에서 4.0.0으로 버전업하기 위한 마이그레이션 가이드는 아래 문서에 공개돼 있습니다.
헤드라인
Release v3.0.0-rc.0 · webpack/webpack
github.com/webpack/webpack/releases/tag/v3.0.0-rc.0
webpack 3.0.0 RC0이 릴리즈됐습니다.
Rollup 처럼 Scope Hoisting(inlining)을 할 수 있는 플러그인이 추가됐고 output.libraryExport를 지원합니다. 또, node: false로 node 관련 사항은 모두 무효화할 수 있도록 변경 됐습니다.
Safari 11.0
Safari 11.0 (Pre)이 릴리즈 됐습니다.
WebRTC, WebAssermbly, Media Capture API, WebCrypto API 알고리즘이 추가됐고 Resource timing API를 지원합니다.
CSS 관련해서는 Variable fonts, CSS stroke를 지원합니다.
또, 홈 스크린 앱에서 WebKit의 기능을 지원하며 사용자를 추적할 용도의 Cookie를 삭제 및 격리하는 등 다양한 변경 사항이 있습니다.
Release 1.4.0: TypeScript and CSS support · prettier/prettier
github.com/prettier/prettier/releases/tag/1.4.0
prettier 1.4.0이 릴리즈됐습니다.
TypeScript(.ts와 .tsx), CSS, Less, SCSS를 지원합니다.
에디터 용 API로써 cursorOffset 옵션이 추가됐고 포멧팅 관련 사항이 조금 수정됐습니다.
Release Release v1.0.0 · yahoo/pure
github.com/yahoo/pure/releases/tag/v1.0.0
PureCSS 1.0.0이 릴리즈됐습니다.
호환성을 보장할 수 있게 돼 1.0.0으로 버전을 올리기만 한 릴리즈입니다.
Microsoft Edge build 16215 changelog - Microsoft Edge Development
developer.microsoft.com/en-us/microsoft-edge/platform/changelog/desktop/16215/
Windows 10 build 16215 / MSEdge가 릴리즈됐습니다.
Shared Memory, Passive Event, object-fit, position: sticky, object-position 등을 지원합니다.
V8 JavaScript Engine: V8 Release 6.0
v8project.blogspot.com/2017/06/v8-release-60.html
V8 6.0이 일리즈됐습니다.
SharedArrayBuffer, Object rest/spread properties을 지원하고 성능이 개선됐습니다.
ESLint v4.0.0 released - ESLint - Pluggable JavaScript linter
eslint.org/blog/2017/06/eslint-v4.0.0-released
ESLint 4.0.0이 릴리즈됐습니다.
eslint:recommended가 변경됐고 설정 파일(.eslintrc)이 보다 엄밀하게 검사되도록 강화됐으며 indent 규칙이 더 엄격하게 동작하도록 변경됐습니다. 또, 다양한 규칙 관련 API가 변경됐습니다.
Safari Technology Preview 32, with WebRTC, is Now Available | WebKit
webkit.org/blog/7627/safari-technology-preview-32/
Safari Technology Preview Release 32이 릴리즈됐습니다.
Safari 11에서 제공 될 WebRTC, WebAssembly 등을 지원합니다.
esprima/ChangeLog at 4.0.0 · jquery/esprima
github.com/jquery/esprima/blob/4.0.0/ChangeLog
Esprima 4.0.0이 릴리즈됐습니다.
ES2017 async/await, 매개 변수 끝 콤마(trailing commas)를 지원하고 사양에 맞춰 동작하도록 몇가지 관련 사항이 변경됐습니다.
아티클
Node.js 8: `util.promisify()`
2ality.com/2017/05/util-promisify.html
Node.js 8.0.0에 추가된 util.promisify에 대해 소개돼 있습니다.
Promise로 변환하는 기본적인 방법과 symbol util.promisify의 symbol을 사용해 util.promisify를 대응하는 함수를 정의하는 방법에 대해 이야기합니다.
WebAssembly 101: a developer's first steps
blog.openbloc.fr/webassembly-first-steps/
WebAssembly 입문 글입니다.
JavaScript와 연계하는 방법이나 벤치마크에 관련한 내용이 간결하게 소개돼 있습니다.
React/Redux/Node.js의 SSR/SPA를 빠르게 하는 6 가지의 튜닝 포인트(1/3) - ＠IT(일본어)
www.atmarkit.co.jp/ait/articles/1706/08/news011.html
React의 서버사이드 렌더링 성능을 개선할 수 있는 튜닝 포인트에 관해 작성돼 있습니다.
Deprecations and Removals in Chrome 60 | Web | Google Developers
developers.google.com/web/updates/2017/06/chrome-60-deprecations
Chrome 60에서 비권장, 삭제되는 API가 소개돼 있습니다.
piotrwitek/react-redux-typescript-guide: A comprehensive guide to static typing "React & Redux" apps using TypeScript
github.com/piotrwitek/react-redux-typescript-guide
React, Redux를 TypeScript로 작성할 때 참고할 만한 가이드가 소개돼 있습니다.
Javascript unit testing tools
mo.github.io/2017/06/05/javascript-unit-testing.html
JavaScript의 테스트 도구가 비교 / 소개돼 있습니다.
각각 도구를 간단히 비교하고 관련한 액티비티에 대해 작성돼 있으며 이용자는 Mocha > Karma > Jasmine 순으로 많지만 개발은 Jest가 적극적으로 진행되고 있다고 합니다.
Introduction to Storybook – Chroma
blog.hichroma.com/introduction-to-storybook-5aca8cc643f7
React 컴포넌트 개발 환경인 Storybook에 대한 입문 글입니다.
Auto-Play Policy Changes for macOS | WebKit
webkit.org/blog/7734/auto-play-policy-changes-for-macos/
Mac Safari도 mobile safari 등과 동일하게 MediaElement의 자동 재생이 유저가 허용하지 않는 이상 동작하지 않도록 변경됐습니다. play()가 Promise를 반환하고 실패했을 경우 reject 됩니다. Video/Audio/사이트 마다 허가 여부가 결정되므로 복수의 요소를 만드는게 아니라 하나의 요소에 src를 변경할 것을 권장하고 있습니다.
사이트, 서비스, 문서
Upgrading from Node 6 to Node 8: a real-world performance comparison
hackernoon.com/upgrading-from-node-6-to-node-8-a-real-world-performance-comparison-3dfe1fbc92a3
Node.js v6와 v8의 성능을 비교한 글입니다.
React의 renderToString, Jest의 실행 시간, webpack의 빌드 시간, npm의 설치 시간 등으로 성능이 비교돼 있습니다.
소프트웨어, 도구, 라이브러리
kt3k/kocha: Modern, simpler Mocha clone, no globals, lint friendly
Mocha와 호환되는 API를 갖는 테스트 프레임워크 입니다.
Mocha에서는 글로벌에 정의돼 있는 describe등이 모듈로써 require하여 사용할 수 있습니다.
florinn/typemoq: A simple mocking library for TypeScript
C# moq의 TypeScript/JavaScript 버전인 목킹(Mocking) 라이브러리입니다.
