[JSer.info#번역] 2014-07-22 자바스크립트 주요 소식

Chrome 36 & Chromium 36 기반 Opera23 릴리즈

Chrome 36과 Chromium 36 기반 Opera 23이 릴리즈 됐습니다. Chrome 36에는 Object.observe()와 element.animate() 그리고 HTML Imports가 구현됐으며 Opera 23도  Object.observe(), HTML Imports가 구현됐지만 WebAnimations는 일부만 구현됐습니다. Opera에 대한 자세한 설명은 릴리즈 노트를 참고하세요.

• Chromium Blog: Chrome 36 Beta: element.animate(), HTML Imports, and Object.observe()
• Chrome 36 Launches with New Incognito Design
• Dev.Opera — Opera 23 released

WebComponents 주요 기사 정리

최근들어 WebComponents(주로 Polymer에 대한)에 관한 아티클이 많이 공개되고 있습니다. 따라서 몇 가지를 정리하여 소개합니다.

• Tender Surrender : 왜 WebComponents는 웹 개발에 혁명을 일으키는가(일본어[구글번역]) : WebComponents의 개요가 잘 설명되어 있습니다.
• The roles of AngularJS and Polymer : AngularJS 와 Polymer의 역할에 대한 차이점이 정리되어 있습니다.
• Here’s the difference between Polymer and Angular – Binpress : 이 아티클에서 AngularJS는 DI 및 라우팅 등 웹 애플리케이션 개발에, Polymer는 Custom Element 개발에 최적화 되어 있다고 이야기합니다. 이 두 가지 관점에 관심이 있다면 도움이 될 것 같습니다.
• Polymer vs. X-Tag – Here’s the difference · Pascal Precht : Polymer와 X-Tag의 차이점이 정리되어 있습니다.
• WebReflection/document-register-element : document-register-element라고 하는 또 다른 CustomElement Polyfill 입니다. 참고하면 도움이 될 것 같습니다.

아래 문서는 Polymer(platform.js)가 어느 수준까지 polyfill 해주는지 대한 내용이 정리되어 있습니다.

• Why Web Components Aren’t Ready for Production… Yet -Telerik Developer Network
• 웹 브라우저 별로 WebComponents의 동작을 살펴봤다(일본어[구글번역])

공지사항

JSer.info 웹 사이트에서 이곳을 소개해줬습니다.(짝짝짝)

 

주요 기사

• node-webkit v0.10.0 released – 구글 그룹스 :  node-webkit v0.10.0이 릴리즈됐습니다. Chromium 35, Node.js 0.11.13으로 업데이트 했으며 네이티브 메뉴, 글로벌 단축키 등이 개선됐습니다.
• New Compiler and Moving to GitHub – TypeScript – Site Home – MSDN Blogs : TypeScript가 프로젝트 저장소와 위키 문서를 깃헙(GitHub)으로 옮겼습니다. 또한 현재보다 5배 빠른 새로운 컴파일러를 개발하고 있다고 합니다.
• New design and site changes now on caniuse.com : CANIUSE의 새로운 디자인이 공개됐습니다. 국가별 및 버전별 브라우저 점유율을 보기 쉽게 디자인됐습니다.
• New: Rev26 ES6 draft now available : ES6 draft Rev 26이 릴리즈 됐습니다.

아티클

•  18 Surprises From Reading jQuery’s Source Code – Quick Left Boulder Colorado : jQuery의 소스 코드를 읽고 알게된 것들을 정리하고 있습니다. 댓글에서도 이야기하듯이 문서화 되지 않은 API에 대한 내용이 많이 있습니다.
• 자바스크립트 프레임워크에서 데이터 바인딩을 구현하는 4 가지 방법(일본어[구글번역]) : MV* 프레임워크에서 볼 수 있는 데이터 바인딩을 구현하는 방법이 정리돼 있습니다.
• Improve Your Tests by Breaking the Rules : 자바스크립트에서 일반적으로 안좋게 여겨지는 패턴을 테스트에서 사용함으로써 개선할 수 있다고 합니다. 전역 변수, 동기적인 코드(sinon.js, generator), DRY 하지 않은 코드를 작성하면 얻을 수 있는 장점에 대해 이야기합니다.
• selector-replace()의 사용(일본어[구글번역]) : Sass 3.4.0의 seledctor-replace() 함수에 대해 이야기합니다.

읽을거리

• ECMAScript 6 // Speaker Deck : ES6의 주요 기능(Module Class, Iterator, Syntax 등)을 소개합니다. 또한 ES7과 ES8에 구현될 수도 있는 기능과 ECMAScript 내용은 어디를 참고하면 되는지도 설명하고 있습니다.
• WebRTC at SFHTML5 – YouTube : SFHTML5의 WebRTC 강의 동영상
• node streams : 랜덤한 단어가 흐르는 Stream를 만들고 transform stream에서 변환하여 WriteStream에 흐르게 하는 샘플을 통해 Node.js의 Stream에 대해 이야기합니다.

서비스

• Are We Componentized Yet? : 브라우저 별 WebComponents의 지원 현황과 사양에 대해 정리하고 있는 사이트입니다.

라이브러리

• ezequiel/cssprima : CSS 파서 라이브러리 입니다.
• azproduction/autopolyfiller : Autoprefixer의 자바스크립트 버전 라이브러리입니다. 해당하는 코드와 지원 브라우저를 지정하여 필요한 Polyfill 코드를 생성해줍니다.
• Ampersand.js : HumanJS의 저자가 개발한 자바스크립트 애플리케이션을 위한 프레임워크 입니다. Backbone.js를 사용한 경험을 바탕으로 기능을 세세하게 Node.js 모듈로 나누어 Browserify에서 컴파일 하여 사용할 수 있도록 디자인되어있습니다.
• Raynos/mercury : 모듈 지향 프레임워크입니다. input(Controller), State(Model), Render(View)로 구성되고 React와 같이 Virtual DOM을 가지며, 데이터 바인딩은 모델 클래스 방식으로 이루어집니다.
• Protractor – end to end testing for AngularJS : WebDriver를 사용한 AngularJS를 위한 E2E 테스트 프레인워크인 Protractor가 공개됐습니다. 테스트 코드는 기본적으로 jasmine을 사용하도록 되어있지만 Mocha와 Cucumber를 사용할 수도 있습니다.

도서

• Three.js Essentials : Three.js에 대한 도서입니다.

 
JSer.info를 번역하여 공유드리고 있습니다.
JSer.info는 JavaScript Weekly, Badass JavaScript, JsMag, A Minute With Brendan, The Changelog를 참고,  자바스크립트의 주요 소식을 공유하는 사이트입니다.
감사합니다.