JSer.info #325 - Safari 10.1이 정식 릴리즈됐습니다.
Fetch API, CSS Grid, ES2016+, IndexedDB 2.0, Custom Elements, Gamepad, Pointer Lock, Input Events, download 속성, HTML Media Capture 등 상당히 여러가지 기능이 구현됐습니다.
예전에 공개한 CSS Grid Layout과 Custom Elements를 소개하는 글을 함께 살펴보면 좋을 것 같습니다.
ES2017 was officially approved by the committee to be sent to the ECMA General Assembly for approval.
-- March 2017 meeting notes by leobalter · Pull Request #64 · rwaldron/tc39-notes
ECMAScript 2017의 사양이 확정됐으며 TC39(ECMAScript 사양을 책정하는 기술위원회)에서 최종 승인되어 ECMA General Assembly에 제출됐습니다.
이제 2017년 6월 27일에 열리는 GA 113th meeting에서 최종 승인되면 정식으로 ECMAScript2017이 릴리즈됩니다.
ES2017에 들어갈 사양은 아래 문서에 정리돼 있습니다.
이로써 ES2017 사양은 고정(freeze)됐으며 tc39/ecma262의 master 브랜치는 ES2018 draft로 관련 내용이 변경 됐습니다.
NOTE:
ECMAScript의 ISO 표준 버전인 ISO/IEC 16262는 ECMA-414 ECMAScript Specification Suite라는 사양으로 대신 제안됩니다.
ES2018 이후에 들어갈 수도 있는 제안은 스테이터스와 함께 아래 문서에 정리돼 있으니 참고하시길 바랍니다.
- ECMAScript proposal updates @ 2017-03 | ECMAScript Daily
- 지난달 시점의 스테이터스 변경 정리
- tc39/proposals: Tracking ECMAScript Proposals
지난달 미팅에서 정규표현 개선과 관련된 제안(Proposal) 4개가 Stage 3로 변경 됐습니다.
정규표현과 관련된 제안에 흥미가 있는 사람은 아래 문서를 보시면 좋을 것 같습니다.
React is Slow, React is Fast: Optimizing React Apps in Practice에는 React 애플리케이션의 성능을 측정하는 방법과 개선을 위한 접근법이 소개돼 있습니다.
?react_perf를 사용해 컴포넌트 프로파일을 얻는 방법과 분석하는 방법 그리고 개선법 등에 관해 작성돼 있습니다.
헤드라인
normalize.css/CHANGELOG.md at master · necolas/normalize.css
github.com/necolas/normalize.css/blob/master/CHANGELOG.md
normalize.css 6.0.0이 릴리즈됐습니다.
HTML 요소나 form 요소의 font-family, line-height 등 opinionated rules를 삭제했습니다.
TC39: Ecma-402 updates | Rafael Xavier
rafael.xavier.blog.br/2017/03/23/tc39-ecma-402-updates/
Ecma-402(ECMAScript i18n API)의 Proposal이나 스테이터스에 관해 정리돼 있습니다.
Release 2.3.0 · qunitjs/qunit
github.com/qunitjs/qunit/releases/tag/2.3.0
QUnit 2.3.0이 릴리즈됐습니다.
QUnit CLI가 추가됐습니다. CLI에서 QUnit을 실행할 수 있고 reporter 등을 지정할 수 있습니다.
- CLI: Introduce QUnit CLI by trentmwillis · Pull Request #1115 · qunitjs/qunit
- Introduce CLI tool · Issue #1024 · qunitjs/qunit
New Web Features in Safari 10.1 | WebKit
webkit.org/blog/7477/new-web-features-in-safari-10-1/
Safari 10.0이 릴리즈됐습니다.
Fetch API, CSS Grid, ES2016+, IndexedDB 2.0, Custom Elements, Gamepad, Pointer Lock, Input Events, download 속성, HTML Media Capture 등을 지원합니다.
Node v7.8.0 (Current) | Node.js
nodejs.org/en/blog/release/v7.8.0/
Node.js 7.8.0이 릴리즈됐습니다.
npm 4.2.0으로 업데이트됐고, async function을 수정(desugaring)/백포트 하는 등 다양한 변경 사항이 있습니다.
TestCafe v0.14.0 Released | TestCafe
devexpress.github.io/testcafe/blog/testcafe-v0-14-0-released.html
TestCafe v0.14.0이 릴리즈됐습니다.
Role에서 로그인 정보를 입력할 수 있도록 변경됐고 BrowserStack을 지원합니다. t.debug()로 debugger;와 비슷하게 디버깅할 수 있으며 file://에 대응해서도 테스트할 수 있고 Selector에 커스텀 메서드를 정의할 수 있게 변경됐습니다.
Flow: A Static Type Checker for JavaScript
Flow 정식 사이트가 리뉴얼 됐습니다.
Release Almin.js 0.11 · almin/almin
github.com/almin/almin/releases/tag/0.11.0
Almin 0.11이 릴리즈 됐습니다.
Functional UseCase를 지원하고 API 문서가 갱신됐습니다. 또, React를 바인딩 할 수 있는 컨테이너 패키지가 추가됐습니다.
Announcing free Microsoft Edge testing in partnership with BrowserStack - Microsoft Edge Dev BlogMicrosoft Edge Dev Blog
blogs.windows.com/msedgedev/2017/03/30/free-edge-testing-browserstack/
BrowserStack에서 테스트 목적으로 MSEdge를 무료로 이용 가능합니다.
아티클
ZEIT – Next.js 2.0
React를 사용한 프레임워크인 Next.js 2.0이 릴리즈됐습니다.
동적 라우팅을 지원하며 next/css를 비권장하는 대신 styled-jsx를 도입했습니다. 또, <Link>의 prefetch를 지원하며 babel을 설정할 수 있게 변경 됐습니다. 그리고 여러가지 샘플 예제가 추가됐습니다.
- zeit/styled-jsx: Full CSS support for JSX without compromises
- Migrating from next css · zeit/next.js Wiki
V8 JavaScript Engine: Help us test the future of V8!
v8project.blogspot.com/2017/02/help-us-test-future-of-v8.html
V8의 새로운 컴파일 파이프라인인 Ignition iterpreter와 Tuborfan compiler를 활성화 하는 방법에 관해 작성돼 있습니다.
또, 버그가 발견 됐을 때 리포트할 수 있는 방법도 소개돼 있습니다.
Writing Better JavaScript with Flow — SitePoint
www.sitepoint.com/writing-better-javascript-with-flow/
Flow의 기본적인 사용방법에 관해 소개하는 글입니다.
타입을 선언하는 방법, 라이브러리의 타입 선언(Library Definitions), 타입 어노테이션을 제거(Stripping)하는 방법 등이 작성돼 있습니다.
React is Slow, React is Fast: Optimizing React Apps in Practice
marmelab.com/blog/2017/02/06/react-is-slow-react-is-fast.html
React의 성능 측정 및 개선 방법에 관해 소개하는 글입니다.
?react_perf를 사용한 컴포넌트 프로파일링, why-did-you-update으로 컴포넌트 갱신 시간 측정, shouldComponentUpdate로 불필요한 갱신이 발생하지 않도록 개선, Resompose나 Reselect, React/JSX의 사용한 개선 등 다양한 성능 개선 방법에 관해 작성돼 있습니다.
Svelte 훑어보니 꽤 대단하다 - Qiita(일본어)
qiita.com/jgs/items/2d985894ea07f48b74fb
HTML/CSS/JS를 한 파일에 셋으로 작성한 컴포넌트를 순수 JavaScript + 작은 규모의 런타임 코드로 변환하는 UI 프레임워크인 Svelte에 관해 소개하는 글입니다.
Regular Expressions in a post-ES6 world
ponyfoo.com/articles/regular-expressions-post-es6
ES2015 이후, 정규표현에 추가된 사양과 Proposal이 소개돼 있습니다.
Vue.js Tutorial: A Prerendered, SEO-Friendly Example [Live Demo] - Snipcart
snipcart.com/blog/vuejs-tutorial-seo-example
Vue.js 튜토리얼 글입니다. PrerenderSpaPlugin를 사용하여 정적인 HTML을 만드는 방법까지 소개돼 있습니다.
ECMAScript proposal updates @ 2017-03 | ECMAScript Daily
ecmascript-daily.github.io/ecmascript/2017/04/04/ecmascript-proposals-status
ECMAScript Proposal 최신 변경 사항이 정리돼 있습니다.
정규표현 관련 Proposal이 Stage 3으로 변경됐습니다.
슬라이드, 영상
그대는 yarn.lock을 커밋하고 있는가?(일본어)
www.slideshare.net/teppeis/do-you-commit-yarnlock
라이브러리에서 yarn.lock을 커밋하는 것으로 devDeps가 고정됨으로써 얻을 수 있는 장점을 소개하는 슬라이드입니다.
devDeps 쪽은 Breaking Change가 발생하기 쉬우므로 yarn.lock을 이용해 고정하는 편이 좋다고 이야기 합니다.
소프트웨어, 도구, 라이브러리
sdgluck/mewt: Immutability in under one kilobyte
Proxy를 사용해 구현한 심플한 Immutable 래퍼 라이브러리입니다.
도서
시작하며 | Reset CSS 프렌즈
유저 에이전트를 근거해 CSS의 특징적 부분을 덮어쓰는 Reset CSS나 normalize.css 등이 어떤 스타일을 할당하고 있는지 자세히 소개하는 전자 서적입니다.
