Fork me on GitHub

2019-07-16: Firefox 68.0, Hermes(JS Engine for React Native), PageSpeed Insights 5

Translator: U-Yeong Ju Edit on GitHub See Revisions

JSer.info #444 - Firefox 68.0이 릴리스 됐습니다.

Firefox 68에서 법인을 위한 기업용 Firefox Extended Support Release(ESR)도 함께 갱신됐습니다.

Firefox 68의 개발자 도구에 Accessibility Checks 기능이 추가됐고 ECMAScript 2020에 도입될 예정인 Bigints를 지원합니다.
웹 호환성을 위해 IE의 CSS#addRule()CSS#removeRule(), Safari의 -webkit-line-clamp CSS 프로퍼티를 구현했습니다.
또, CSS Scroll Snapping 사양에 맞춰 기능을 변경했습니다.


React Navtive의 Android 용 JavaScript 엔진인 Hermes가 공개됐습니다.

React Native에 최적화 된 자바스크립트 엔진으로 React Native 0.60.2부터 동의(Opt-in) 하에 이용할 수 있습니다.

Hermes는 TTI(Time To Interact), APK 파일 크기, 메모리 소비의 개선에 목적을 두고 개발됐습니다.
자바스크립트의 코드를 AOT(ahead-of-time)에서 바이트코드로 컴파일하고 실행 시에는 바이트코드를 이용해 실행하여 TTI(애플리케이션을 이용할 수 있는 상태까지의 시간) 을 개선합니다.

또, 현시점에서 Hermes는 JIT(Just-in-time)을 의도적으로 구현하지 않아 처리 속도는 기존 형식과 조금 다를 수 있습니다.
V8도 JIT-less 모드를 가지고 있지만 조금 문맥이 다르기 때문에 굳이 TTI와 메모리 소비를 줄이기 위해서 사용하지 않은 것 같습니다.

Hermes는 디버그 빌드 시엔 AOT 컴파일 하지 않기 때문에 성능을 비교할 때 주의할 필요가 있습니다.


How Google Pagespeed works: Improve Your Score and Search Engine Ranking에서는 5월에 업데이트 된 PageSpeed Insights를 소개합니다.

PageSpeed Insights의 점수는 Lighthouse의 "Performance" 점수를 그대로 이어받는다는 사실과 그 스코어가 어떻게 계산되는지 소개합니다.


헤드라인


Firefox 68.0, See All New Features, Updates and Fixes

www.mozilla.org/en-US/firefox/68.0/releasenotes/

Firefox ReleaseNote

Firefox 68.0이 릴리스됐습니다. 이는 Firefox ESR이 되는 버전입니다.
개발자 도구의 네트워크 패널에서 특정 URL을 거부할 수 있으며 Android 버전에서 Visual Viewport API를 활성화했습니다. 또, CSS Scroll Snap을 사양에 맞춰 수정했습니다.


Release Notes for Safari Technology Preview 87 | WebKit

webkit.org/blog/9414/release-notes-for-safari-technology-preview-87/

safari ReleaseNote

Safari Technology Preview 87이 릴리스됐습니다.
console.countReset, console.timeLog가 구현됐습니다.


Release v1.0.0 · quasarframework/quasar

github.com/quasarframework/quasar/releases/tag/v1.0.0

Vue UI library

Vue 기반의 UI 프레임워크 Quasar 1.0.0이 릴리스됐습니다.


아티클


WebDriver is Coming to Safari in iOS 13 | WebKit

webkit.org/blog/9395/webdriver-is-coming-to-safari-in-ios-13/

safari webdriver article

iOS 13의 Safari에서 WebDriver를 지원합니다. 이에 대한 내용이 상세히 작성돼 있습니다.


Snyk research team discovers severe prototype pollution security vulnerabilities affecting all versions of lodash | Snyk

snyk.io/blog/snyk-research-team-discovers-severe-prototype-pollution-security-vulnerabilities-affecting-all-versions-of-lodash/

JavaScript library security article

lodash 4.17.12에서 수정된 Prototype Pollution 취약성에 대해 이야기합니다.


Web Components update: more time to upgrade to v1 APIs | Web | Google Developers

developers.google.com/web/updates/2019/07/web-components-time-to-upgrade

WebComponents article

Chrome의 Web Components v0 API 폐지 절차에 대해 작성돼 있습니다.
Chrome 80에서 삭제할 예정이며 명령 줄 플래그로 테스트하는 방법과 Polyfill 등도 소개합니다.


Yomguithereal's Shenanigans - Implementing an efficient LRU cache in JavaScript

yomguithereal.github.io/posts/lru-cache

JavaScript article algorithm

JavaScript에서의 LRU 구현에 관해 소개합니다.
Double Linked List 구조와 Map을 사용한 구현 방법을 소개하며 LRU의 갱신 비용 대부분은 삭제 시 발생한다는 점 등을 이야기합니다.


Normalize CSS or CSS Reset?! - Elad Shechter - Medium

medium.com/@elad/normalize-css-or-css-reset-9d75175c5d1e

CSS article

CSS 아키텍처를 주제로 한 글입니다.
CSS Reset과 Normalize의 접근법 비교, 파일 구성, 여러개의 사이트를 위한 레이어 구성 등을 이야기합니다.


lesnitsky/webgl-month: 🎓 Daily WebGL tutorials

github.com/lesnitsky/webgl-month

WebGL tutorial article

WebGL 튜토리얼 입니다.


How Google Pagespeed works: Improve Your Score and Search Engine Ranking

calibreapp.com/blog/how-pagespeed-works/

google performance browser article

Google의 PageSpeed Insights(PSI) 5.0에 대한 글입니다.
PSI 5.0의 점수는 Lighthouse와 동일한 점과 Lighthouse의 점수 측정 방식, TTI 영향 등에 대해 작성돼 있습니다.


사이트, 서비스, 문서


EasyGraphQL

easygraphql.com/

GraphQL library

GraphQL 툴킷입니다.
GraphQL의 서버, 목, 테스트 도구, 트레이싱 라이브러리 등이 정리돼 있습니다.
또, 파이어폭스나 now에서 GraphQL를 구동시키는 도구도 공개하고 있습니다.


QuickJS Javascript Engine

bellard.org/quickjs/

JavaScript software C언어

ES2019 사양을 구현한 자바스크립트 엔진입니다.
C로 구현돼 있고 외부의 어떤 자원을 의존하지 않습니다.


소프트웨어, 도구, 라이브러리


paulrosen/abcjs: javascript for rendering abc music notation

github.com/paulrosen/abcjs

JavaScript library

SVG를 기반으로 악보를 그려주는 라이브러리입니다.


facebook/hermes: Hermes is a small and lightweight JavaScript engine optimized for running React Native on Android.

github.com/facebook/hermes

JavaScript Android React

React Native의 Android 용 자바스크립트 엔진입니다.
자바스크립트를 레지스터 기반의 바이트코드로 컴파일하여 모바일에서 빠르게 구동시키는 것에 목적을 두고 있습니다.


Pull Request to this article
JSer.info Slackに参加する