TOAST UI

super 키워드는 부모 객체의 함수나 속성에 접근하는 데 사용된다. 이전에는, 상위 속성으로 접근하는 것(super.x와 같은)은 런타임 실행으로 구현되어있었다. V8 v9.0부터는 최적화되지 않은 코드에 인라인 캐시(IC) 시스템을 재사용하여, 상위 속성에 접근하는 코드를 적절히 최적화된 코드를 생성한다. 이제 런타임 실행을 하지 않는다.

최신 자바스크립트로 작성된 의존성 모듈과 결과물 중심으로 성능을 개선한다.

브라우저 이전/다음 페이지 버튼으로 이동할 때 페이지가 순간적으로 로드되게 최적화 해보자.

픽셀은 웹에서 의외로 복잡한 주제이다. 이제 ResizeObserverEntry에 있는 새로운 devicePixelContentBox 속성을 통해 그 정보를 알 수 있으며, <canvas>를 사용하여 픽셀 단위까지 완벽한 렌더링을 할 수 있게 되었다.

프라미스로 애니메이션을 조작할 수있고, 교체가능한 애니메이션으로 성능이 개선되었으며, 합성 모드를 사용하여 부드러운 애니메이션을 제공한다.

브라우저는 웹 페이지의 메모리를 자동으로 관리한다. 웹 페이지가 객체(object)를 만들 때마다, 브라우저는 객체를 저장하기 위해 "내부적으로" 메모리 청크(chunk)를 할당한다. 메모리는 한정된 자원이기 때문에, 브라우저는 가비지 컬랙션으로 더는 객체가 필요하지 않은 시점을 감지하고 메모리 청크를 해제한다.

이번 장에서는 NodeJS, Deno와 Electron과 같은 런타임 및 Chrome, Chromium, Brave, Opera, Microsoft Edge와 같은 웹 브라우저에서 사용되는 ECMAScript와 WebAssembly를 위한 V8 엔진의 메모리 관리 방법에 대해 살펴볼 것이다.

간단한 공유 버튼 예제로 Web Share API의 사용법과 네이티브 공유 기능의 장점을 설명한다. API를 지원하지 않는 브라우저에서는 폴백 매커니즘으로 컨텐츠 공유를 지원하는 방법도 소개한다.

좋은 기회로 2019년 구글I/O에 참석했다. 웹 기술 세션 중에는 크게 눈에 띄는 세션은 없었지만, 일부 세션에서 소개된 웹과 관련 기술 몇 가지는 흥미로웠다. Native Lazy Loading, Portals, Duplex, Rich Results 정도가 나의 관심을 끌었다. 그중 키노트에서 시작해 몇 개의 세션에서 두루두루 언급한 네이티브 레이지 로딩이 제일 기대됐다.

필자는 풀타임 개발자의 업무를 작은 회사에서 처음 맡았다. 우리는 BrowserStack을 가지고 있지 않았기 때문에 임시 변통 장치 실험실을 함께 만들었다. 부서진 1세대 iPad와 오래된 버전의 Safari로 그 웹사이트를 봤을때, 필자는 왜곡과 부서진 잔해들이 보였다. 필자는 한때 웹을 "상상할 수있는 가장 적대적인 소프트웨어 엔지니어링 환경"이라고 생각했던 Douglas Crockford의 말을 떠올렸다. 올해 초 Verge 의 광범위하게 공유 된 기사는 웹에서 볼 수있는 "Chrome에서 가장 잘 작동합니다."메시지에 대해 경고했다. 이 문제의 예가 더 있다. 널리 사용되는 메시징 앱 슬랙(Slack)은 Chrome에서만 음성 통화가 작동한다. 도움 요청에 대한 응답으로 Slack은 다음과 같이 설명했다.