Outsider's Dev Story

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

기술 뉴스 #219 : 23-04-01

웹개발 관련

  • React Labs: What We've Been Working On – March 2023 : React에서 연구 및 개발 중인 프로젝트의 상황을 정리한 글이다.(영어)

    • React Server Components(RSC)는 새로운 애플리케이션 아키텍처로 미리 실행되어 번들에서 제외할 수 있고 서버에서 실행되므로 데이터 레이어에도 바로 접근할 수 있어서 서버 중심과 클라이언트 중심 양쪽의 장점을 모두 제공한다. 데이터를 가져올 때 async/await를 기본으로 도입했고 클라이언트에서 서버로 데이터를 보내는 방법을 찾고 있고 번들러 개발자와 협업해서 RSC 지원을 작업하고 있다.
    • Suspense가 있지만 여전히 CSS, 폰트, 이미지 로딩은 별도로 진행되므로 로딩 중 레이아웃 변경이 일어날 수 있으므로 CSS, 폰트, 이미지 로딩의 생명 주기를 Suspense와 완전히 통합하여 React가 콘텐츠 표시할 시기를 결정할 수 있도록 노력 중이고 에셋을 미리 로딩할 방법도 준비 중이다.
    • <title>이나 메타데이터는 <head>에 포함되므로 서드파티 컴포넌트로 메타데이터를 <head>로 이동시키거나 서버에서 랜더링 해서 내려주는 방식을 주로 사용하는데 둘다 단점이 있으므로 컴포넌트 트리 어디서나 메타데이터를 렌더링할 수 있는 기능을 준비 중이고 클라이언트, SSR, RSC 모두에서도 동일하게 동작할 것이다.
    • React Optimizing Compiler: React 최적화 컴파일러인 React Forget의 설계를 계속 개발하고 있고 이를 전에는 "자동 memoizing 컴파일러"라고 불렀으나 "자동 reactivity 컴파일러"라고 하는 것이 이해하기 더 좋다고 생각한다. 이는 상태가 바뀌어서 React가 다시 렌더링할 때 너무 많은 렌더링으로 인해서 memoization 처리해야 하는 것을 알아서 최적화해 준다. 작년부터 대대적인 리팩토링을 거쳐서 Meta 내 일부에서는 프로덕션에서 이미 사용 중이므로 성능이 입증되면 오픈소스로 공개할 예정이다. 컴파일러는 Babel에서 거의 분리되었지만 공용 인터페이스는 Babel과 다른 빌드 시스템 플러그인을 통해 이뤄진다.
    • 오프스크린 렌더링은 추가적인 오버헤드 없이 백그라운드에서 화면을 렌더링하는 새 기능이다. 대부분은 오프스크린 API를 직접 사용하진 않을 것이고 라우터나 UI 라이브러리에 통합되어 추가 작업 없이 이점을 누릴 수 있고 컴포넌트 작성 방식을 변경하지 않고도 오프스크린 렌더링을 할 수 있어야 한다. Meta 내부 실험 결과 긍정적인 성능 결과를 얻어서 올해 말에는 실험적 API와 RFC를 공개할 예정이다.
    • 트랜지션 트레이싱 API를 React의 트랜지션이 느리지는 시점을 감지하고 원인을 조사할 수 있는 API다. 초기 설계는 완료했고 RFC도 공개했지만 프로젝트는 보류 중이다.
  • Next.js client-only SPA example : Next.js에서 서버 없이 100% 정적 파일로만 클라이언트 측 SPA를 사용하는 방법에 대한 질문을 많이 받았지만 Next.js 문서에는 잘 나와 있지 않아서 Dan Abramov가 정리한 글로 설정에 대한 설명과 코드가 포함되어 있다. SPA라고 하더라도 index.html을 하나만 두는 구조보다 라우팅마다 HTML 파일을 갖는 게 더 좋은 구조라고 설명한다.(영어)
  • Rspack: 속도와 호환성에 초점을 둔 번들러 : Rust로 재작성된 Webpack 호환 번들러인 Rspack을 소개하는 글로 Wepack+swc와 비교해 cold start는 8배, HMR은 3배의 성능을 보여주고 있다. 아직 프로젝트 초기이긴 하지만 Turbopack과 달리 Webpack과의 호환을 어느 정도 염두에 두었기 때문에 기존 생태계를 어느 정도 유지할 것으로 보인다.(한국어)
  • react.dev : 새로운 React 사이트가 공개되어 기존 reactjs.org도 이제 react.dev로 리다이렉트 된다. 기존 사이트는 legacy.reactjs.org에서 볼 수 있다.(영어)
  • Introducing Nuxt DevTools : Nuxt가 발전하면서 추상화도 많아지기 때문에 사용하기는 편하지만, 내부를 이해하기에는 더욱 어려워지고 있는 문제를 해결하기 위해 Nuxt DevTools를 프리뷰로 공개했다. Nuxt 앱의 투명성을 높이고 병목 현상을 찾아주고 앱과 구성을 관리하는 데 도움을 준다.(영어)
  • Remix without Limits : Vercel에서 Remix 지원을 공개했다.(영어)

그 밖의 개발 관련

  • Twitter's Recommendation Algorithm : Twitter가 자사의 추천 알고리즘을 오픈소스로 공개했다. 트위터에서 For You 탭에 보여줄 트윗을 선정하는 알고리즘으로 후보 소스로 수억 개의 풀에서 1,500개의 트윗을 추출해서 보여주는데 트윗은 사용자가 팔로잉하고 있는 In-Network 소스와 팔로잉하고 있지 않은 Out-of-Network 소스 두 가지로 나누어서 50:50 비율로 선정하고 있다. In-Network 소스에서는 두 사용자 간의 상호 참여 가능성을 예측하는 모델인 Real Graph를 통해 트윗의 순위를 정한다. Out-of-Network 소스에서는 팔로우하지 않음에도 관련성을 찾아야 하므로 두 가지 방법을 사용하고 있다. 소셜 그래프를 통해 내가 팔로잉하는 사람들과 비슷한 관심사를 가진 사람들을 통해 실시간 상호작용 그래프를 유지하는 그래프 처리 엔진인 GraphJet을 개발했고 소셜 그래프보다 훨씬 큰 비중을 차지하는 임베딩 스페이스는 사용자의 관심사와 트윗의 관련도를 수치로 만들어서 145,000개의 커뮤니티를 3주마다 업데이트하고 있다. 이렇게 순위가 정해진 트윗을 최종적으로 필터링 및 정제를 거친 후 사용자에게 보여주는데 이 파이프라인이 하루에 약 50억 번 실행되고 평균 1.5초 이내에 완료되고 있다고 한다. 오픈 소스를 공개하면서 Elon Musk를 따로 처리하는 코드가 발견되어 논쟁거리가 되자 문제 되는 코드와 Git 히스토리를 정리해서 다시 올렸다.(영어)
  • JDK 20 G1/Parallel/Serial GC changes : JDK 20에서 Garbage Collector 관련해서 정리한 글로 Parallel GC는 Full GC 중 객체 처리의 병렬화로 GC로 인한 중단 시간이 20% 감소했고 Serial GC는 눈에 띄는 변경 사항은 없다. G1 GC에는 다음의 변경 사항이 포함되었다.(영어)

    • G1 네이티브 메모리 풋프린트를 Java 힙의 1.5까지 줄일 수 있게 됨
    • G1 정제 스레드 관리가 개선되어 애플리케이션이 CPU 사이클을 덜 사용하게 됨
    • G1은 GC 일시 정지 중 오버헤드를 줄이기 위한 로컬 할당 버퍼(PLAB)를 사용하는데 이 공간이 낭비되거나 부족한 현상을 줄이기 위해 PLAB의 크기를 조정하는 기능이 추가됨
    • Young generation의 크기 결정에 대한 예측 개선으로 GC 횟수가 감소
    • 예방적 GC를 기본적으로 비활성화
  • CodeQL zero to hero part 1: the fundamentals of static analysis for vulnerability research : GitHub에서 취약점 분석을 위해 제공하는 CodeQL을 설명하는 시리즈 글의 1편으로 취약점 분석의 발전 과정을 설명하고 있다. 사용자 입력이나 파라미터처럼 오염될 수 있는 "소스"와 취약점을 가질 수 있는 위험한 함수인 "싱크(sink)"가 있는데 소스에서 싱크까지 데이터 흐름이 이어졌을 때 취약점이 발생하게 된다. 문자열 매칭으로 이 소스와 싱크를 찾을 수는 있지만 오탐지가 너무 많기 때문에 토큰화를 통하면 소스와 싱크를 더 쉽게 찾을 수 있지만 데이터 흐름까지 추적하기는 어려웠습니다. 이를 해결하기 위해 추상 구문 트리(AST)를 구축하는데 제어흐름 그래프로 소스와 싱트의 데이터 흐름을 파악할 수 있기 때문에 여기 오염도(Taint) 추적을 통해 더 명확하게 소스와 싱크가 이어지는 취약점만 찾아낼 수 있게 되었다.(영어)
  • AI-enhanced development makes me more ambitious with my projects : 숙련된 개발자로서 ChatGPT나 GitHub Copilot을 사용하면 '뭔가를 알아내는' 시간을 크게 줄일 수 있기 때문에 아이디어가 있어도 투자할 시간 때문에 안 했던 프로젝트를 더 많이 할 수 있게 되었다고 한다. 예시로 ChatGPT의 대화 기록을 다른 데 아카이빙해두고 싶었는데 ChatGPT의 네트워크 통신을 보고 JSON 데이터가 오고 가는 것을 보았지만 이를 어떻게 가로채야 할지 몰랐다고 한다. 보통은 여기서 프로젝트를 그만두었겠지만, 이를 ChatGPT에 물어보니 원래 ChatGPT의 fetch 기능을 그대로 동작하면서 별도로 데이터를 저장할 수 있게 하는 함수를 작성해 주었고 CORS 처리도 알려주었기 때문에 금방 아이디어를 구현할 수 있었다고 한다.(영어)
  • On-Demand Code Review With ChatGPT : NearForm에서 코드 리뷰 과정을 개선하기 위해 ChatGPT로 코드 리뷰봇을 프로토타입한 과정이다. GitHub 앱으로 리뷰 봇을 만들어서 리뷰를 요청하면 코드 diff와 컨텍스트를 조합해서 OpenAPI에 요청을 보내고 이를 PR의 댓글로 달도록 구현했다. 코드 리뷰도 AI가 많은 것을 바꾸겠지만 프로토타이핑해보니 코드 컨텍스트에 대한 이해가 제한적이라 잘못된 제안을 하는 경우가 많았고 코드의 기밀성을 유지하기는 어려웠고 어떤 코드로 학습했는지 모르므로 편향성에 대해서도 알기 어려웠다고 한다.(영어)
  • ChatGPT plugins : OpenAI에서 ChatGPT의 기능을 확장할 수 있는 플러그인을 공개했고 현재는 승인받아야 개발할 수 있다. 첫 플러그인은 Expedia, FiscalNote, Instacart, KAYAK, Klarna, Milo, OpenTable, Shopify, Slack, Speak, Wolfram, Zapier이 만들었으면 OpenAI에서 직접 운영하는 web browser와 code interpreter 플러그인도 공개했다. web browser는 ChatGPT가 웹 검색을 할 수 있게 하고 code interpreter는 Python 코드를 실행할 수 있다.(영어)
  • GitHub Copilot X: The AI-powered developer experience : OpenAI와 협업해서 Codex 모델로 GitHub Copilot을 공개했지만, AI 기반 자동완성은 시작점에 불과했고 GitHub Next의 R&D 팀은 개발 라이프사이클 전체에 AI 지원을 받을 수 있도록 노력한 결과 GitHub Copilot X를 공개했다. GitHub Copilot X는 GPT-4 모델을 사용해서 VS Code와 Visual Studio에서 개발자 시나리오에 맞춰 GitHub Copilot Chat을 제공하고 GitHub Copilot Voice도 지원한다. Copilot for Pull Requests를 통해 Pull Requests를 GPT-4 모델 기반으로 AI가 작성한 설명을 지원한다. 또한 GitHub Copilot for Docs는 채팅 인터페이스로 문서에 대해 AI가 답변하도록 지원하며 React, Azure Docs, MDN을 지원하고 있으며 Copilot for CLI도 개발하고 있다. 각 서비스는 대기열에 추가해서 승인되면 사용할 수 있다.(영어)

인프라 관련

  • Istio Ambient Waypoint Proxy Made Simple : Istio Ambient에서는 기능이 보안 오버레이 레이어와 L7 처리 레이어로 분리되었는데 Waypoint 프락시는 여기서 워크로드의 L7 처리를 담당하는 선택적 컴포넌트로 Envoy 기반이다. 기존 Istio 사이드카 아키텍처에서는 클라이언트 프락시에 트래픽 정책이 있고 서버 쪽 프락시에 보안 정책이 있어서 확장성이나 디버깅 등에 어려움이 있었다. Waypoint 프락시는 서버 쪽에만 모든 정책이 적용되고 네임스페이스나 서비스 계정 단위로 관리할 수 있게 되었고 애플리케이션과 독립적이기 때문에 확장, 운영이 쉽고 사이드카가 없어서 리소스 측면에서도 절약된다.(영어)
  • March 20 ChatGPT outage: Here’s what happened :
    ChatGPT에서 오픈소스 라이브러리의 버그로 다른 사용자의 채팅 기록의 제목을 볼 수 있는 문제가 발생했고 그 포스트모템이다. 조사 결과 이 문제로 다른 사용자의 결제 정보를 볼 수 있는 가능성도 있었지만, 발생 조건이 까다로워서 실제로 확인된 사례는 아직 없다고 한다. Redis에 사용자 정보를 캐시하고 있는데 이번 버그는 Redis 클라이언트인 redis-py에서 발생한 것으로 연결 풀에서 연결을 재사용하면서 응답을 받기 전에 요청이 취소되면 다음 요청이 응답을 받게되어 발생했다고 하면 지금은 패치되었다.(영어)
  • Pyroscope and Grafana Phlare join together to accelerate adoption of continuous profiling, the next pillar of observability : Grafana가 Continuous Profiling의 시조 프로젝트인 Pyroscope를 인수했다. 작년에 Grafana는 Continuous Profiling를 위해 작년에 Phlare를 발표했으나 이번 인수로 두 프로젝트를 Grafana Pyroscope라는 이름으로 합친다.(영어)
  • Announcing Docker+Wasm Technical Preview 2 : 작년 말에 WasmEdge 런타임으로 Docker에서 Wasm 컨테이너를 실행하는 기능이 테크니컬 프리뷰로 공개 되었는데 WasmEdge 뿐 아니라 spin, slight, wasmtime 런타임이 추가되었다. 이 런타임은 모두 Wasm에 대한 containerd shim을 쉽게 만들 수 있는 runwasi 라이브러리를 사용하고 있다.(영어)
  • Amazon Linux 2023 발표 : AWS의 Amazon Linux의 새 버전 AL2023이 발표되었고 이제 2년마다 새로운 메이저 릴리스를 출시한다.(한국어)

볼만한 링크

  • TWENTY-FIVE YEARS OF CURL : curl을 만든 Daniel Stenberg이 25주년을 맞이하여 8.0.0을 릴리스하며 지난 25년의 curl 역사를 정리한 글이다. 27살에 처음 시작했는데 URL 전송 도구로 작게 시작해서 지금까지 계속 점진적이고 반복적으로 개선해 왔다고 한다. 한 번도 인기가 갑자기 증가한 적은 없고 지속해 늘어나서 지금은 모두가 사용하는 프로젝트가 되었고 curl이 자신의 인생이 되었다고 한다. 항상 쓰면서도 아주 간단한 CLI 도구로 생각하고 있었는데 25년간 지속해 개발한 노력이 정말 대단하다.(영어)
  • AI-imager Midjourney v5 stuns with photorealistic images—and 5-fingered hands : AI 이미지 합성 서비스인 Midjourney가 구독자를 중심으로 버전 5의 알파 테스트를 진행 중이라고 한다. v5는 일부 AI 아트 팬들이 너무 완벽해서 소름 끼칠 정도라고 표현했다고 한다.(영어)
  • Pause Giant AI Experiments: An Open Letter : 거대한 AI 실험을 최소한 6개월은 멈춰달라는 공개서한이 올라와서 서명을 받고 있다. 인간과 경쟁할 수 있는 지능을 갖춘 AI는 인류와 사회에 심각한 위험을 초래할 수 있으므로 계획되고 관리되어야 하지만 현재 그렇지 않다며 GPT-4보다 강력한 AI 시스템의 훈련을 최소 6개월 동안 중단해 달라고 요청하고 있다. 이 중단된 기간동안 독립적인 전문가에게 감사받고 AI 개발을 위한 공유 안전 프로토콜을 공동으로 개발해야 한다고 주장하고 있다.(영어)

IT 업계 뉴스

  • Gordon Moore, Intel Co-Founder, Dies at 94 : 무어의 법칙으로 유명한 Intel의 공동 창업자인 Gordon Moore가 지난 24일 94세의 나이로 세상을 떠났다. 삼가 고인의 명복을 빕니다.(영어)
  • Introducing Microsoft 365 Copilot – your copilot for work : Microsoft에서 워드, 엑셀, 파워포인트, 아웃룩, 팀즈 등 365 앱에서 AI의 도움을 받을 수 있는 Microsoft 365 Copilot을 발표했다. OpenAI의 ChatGPT처럼 Microsoft 365 Copilot를 이용하면 365를 쓰면서 글의 초안을 작성하거나 비즈니스 채팅으로 원하는 작업에 대한 답변을 받아서 생산성을 높일 수 있다.(영어)
  • Introducing Mozilla.ai: Investing in trustworthy AI : Mozilla에서 3천만 달러를 투자해서 신뢰할 수 있는 AI 제품 개발을 돕는 스타트업이자 커뮤니티인 Mozilla.ai를 공개했다.(영어)
  • We’re No Longer Sunsetting the Free Team Plan : Docker가 Free Team 플랜을 없애겠다고 했던 발표를 철회하기로 했다. 3월 중순에 Free Team 플랜 사용자에게 중지될 것이라고 공지했다는 얘기가 퍼지면서 큰 이슈가 되었다가 이는 무료 플랜을 없애는 게 아니라 Free Team 플랜은 Personal, Pro, Team, Business account, Open Source 플랜 중 하나로 처음부터 타게팅을 잘못해서 이를 없앴다는 거지 오픈소스 지원이 없애는 것은 아니었고 커뮤니케이션을 잘못했다고 사과 공지를 했다. 하지만 8일 뒤 종료 자체를 철회하기로 다시 결정했다.(영어)
  • Twitch CEO Emmett Shear is resigning : Twitch의 CEO이 Emmett Shear가 사입하기로 했다. Emmett Shear는 Justin.tv의 공동 창업자로 이후 게임에 집중하면서 Justin.tv가 Twitch가 된 후 Amazon에 인수되었다. 이후 CEO는 사장을 맡고 있던 Dan Clancy가 맡게 되었다.(영어)

프로젝트

  • Google Bard : Google에서 공개한 AI 챗봇으로 현재는 미국/영국에서만 지원하고 있다.
  • Adobe Firefly : 제너레이티브 AI를 이용한 이미지/비디오를 생성, 편집할 수 있는 도구로 현재 클로즈 베타 상태이다.
  • Markprompt : Markdown, Markdoc, MDX를 학습시켜서 문서에 대한 GPT-4 프롬프트를 제공하는 서비스.
  • Zed : GitHub에서 Atom을 만든 개발자가 새로 만드는 코드 에디터.
  • GitHub Actions for VS Code : VS Code에서 GitHub Actions 워크플로우를 관리하고 진행상태를 볼 수 있는 확장으로 GitHub에서 만들었다.
  • Burrow : Kafka 컨슈머의 Lag를 모니터링할 수 있는 오픈소스 프로젝트로 Linkedin에서 만들었다.
  • typst : LaTeX같은 마크업 기반 조판 시스템으로 논문, 리포트, 글을 작성할 수 있다.
  • KoAlpaca : Stanford Alpaca 모델을 학습한 방식과 동일한 방식으로 학습을 진행한, 한국어 Alpaca 모델.
  • chatgpt-action : Pull Request를 ChatGPT로 리뷰하는 GitHub Actions.
  • Vault Secrets Operator : Kubernetes 클러스터에서 시크릿을 동기화할 수 있는 오퍼레이터로 Vault 1.13에서 도입되었다.

버전 업데이트

2023/04/01 19:05 2023/04/01 19:05