Outsider's Dev Story

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

기술 뉴스 #225 : 23-07-01

웹개발 관련

  • Making Figma better for developers with Dev Mode : Figma가 개발자 협업을 개선하기 위해 Dev Mode를 추가했다. Dev Mode를 사용하면 디자인 요소의 CSS, iOS, Android 코드 스니펫을 바로 얻을 수 있고 플러그인을 사용해서 GitHub, Jira, Linear 등과 연동해서 프로세스를 통합할 수 있다. 변수를 사용한 디자인 토큰도 추가되어 빌드 시 데이터로 사용할 수 있고 디자인의 진행 상황과 변경 사항을 쉽게 확인할 수 있도록 "ready for development"를 표시할 수 있고 diff를 쉽게 확인할 수 있게 되었다. 또한 VS Code 확장이 공개되어 VS Code 내에서 디자인을 바로 확인할 수 있게 되었다. Dev Mode는 현재 오픈 베타로 2024년부터는 유료 플랜에서만 Dev Mode를 사용할 수 있다.(영어)
  • Introducing HTTP/3 Prioritization : Cloudflare가 RFC 9218 HTTP Extensible Priorities를 지원하기 시작했다. 이는 서버에서 받을 응답의 우선순위를 지정해서 최상의 결과를 얻도록 하는 것이고 Cloudflare에 따르면 JavaScript 파일 다운로드와 실행 때문에 렌더링도 지연되었는데 이미지를 먼저 다운받도록 우선순위를 높인 결과 LCP(Largest Contentful Paint)가 37%나 개선되었다고 한다. HTTP/3의 우선순위 기능은 HTTP/2와 유사하게 클라이언트가 우선순위를 전송하면 서버가 이에 따라 응답 데이터를 보내는 방식으로 동작하지만, 구현은 달라졌습니다. 우선순위의 Urgency는 0~7의 숫자를 사용하고(0이 가장 중요, 기본값은 3) Incremental은 불리언 값으로(기본값은 false) true이면 스크리밍 처리가 가능하다는 의미이다. 이는 HTTP 헤더 필드나 HTTP/3의 PRIORITY_UPDATE로 지정할 수 있다.(영어)
  • Module Federation의 컨셉과 작동 원리 이해하기 : 모듈 단위로 배포 후 브라우저 런타임에서 합체시키는 Module Federation을 설명하는 글이다. Module Federation의 핵심 개념인 다른 앱에서 로드할 수 있는 단위인 Container, 다른 앱을 임포트할 때 생성되는 참조 관계인 Container References, 공유되는 의존성인 Share Scope를 설명하고 Webpack 5에서 Module Federation을 지원하기 때문에 어떻게 동작하는지 설명한다.(한국어)
  • Thoughts on Svelte(Kit), one year and 3 billion requests later : 촉박한 일정에서 만들어야 하는 프로젝트에 Svelte와 SvelteKit을 사용해 보고 그 경험을 공유하는 글이다. 작은 프로젝트부터 Svelte를 도입하기 시작했고 지금은 만족하고 있고 앞으로도 Svelte를 사용할 것이라고 한다. 좋은 점으로는 쉽고 간단해서 생산성이 좋고 HTML, CSS, JS에 약간의 지시문을 추가한 것이라 바닐라 라이브러리랑 잘 어울리고 Svelte 개발자는 별로 없지만 쉽기 때문에 금방 배울 수 있고 라우팅도 약간 이상하지만 배우기 어렵지 않다. 안 좋은 점은 생태계가 작아서 다른 라이브러리를 찾기가 어렵고 컴포넌트 수준의 SSR 지원이 없으며 아일랜드 아키텍처를 지원하지 않아서 페이로드를 줄이기가 어렵다고 한다. 더 나쁜 점으로는 Svelte의 개발자들이 사용률을 높이는데 큰 관심이 없어 보이고 리액티브 선언은 디버깅이 쉽지 않아서 남용하지 말아야 한다.(영어)
  • What is WebAssembly and where did it come from? : 어셈블리 언어의 성능은 얻으면서 아키텍처 종속성이 없도록 하기 위한 WebAssembly의 개념을 간단하게 설명하는 글이다. 첫 단계는 asm.js였는데 이는 asm.js의 AOT 컴파일 전략을 사용할 수 있었고 정적 타입 언어는 LLVM 기반의 Emscripten로 변환했다. WebAssembly는 저수준 어셈블리 유사 언어로 C/C++, Rust 등의 언어를 웹에서 실행할 수 있게 컴파일 타겟을 제공한다. 모듈식 시스템 인터페이스인 WASI로 브라우저가 아닌 환경에서도 실행할 수 있고 2015년 발표된 WebAssembly는 2019년 W3C recommendation이 되었다. WebAssembly는 textual와 binary 두 가지 표현이 있는데 textual 표현은 S-expressions에 기반하고 .wat 확장자를 사용하는데 텍스트이므로 직접 수정할 수도 있다. binary 표현은 .wasm 표현을 사용하고 wat2wasm 같은 도구로 textual 표현을 binary 표현으로 변환할 수 있다. 이 두 표현은 사람에게 친화적이지 않으므로 Emscripten 같은 컴파일러를 사용하는 방법을 설명한다.(영어)
  • W3C advances technology to streamline payment authentication : W3C에서 웹에서 결제할 때 인증을 간소화하고 보안을 강화하는 Secure Payment ConfirmationCandidate Recommendation로 바꾸었다.(영어)

그 밖의 개발 관련

  • TypeScript 5.2's New Keyword: 'using' : TypeScript 5.2에 추가될 using 키워드를 설명한다. 이는 TC39의 ECMAScript Explicit Resource Management 제안(Stage 3)에 기반한 것으로 JavaScript의 새로운 전역 심볼인 Symbol.dispose에 할당된 모든 것은 리소스로 간주되어 생명주기를 가진 객체로 인식되고 using 키워드로 사용할 수 있다. 파일 디스크립터를 닫거나 데이터베이스 연결을 종료하는 등 후처리 작업에 using을 사용하고 자동으로 처리할 수 있다. 비동기를 위한 Symbol.asyncDisposeawait using도 있다.(영어)
  • Buck2 Unboxing : Bazel의 엔터프라이즈 기능을 제공하는 BuildBuddy에서 Buck2 아티팩트 기반 빌드 도구의 성능과 장단점을 비교했다. Buck2는 Meta에서 Rust로 다시 만든 빌드 도구로 테스트 해보니 Bazel에 비해 훨씬 빨라졌고 원격 실행을 우선 지원하기 때문에 로컬 샌드박싱이 없어도 어색하지 않고 표준 API를 따르므로 BuildBuddy와도 바로 호환되며 CLI UX가 좋다. 단점은 빌드 내부가 여러 단계로 구성되어 있고 아직 빌드 텔레메트리를 제공하지 않으며 레퍼지토리 단계가 없어서 필요한 의존성을 설치하기가 어려운 부분이 있다.(영어)
  • Prisma Client Extensions Are Now Production Ready : Node.js ORM인 Prisma의 4.7.0에서 프리뷰로 공개되었던 클라이언트 익스텐션이 4.16.0에서 GA가 되었다. Prisma 클라이언트에서 $extends를 사용해서 원하는 메서드를 확장할 수 있다.(영어)
  • Developer tools to create spatial experiences for Apple Vision Pro now available : Apple Vision Pro의 앱을 만들 수 있는 visionOS SDK가 공개되었다.(영어)

인프라 관련

  • New tool to secure your GitHub Actions : GitHub Actions에서 보통 GITHUB_TOKEN을 사용해서 권한을 가져오는 데 필요한 것보다 많은 권한을 가지게 되는 경우가 많다. 필요한 최소한의 권한만 가질 수 있도록 actions-permissions를 오픈 베타로 공개했다. 여기에 포함된 Monitor action은 프락시를 통해서 워크플로가 사용하는 API 정보를 수집해서 이를 요약해서 보여주고 Advisor action은 로컬에서도 사용할 수 있는데 워크플로를 여러 번 실행해서 권장 사항을 요약해서 보여준다.(영어)
  • Elevating your Kubernetes Cluster’s Resilience: Pod Disruption Budget : Kubernetes에서 Pod의 안정성을 확보하기 위해 Pod Disruption Budget(PDB)을 사용할 수 있다. 파드는 의도한 작업이나 예상치 못한 문제로 중단될 수 있는데 PDB에서 항상 사용할 수 있어야 하는 최소 리플리카 수(min available)와 사용 불가능할 수 있는 최대 리플리카 수(max unavailable)를 지정해서 이 규칙을 위반하면 작업을 멈추게 한다. 안정성에는 중요하지만 PDB가 의도한 작업을 차단하거나 지연시킬 수도 있으므로 PDB의 동작을 잘 알고 사용해야 한다.(영어)
  • Understanding Kubernetes Pod Security Standards : Kubernetes의 Pod Security Standards를 사용하면 쉽게 클러스터 내의 워크로드에 표준 보안 요구사항을 적용할 수 있다. 이전에는 PodSecurityPolicy가 있었지만 v1.21에서 deprecated 되고 v1.25에서 제거되었고 대신 Pod Security Standards가 보안 요구사항을 지원한다. Pod Security Standards는 모범사례를 지원하도록 Privileged, Baseline, Restricted 3가지 프로파일을 지원하는데 Privileged는 권한 상승을 허용하므로 중요한 워크로드가 있는 제한된 경우에만 사용해야 하고 Baseline은 복잡하지 않게 보안을 유지할 때 적합하며 Restricted는 가장 안전한 프로파일이다. 파드 시큐리티 어드미션 컨트롤러를 사용하면 정책 위반 파드를 거부하는 Enforce, 허용은 하지만 로그 이벤트에 기록하는 Audit, 허용하지만 사용자에게 경고하는 Warn 제어 모드를 사용할 수 있다.(영어)

볼만한 링크

  • 주니어의 스터디 드라이븐 성장기 : IT 엔지니어로 2년간 일하면서 모르는 게 많아서 스터디를 시작한 뒤로 많은 스터디 모임을 계속하면서 배운 내용과 스터디 모임의 팁을 공유하고 있다. 발표 자료에 스크립트가 있어서 보기 편하고 그동안 학습하려고 노력하신 게 잘 느껴져서 분야에 상관없이 배울 게 많은 내용이다.(한국어)
  • Upgrade to Google Analytics 4 before July 1 : Google Analytics에서 4가 나오면서 GA4로의 이전을 계속 권하고 있었는데 7월 1일부터는 기존의 Universal Analytics는 더는 데이터가 수집되지 않는다.(영어)

IT 업계 뉴스

프로젝트

버전 업데이트

2023/07/01 20:51 2023/07/01 20:51