Outsider's Dev Story

Stay Hungry. Stay Foolish. Don't Be Satisfied.
RetroTech 팟캐스트 44BITS 팟캐스트

기술 뉴스 #191 : 22-02-01

웹개발 관련

  • Remix vs Next.js : Remix 쪽에서 쓴 글로 Next.js에서 만든 커머스 예제 페이지를 Remix로 포팅한 버전과 Remix에 맞게 완전히 재작성한 버전을 성능 비교를 하면서 Next.js와 어떤 차이점이 있는지를 설명하는 글이다. 아래의 특징별로 왜 빠르고 어떤 특징이 있는지 보여주고 있다. Remix에서 쓴 글이지만 자세한 구조를 설명해서 자세히 보면 Next.js와 Remix의 특징을 이해할 수 있다.(영어)

    • Remix가 정적 콘텐츠 서빙에서 Next.js보다 빠르다.
    • Remix가 동적 콘텐츠 서빙에서 Next.js보다 빠르다.
    • Remix는 느린 네트워크에서도 빠른 사용자 경험을 제공한다.
    • Remix는 자동으로 오류, 중단, 레이스 컨디션을 다루고 Next.js는 그렇지 않다.
    • Next.js는 동적 콘텐츠 서빙에서 클라이언트 자바스크립트를 권장하지만, Remix는 그렇지 않다.
    • Next.js는 데이터 조작에 클라이언트 자바스크립트를 권장하지만, Remix는 그렇지 않다.
    • Next.js는 데이터에 따라 선형적으로 빌드 시간이 증가하지만, Remix의 빌드 타임은 거의 즉각적이고 데이터에 디커플링 되어 있다.
    • Next.js는 애플리케이션 아키텍처를 변경하도록 강제하고 데이터가 커질 때 성능을 희생하게 한다.
    • Remix의 추상화가 더 좋은 애플리케이션 코드를 유도한다고 생각한다.
  • CSS 역사로 알아보는 CSS가 어려워진 이유 : CSS를 이해하기 위해 CSS가 발전해 온 역사를 정리한 글이다. 크게는 문서를 위한 스타일로 만들어진 CSS가 애플리케이션에서는 어울리지 않는 부분이 생기면서 여기에 맞춰진 새로운 스펙이 나왔지만, 기존 개념이나 방법과 충돌하기도 하고 달라지기도 했기 때문에 CSS의 역사를 통해서 어떻게 발전해 왔는지를 정리한 글이다. CSS가 만들어진 90년대부터 현재 최신 트랜드까지 깔끔하게 잘 정리되어 있고 관련 링크도 정리해 주어서 더 관심 있다면 자세히 보면서 흐름을 이해할 수 있다.(한국어)
  • monorepo.tools : 모노레포의 개념을 정리한 사이트이다. 모노레포는 단순히 여러 프로젝트를 한 저장소에 넣어놓은 것이 아니고 오히려 모로리식과는 반대되는 개념이다. 보통은 팀이나 용도별로 저장소를 나눈 폴리레포를 많이 쓰는데 폴리레포는 코드 공유가 어렵고 중복 코드가 발생하고 여러 저장소에 걸친 변경사항을 적용하기도 어렵고 도구를 일관화되기 어려운 문제가 있다. 대신 모노레포는 쉽게 새 프로젝트를 시작할 수 있고 프로젝트에 걸쳐서 커밋할 수 있고 버전도 통일시킬 수 있다. 이런 모노레포를 위해 도구가 지원하는 도구는 아래와 같은데 기능별로 Bazel, Lage, Lerna, Nx, Rush Turborepo가 어떻게 지원하는지 정리해 두었다.(영어)

    • 로컬 계산 캐싱
    • 분산 계산 캐싱
    • 투명한 원격 실행
    • 워크스페이스 분석
    • 코드 쉐어링
    • 코드 제너레이션
    • 로컬 태스크 오케스트레이션
    • 분산 태스크 실행
    • 영향받는 프로젝트/패키지 탐지
    • 의존성 그래프 시각화
    • 일관된 도구
    • 프로젝트 제약사항과 가시성
  • Time to say goodbye to Webpack? : 제목은 자극적이지만 그냥 번들러 Vite를 소개하는 글이다.(vit라고 있다고 한다) Vite는 로컬 개발에서는 최신 브라우저를 쓸꺼라고 가정하고 외부 의존성은 잘 변경되지 않으니 esbuild로 미리 번들링하고 소스 코드는 브라우저의 네이티브 ESM을 이용해서 요청할 때마다 변환해서 제공하는 구조라서 번들링을 다 하고 개발 서버를 실행하는 webpack에 비해서 로컬 개발 서버를 빠르게 실행할 수 있다. 핫 모듈 교체(HMR)에도 네이티브 ESM을 사용해서 빠르게 변경사항을 적용할 수 있다.(영어)

그 밖의 개발 관련

  • Roblox Return to Service 10/28-10/31 2021 : Roblox에서 작년 1월 28일에 72시간 동안 서비스가 안 되는 장애가 있었는데 그 원인과 상황을 정리한 포스트모템이 올라왔다. Consul의 새 스트리밍 기능을 도입하면서 과도한 경합으로 인한 성능 저하가 발생했고 이 문제가 Consul 내부의 구현 문제와 BoltDB의 문제였기 때문에 해당 문제를 찾아서 해결하는 데 오랜 시간이 걸렸다고 한다. 어떤 가설로 어떤 시도를 했는지가 자세히 나와 있어서 재미있게 읽었다. 더 자세한 내용은 한국어 요약 글을 살펴보길 바란다.(영어)
  • Postman Now Supports gRPC : API를 테스트할 때 많이 사용하는 Postman에서 gRPC를 지원하게 되어 gRPC를 개발할 때도 쉽게 테스트를 할 수 있게 되었다. 현재는 공개 베타 버전이다.(영어)
  • Announcing Quick Builder, a new low-code tool for you to build location-based experiences : Google Map에서 코드를 작성하지 않고도 위치기반으로 Google Maps에서 위치를 표시할 수 있도록 하는 Quick Builder를 공개했다.(영어)

인프라 관련

  • Announcing 100% Cloud Service Coverage for Crossplane : Crossplane이 Terraform의 프로바이더에서 Crossplane 프로바이더를 생성해주는 Terrajet을 만들었다. 이를 이용해서 provider-jet-aws, provider-jet-azure, provider-jet-gcp를 제공함으로써(기존 프로바이더는 jet이 안붙어있다) 클라우드 서비스의 리소스를 모두 지원할 수 있게 되었다.(영어)
  • Rancher Desktop 1.0.0 Has Arrived : Mac, Windows, Linux에서 Kubernetes와 컨테이너를 관리할 수 있는 Rancher Desktop을 Rancher에서 발표했다.(영어)
  • docker run 과 docker exec 재현을 통해 컨테이너 이해하기 : 컨테이너가 VM과는 달리 "격리된 환경에서 제한된 리소스로 실행되는 프로세스"라는 정의를 직접 실행해 보면서 이해하는 과정을 설명한 글이다. nginx 도커를 이용해서 실행한 후 네트워크 인터페이스를 확인한 후 컨테이너 이미지를 tar 파일로 추출해서 로컬에 추출한 뒤에 컨테이너를 실행하는 과정을 재현한다. 로컬에 파일 구조를 모두 풀었으므로 docker와 똑같이 docker0 네트워크 브릿지와 nginx 네임스페이스를 만들고 veth123456 인터페이스로 nginx 네임스페이스와 연결한 뒤 chroot로 nginx 프로세스를 실행하고 도커와 동일하게 실행되는지 확인한다. docker run은 재현했으니 docker exec도 컨테이너 안에 들어간다기보다 셸이 실행되는 것일 뿐을 보여주어서 컨테이너 구조를 이해하기 쉽다.(한국어)

IT 업계 뉴스

  • 마이크로소프트, 블리자드 82조 원에 인수한다 : Microsoft가 스타크래프트, 월드 오브 워크래프트, 디아블로, 캔디 크러시, 오버워치 등으로 유명한 액티비전 블리자드를 82조 원에 인수하게 되었다.(한국어)
  • An update from the Faker team : 메인테이너의 악의적인 행동으로 패키지가 삭제되었던 faker.js를 커뮤니티 팀에서 물려받아서 유지보수 하게 되었다. 8명이 메인테이너로 활동하게 되었고 open collective를 통해 faker에 기부하던 사람들도 open collective와 얘기가 되어 물려받게 되었다고 한다. 다만 기존에 쌓여있던 기부금은 커뮤니티 팀이 아니라 기존 메인테이너의 소유가 되고 새로 들어오는 기부금이 커뮤니티 팀을 후원하게 된다. 많이 사용하던 패키지라서 걱정했는데 커뮤니티 팀이 유지보수를 하게 되어 다행이다.(영어)
  • Do Svidaniya, Igor, and Thank You for NGINX : NGINX 웹서버를 만든 Igor Sysoev가 NGINX와 F5(NGINX, Inc를 인수한 회사)에서 물러나서 가족과 친구들과 시간을 더 보내고 개인 프로젝트를 하겠다고 밝혔다.

프로젝트

  • Fig : 터미널에서 VSCode 형식으로 자동완성을 해주는 도구.

버전 업데이트

2022/02/01 09:14 2022/02/01 09:14