Outsider's Dev Story

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

기술 뉴스 #274 : 25-07-16

웹개발 관련

  • <h1> 요소의 기본 스타일이 변경됩니다 : 기존에 h1 태그는 섹셔닝 요소의 충접 여부에 따라 다른 스타일이 적용되어 section > h1h2처럼 section > section > h1h3처럼 스타일 되었다. 이부분이 혼란스러웠기 때문에 2022년 HTML 스펙에서 제거되었고 최근 브라우저에도 적용되기 시작해서 중첩 여부와 상관없이 같은 스타일이 적용된다.(한국어)
  • Introducing Skia Graphite: Chrome's rasterization backend for the future : Chrome은 브라우저의 페인트 명령을 화면에 렌더링하는 레스터화(rasterization)에 초기부터 Skia를 사용했다고 하지만 성능 문제로 인해서 Ganesh라는 GPU 가속화 레스터화 백엔드를 만들게 되었지만, GL 기반의 특수 코드가 많아졌고 최신 그래픽 API를 사용하기도 어려웠습니다. 그래서 새로운 Graphite라는 GPU 레스터화 백엔드를 처음부터 다시 만들게 되었고 맥북에서 벤치마크 결과가 15%나 상승했다.(영어)
  • Liquid Glass, but in CSS : Apple이 이번에 발표한 Liquid Glass 디자인을 SVG 필터와 CSS를 이용해서 Liquid Glass 효과를 구현하는 방법을 설명한다. 여기서 설명하는 방식은 현재 Chrome에서만 동작한다.(영어)

그 밖의 개발 관련

  • Netflix Tudum Architecture: from CQRS with Kafka to CQRS with RAW Hollow : Netflix의 팬 사이트인 Tudum.com은 처음 만들때 유연한 시스템을 구축하기 위해 Server-Driven UI(SDUI)로 구성되어 CQRS를 선택해서 Kafka를 사용해서 업데이트된 컨텐츠를 Tudum에서 보여주도록 구성했다. 하지만 이 접근방식은 데이터가 수정되고 사용자게게 보여지기까지 시간이 걸리는 문제가 있었기 때문에 Netflix에서 인메모리 공동 배치 압축 객체 데이터베이스로 개발된 Raw Hollow를 도입해서 아키텍처가 간소화되고 거의 즉각적으로 미리보기를 보여줄 수 있게 되었다.(영어)
  • How Anthropic teams use Claude Code : Anthropic 내부에서도 Claude Code를 사용하기에 내부에서 어떻게 사용하는지를 설명한 PDF를 공개했다. 데이터 사이언티스트가 프로덕션 앱을 만들고 인프라스트럭처 팀은 Terraform plan의 영향도를 검토받고 마케터는 광고 워크플로우를 자동화하고 디자이너가 코드를 직접 배포하고 있다고 한다.(영어)
  • Proposal - Shift Node.js to Annual Major Releases and Shorten LTS Duration : 현재 Node.js는 짝수 버전이 LTS로 장기 지원을 하고 홀수 버전은 실험적인 상태를 유지하고 있는데 릴리스 주기가 너무 빈번해서 혼란을 야기하고 메인테이너의 부담을 가중 시키고 있기 때문에 연간 릴리스로 늘려서 짝수,홀수 구분 없이 매년 주요 릴리스를 LTS로 승격시키자는 제안이 올라왔다. 아직 논의가 진행중이지만 전반적으로 찬성하는 분위기이다.(영)
  • Introducing tmux-rs : Collin Richards라는 개발자가 터미널 멀티플렉서인 tmux를 C에서 Rust로 지난 6개월 동안 포팅해서 100% 코드베이스를 모두 포팅했다. 처음에는 C를 Rust로 변환하는 C2RUst로 시도했으나 불필요한 코드가 많아서 포기하고 수동으로 포팅하기로 결정하고 직접 포팅했다고 한다.(영어)
  • Kiro: 프로토타입에서 프로덕션 레벨까지 지원하는 스펙 기반 Agentic IDE 출시 : AWS에서 에이전틱 IDE인 Kiro를 발표했다.(한국어)
  • Opening up ‘Zero-Knowledge Proof’ technology to promote privacy in age assurance : Google에서 데이터를 교환하지 않고도 자신의 정보가 진짜임을 증명할 수 있는 영지식증명(ZKP) 라이브러리를 오픈소스로 공개했다.(영어)

인프라 관련

  • Load Balancing 100,000 WebSocket Connections: HAProxy vs. Nginx vs. Custom : 100k WebSocket 연결을 로드밸런싱 하기 위해서 HaProxy, Nginx, 자체 구현으로 대응하면서 비교한 결과다. WebSocket은 연결이 기존 서버에 유지 되어야 하기 때문에 커넥션이 늘어나면서 HAProxy를 도입했고 CPU가 15% 이하로 유지되며 메모리도 2GB로 작았지만 사용자가 NAT 뒤에 있는 경우 너무 많은 요청이 특정 서버에 몰리는 문제가 있었다. 이를 쿠키 기반으로 로드밸런싱하기 위해 Nginx의 stream을 사용해서 적용했을때 잘 동작했지만 HAProxy보다 40% 더 많은 메모리를 소비했다. 그래서 세션 기반으로 라우팅하는 경량 프록시를 Go로 구현했고 전체적으로 가장 안정적인 결과를 보여주었다.(영어)
  • Quicksilver v2: evolution of a globally distributed key-value store (Part 1) : Cloudflare 글로벌 네트워크의 핵심 저장소로 개발된 Quicksilver를 개선해 가는 과정으로 이 글에서는 v1과 v1.5를 다룬다. 모든 서버에서 전체 복제본을 가지고 업데이트하는 것을 Quicksilver v1이라고 불렀는데 비용이 커지면서 이를 개선하기 위해 1.5에서는 데이터를 저장하는 Replica와 영구 캐시 역할을 하는 Proxy로 나누어서 사용하지 않는 key-value를 제거해서 디스크를 아낄 수 있게 되었다. 이 변경으로 많은 문제가 있는데 RocksDB에 캐시된 키를 저장하게 하고 비동기 복제를 하면서 일관성을 유지하기 위해 MVCC와 슬라이딩 윈도우를 이용해서 일관성을 유지할 수 있게 되었고 각 서버는 Gossip 프로토콜을 이용해서 다른 노드를 찾을 수 있게 구성했다. 이에 따라 1.5에서는 디스크 공간을 크게 줄이면서 지연시간을 거의 변화 없게 유지할 수 있었다.(영어)
  • Driving Content Delivery Efficiency Through Classifying Cache Misses : Netflix는 Open Connect 프로그램을 통해서 전세계의 각 로컬 ISP와 파트너쉽을 맺고 맞춤형 서버 OCA를 제공해서 사용자에게 컨텐츠를 더 빠르게 제공하는데 OCA에 사용자가 요청했을때 OCA에서 바이트가 스트리밍 되지 않으면 캐시 미스로 기록한다. 이 캐시 미스에는 컨텐츠가 없는 경우와 OCA 하드웨어가 포화상태라 트래픽을 처리할 수 없는 경우로 구분한다. 이러한 캐시 미스 로그를 수집하여 선호도가 낮은 위치에서 스트리밍 되는 트래픽을 추적하여 효율성을 개선하는 피드백 루프로 사용하고 있다.(영어)
  • Behind the Streams: Three Years Of Live at Netflix. Part 1. : Netflix에서 3년을 준비한 라이브 스트리밍의 구조를 설명한 글이다. 전세계에 라이브 스트리밍을 하기 위해 AWS MediaConnect와 MediaLive로 프로그램을 트랜스코딩해서 라이브 오리진을 구성한 뒤 CDN인 Open Connect로 전세계에 라이브로 전송할 수 있도록 구성했다. 프로토콜은 HTTPS를 선택했고 SD부터 4K까지 다양하게 트랜스코딩해서 2초의 세그먼트 길이를 선택했다. 안정적인 서비스를 위해서 다양한 테스트를 실행했고 카오스 엔지니어링을 하면서 시청률을 예측했고 그래도 문제가 잇을 결우에는 점진적인 저하를 적용해서 라이브가 진행되도록 했다.(영어)
  • Cloudflare 1.1.1.1 incident on July 14, 2025 : 지난 7월 14일 UTC 기준 21:52부터 22:54까지 Cloudflare의 1.1.1.1 리졸버를 사용할 수 없는 장애가 발생했다. Cloudflare의 서비스는 전 세계에 제공하지만, 일부 서비스는 특정 지역으로 제한되는데 이는 데이터 현지화 제품군(DLS)의 일부이다. 6월 6일 DLS 서비스의 서비스 토폴로지를 준비하는 과정에서 1.1.1.1 리졸버와 관련된 접두사가 새로운 DLS 서비스의 접두사에 함께 포함되는 구성 오류가 발생했다. 이 새 DLS 서비스는 아직 사용되지 않아서 휴면 상태로 있었지만, 7월 14일 DLS의 구성을 변경하면서 1.1.1.1 IP가 실수로 포함되면서 리졸버가 중지되기 시작했다.(영어)
  • Introducing Amazon S3 Vectors: First cloud storage with native vector support at scale (preview) : AWS에서 벡터 스토리지인 S3 Vectors의 프리뷰를 발표했다.(영어)

AI 관련

  • Grok 4 : xAI에서 Grok의 추론 능력을 강화한 Grok 4를 공개했다. Grok 4는 도구 사용을 위해 강화 학습이 되었고 ARC-AGI V2에서 15.9%(Opus는 8.6%)를 기록했고 성능 향상 버전인 Grok 4 Heavy는 Humanity's Last Exam에서 최초로 50%를 기록했다.(영어)
  • Unpacking Claude’s System Prompt : Cluade의 유출된 시스템 프롬프르틑 분석한 글이다. 16,739 단어로 엄청나게 큰 시스템 프로프트를 가지고 있으며 가장 큰 영역은 MCP 서버 정보로 채워진 도구 정의이며 그 외에요 인용 지침, 아티팩트 지침, 검색 지침, Google 통합에 대한 주의 사항들로 채워져 있고 마지막 동작 섹션에서는 클로드가 어떻게 동작해야 하는지를 설명하면서 LLM의 단점을 보완하기 위한 다양한 핫픽스가 포함되어 있다.(영어)

볼만한 링크

  • The AI-Native Software Engineer : AI-Native 소프트웨어 엔지니어를 "AI가 나를 대체할 수 있다"라는 생각 대신 "AI가 이 작업을 더 빨리, 더 잘, 더 다르게 수행할 수 있을까"라고 매번 물어보면서 생산성을 높이는 엔지니어로 정의한다. 중요한 것은 AI를 대체가 아닌 협력자로 대하며 책임을 떠넘기지 않고 AI를 안내하고 결과물을 검증하는 책임을 지 된다. 그래서 모든 엔지니어는 관리자가 되어 모든 문제 해결과 소프트웨어 구축에 대한 사고방식에 AI를 내재화한다.(영어)
  • 뛰어난 성과를 내는 사람들은 왜 ‘주장’을 할까: 인사이트, 제안, 주장 그 차이 : 인사이트는 뭔가 관찰하고 짚어낸다는 의미이고 제안은 선택지를 몇 가지 추천하는 건데 주장은 더 나아가서 여기에 책임까지 지는 것이다. 주장에는 실행 중심의 태도와 확신이 담긴 관점과 책임감이 포함되는데 이러한 주장은 불확실한 상황에서 더욱 중요하며 프로라면 이러한 주장을 해야 한다고 얘기한다.(한국어)
  • 오픈AI의 개발자 문화 (번역) : OpenAI를 퇴사하는 직원이 OpenAI의 문화에 대해 정리한 글이다. 모든 업무를 Slack으로 진행하며 연구쪽은 완전히 바텀업으로 진행하며 실행을 중시하는 일단 해보자는 분위기라고 한다. 대신 회사 내부에서는 엄청난 정보 통제를 하고 매출 등의 수치는 엄격하게 보호되었다고 한다. 자신이 경험한 조직 중 가장 야심찬 곳이었으며 리더쉽은 존재감이 강하고 디테일까지 깊숙히 관여하고 있다. OpenAI는 Python으로 구성된 거대한 모노레포를 사용하면 FastAPI와 Pydantic을 사용하고 Azure에서 모든 것을 운영하고 있으며 중앙 협의체 같은 건 없고 일을 하겠다고 나서는 팀이 의사 결정을 내린다고 한다.(한국어)
  • Avoiding the ironies of automation : 장애 대응에 AI를 적용하는 스타트업인 incident.io에서 AI가 장애 대응이 도움이 되고 앞으로 점점 자동화가 될 것이지만 다른 측면에서는 자동화로 인해서 인간은 연습 부족 상태가 되어 시스템이 실패했을 때 대응이 더 부족해질 수 있다고 지적하고 있다. 이를 해결하기 위해 사람이 중심이 되고 AI 도구가 맥락을 지원하는 방식으로 강화하고 중요한 의사결정을 자동화하지 않고 AI가 판단한 이유를 투명하게 공개하며 사용자의 참여를 적극적으로 독려하도록 만들고 있다고 한다.(영어)
  • (번역)자바스크립트가 웹을 망가뜨렸습니다. (그리고 이를 진보라고 불렀습니다) : 웹을 앱처럼 만들기 시작하면서 많은 프레임워크가 등장하면서 웹의 기본 원칙에서 멀어졌다고 얘기하고 있다. 개발자 경험(DX)을 중시하면서 오히려 UX는 안 좋아졌고 기술은 복잡해졌으면 HTML과 메타데이터 등 과거에 있었으나 추상화와 복잡성을 추구하며 잃어버린 것들을 다시 복구하려고 노력하면서 강력한 자바스크립트를 잘못 사용하고 있다고 얘기하고 있다.(한국어)

IT 업계 뉴스

프로젝트

  • openobserve : Elasticsearch, Splunk, Datadog의 오픈소스 대안으로 로그, 매트릭, 트레이스, RUM, Error tracking, Session replay를 지원하는 옵저버빌리티 플랫폼.
  • Vue Bits : Vue.js의 UI 컴포넌트를 모아놓은 웹사이트.
  • Upyo : Node.js, Deno, Bun용 이메일 라이브러리.
  • zshy : 번들러 없이 tsc만으로 TypeScript를 트랜스파일할 수 있는 라이브러리.
  • xmcp : MCP 애플리케이션 프레임워크
  • FossFLOW : 인프라스트럭처 다이어그램을 그릴 수 있는 PWA
  • Octelium : 오픈소스 제로 트러스트 보안 엑세스 플랫폼

버전 업데이트

2025/07/16 23:25 2025/07/16 23:25