원본 : Web Development Reading List #113
저자 : Anselm Hannemann
역자 : 조현석

지난 한 주 동안, 동적으로 스크립트를 삽입했을 때에 문서 내에서 스크립트의 로딩이 끝났는지를 어떻게 판단해야할 지에 대한 고민이 있었습니다. 금주 소개된 Steve Souders의 글이 같은 내용을 다루고 있습니다.

신기하게도 매주 WDRL을 통해서 지난 주에 고민했던 부분에 대한 해결책을 만나고 있습니다. 이런 일이 몇 번 생기니까 놀라움과 동시에 ‘지역을 떠나 같은 고민을 공유하는 것’으로부터 묘한 위안을 얻게 되기도 합니다.

hero image, Custom Metric API, SVG를 위한 접근성, native DOM method, box-decoration-break: clone;

오역 제보는 이메일과 댓글로 부탁드립니다.


번역문

안녕,

독일의 가을이 거의 끝나가고 겨울이 오고있어. 기상 예보에서는 우리 집 근처 Bavarian Alps에 첫눈이 내릴거라고 얘기해. Service Workers와, ‘Complex 알고리즘을 가르치기’, 그리고 ‘얼마나 더 객곽적일 수 있을까’와 같은 추상적인 주제들에 관해 읽어보자.

General

  • Paul Lewis의 “프레임워크의 비용“은 프레임워크를 사용할 때에 드는 비용과 이점을 분석하고, 개발자로서의 경험을 계산된 자료와 함께 공유한다. 그 부분이 종종 논외로 치부되곤 하는 관점을 환기시킨다.

Concepts & Design

Tools

  • Mapzen은 ‘Open source mapping lab’으로, 지도에 기반한 소프트웨어를 만들기 위한 훌륭한 옵션들을 제공한다. 예를 들어 클라이언트 측의 라우팅 서비스, 또는 실시간 3D 렌더링 엔진들이 있다.
  • Sara Soueidan은 SVG로 그래픽을 출력하고 구축하는 방법에 대한 훌륭한 예제를 공유했다. SVG를 더욱 깨끗하게, 혹은 더욱 잘 만들 수 있는 간단한 팁을 알려준다.

Privacy

  • TLS protocol은 TLS 1.3을 통해 대폭 향상되었다. Privacy를 강화하고, Handshakes의 개선을 통해 대기시간(latency)을 줄였다. 이를 통해 기본적으로 비밀보장을 지향하게 될 것이며, 나는 이 변화가 웹에 어서 빨리 적용되길 바란다.
  • 알고리즘을 우리 삶에 반영하는 일이 잦아지면서, 윤리의 문제를 제기할 필요성이 대두되고 있다. 인간의 뇌는 비이성적이고 감정적인 결정을 할 수 있다. 그리고 때때로 이는 필요하거나, 좋은 것일 수 있다. 그러나 알고리즘과 컴퓨터는 그럴 수 없다. 이는 인공지능의 가장 큰 과제이며, 페이스북 뉴스피드 콜렉션이나 채용 알고리즘같은 알고리즘이 이미 존재하는 현실을 직시할 필요가 있다. 알고리즘을 투명하게 공개하고, 사용자들이 해당 알고리즘을 향상시킬 수 있는 가능성을 제공함으로 알고리즘의 객관성을 획득하는 것이 좋을 해결책일 수 있다.

Web Performance

  • 우리 모두는 성능 문제를 알고 있지만 Steve Souders의 새로운 기사는 User Timing과 Custom Metrics API를 통한 실질적인 프론트-엔드 성능을 다루는 방법에 대한 실용적인 통찰을 공유한다. Stylesheet와 script, 글꼴, 그리고 Hero image의 로딩이 끝났을 때 블록화하는 방법을 배워보자.

HTML / SVG

  • Craig Hockenberry는 Safari9의 새로운 기능인 고정탭을 시험해보았다. Firefox와 Chrome 사용자에게는 새로운 것이 아니지만, Safari의 고정탭은 약간 다르다. 반면 기사는 전반적으로 고정탭에서 최상의 아이콘을 보여주는 방법을 다룬다. Safari의 좋은 기능 덕분에, SVG 파일을 참조해서 마스크를 만들어서 아이콘에 동적으로 스타일을 입힐 수 있다. 예를들어 사용자가 어떤 페이지에 있는지를 알려주거나, 동적인 변화를 알려주고 싶을 때에 손쉽게 사용할 수 있다. 확실히, 모든 브라우저에 이 기능이 추가되었으면 한다.

Accessibility

JavaScript

  • The AngularConnect 2015 행사가 이번 달에 진행되었고, 프레임워크에 대한 몇 가지 주목할 만한 발표가 있었다: ngUpgrade로 Angular 1에서 2로 원활하게 업그레이드가 가능하며, Angular 2는 시동 시간의 개선으로 훨씬 더 빨라졌으며, Server 측 사전 렌더링과 다른 멋진 기능들이 추가되었다.
  • Native DOM으로 작업하는 것은 여전히 많은 사람들에겐 고통과 같다. 하지만 요즘엔, DOM을 위한 native JavaScript API들이 작은 요소들을 선택하기 위한 많은 작은 함수들을 제공하고 있다. Louis Lazaris는 native DOM method를 통해 자식과 형제 노드를 선택하는 실용적인 팁들을 공유한다.
  • Keycode.info는 누른 키의 JavaScript 키코드를 반환해주는 작고 손쉬운 도구이다.
  • Ian Feather는 오늘 날 Vanilla JS가 의미하는 바에 대해 “vanilla todoMVC 이행”같은 여전히 작은 라이브러리들과 DOM handler를 위한 추상화를 사용하는 예제들을 빌어 설명한다.
  • David Walsh는 Mozilla의 새로운 “Service Worker Cookbook“을 소개한다. 책에는 훌륭한 리소스와 유용한 Service Worker 예제들이 포함되어 있다. 그의 블로그 포스트에서 그는 당신의 시작을 도울 가장 보편적인 코드 예제들 또한 공유한다.

CSS / Sass

Go beyond…

  • 오늘날 우리는 GPS 장비들의 보급과 스마트폰, Geo 추적장치, 관계형 지도와 가이드 덕에 더 이상 길을 잃어버릴 수가 없다. 이것이 많은 사람들에게 큰 즐거움이었지만, Stephan Smith는 만약에 우리가 실종된다면 어떻게 될지를 궁금해 한다. 이 글을 읽었을 때, 나는 즉시 며칠 전에 Vitaly Firedman이 공유한 비슷한 경험이 기억났다. 지능적인 기술 덕에 예측가능해져버린 요즈음의 삶으로부터 삶의 불확실성을 다시 얻으려고 하는 인류의 노력이 흥미롭다.
  • 때때로 나는 돈에 관하여 항상 생각하지는 말아야겠다고 되새긴다. 세상에서 가장 행복한 사람들은 쇼핑중독과 불필요한 소비로부터 거리를 유지하는 방법을 찾았던 것 같다. 삶은 다이아몬드가 아니라 추억으로 이루어져있기 때문이다.
  • Mike Ellis가 Waterstone’s Online을 그만두었을 때, 그의 상사는 그에게 괜찮다고, “이직은 상직적으로 업무를 정리하는 것이고, 너의 직장생활을 통틀어 가장 중요한 부분이다.”라고 얘기했다. 여전히 오늘날, 이 문장은 Mike의 마음 속에 남아있고, 그는 정기적으로 이 말을 되새긴다. 무자비하게, 자책감 없이, 뒤돌아 보지 않고, ‘어쩌면’같은 생각 없이 그냥 물건을 버리는 것은 때때로 누군가의 마음과 인생을 정리하는 최고의 방법이 되기도 한다.
  • 더 욕망하고, 더 사고, 충동적으로 행동하며, 비축하고, 문제를 해결하기 위해 소비하고, 쇼핑을 통해 안정감을 찾고, 여행을 통해 스릴을 찾고, 무언가를 더하고, 더욱 더 무언가가 되기를 부추기는 것은 오늘날 소비주의 세계의 한 모습이었다. 만약 우리가 우리의 쇼핑 중독과 과다한 욕망을 부숴버린다면 어떻게 될까? 나는 지금 우리가 스스로 모든 욕구로부터 해방될 수 있다고 말하는 것은 아니다. 그러나 우리는 조금이라도 더 노력해야만 한다.

여기까지가 이번 주의 내용이다. 이 글이 마음에 든다면, 후원과 공유를 부탁한다. 이 프로젝트에 드는 비용을 확인할 수도 있다. 이메일과 RSS, online으로 제공된다.

감사합니다.
Anselm.