22. 10월 스크랩

1. Papanasi - 여러 프레임워크에서 사용 가능한 프론트엔드 UI 라이브러리 (링크)

• Angular, React, Solid, Svelte, Vue 및 Web Components 에서 사용가능한 컴포넌트 세트들
• 미니멈 스타일 & CSS로 확장 가능
• 사용하기 쉬운 추가 테마들 제공
• StoryBook 과 호환

2. 만화로 보는 GIT 탄생 이야기 (링크)

• 리누스 토발즈는 리눅스 커널 개발을 시작하고 거의 10년 동안 CVS나 서브버전(SVN)과 같은 소스 관리 소프트웨어를 사용하지 않음.
• 대신 타볼(tarball)과 패치(patch)를 사용
• CVS의 문제는 파일 단위로만 변경이 추적 가능해서, single revision 단위로 큰 패치를 인식할 수 없음.
• CVS는 모든 작업이 서버에 이루어짐.
  • 리눅스 커널 처럼 큰 프로젝트에서 브랜치를 만들면 서버에 부하가 많이 걸려서 다른 작업에 영향을 줄 수 밖에 없음.
  • 머지 작업 역시 서버에서 처리하는데, 브랜치 머지는 시간이 너무 오래걸림.
• 2000년대 부터 사용되기 시작한 서브버전(subversion) 역시 분산환경을 지원하지 않음
• 2002년 리누스는 분산 환경을 지원하는 BitKeeper라는 독점 소프트웨어를 소스 관리툴로 선택
• 많은 커널 해커들이 이를 반대했고, 리버스 엔지니어링을 시도해 클론을 만드려는 시도가 있었음.
• 결국, 리눅스는 BitKeeper 사용을 중지하고 독자적인 코드 관린 툴 개발을 시작.
• 2005년 6월 리누스는 깃(Git)를 공개.

3. Three.js 대신 Babylon.js를 이용해야 하는 이유 (링크)

Babylon.js의 장점

• 2014년에 이미 TypeScript 기반으로 전환
• Three.js는 렌더링 레이어로 남는데 비해, 본격적인 게임엔진으로 포지셔닝
• WebGPU 도입에 있어서 좀 더 나아감
• 디버깅에 도움이 되는 더 고급 도구 내장
• 블렌더 애드온도 있음
• 커뮤니티 지원도 훌륭
• 현재 Three.js 커뮤니티의 모멘텀은 React-three-fiber 로 향하고 있는 듯해 보임

4. 새로운 검색엔진 UX (링크)

• 구글/위키피디아/트위터/유튜브/이미지/인스타그램/뉴스/레딧 결과를 한 페이지에 가로/세로로 나열해서 표시
  • 좌/우 스와이프 하면서 결과보기 가능
• 모바일에 최적화
• On/Off 기능 제공 : Safe Search, 자동완성, 개인화, 트위터/인스타그램 제외

5. Planyby - React용 Timeline 컴포넌트 (링크)

• EPG(프로그램 편성표), 스트리밍 타임라인, 컨퍼런스등의 멀티 진행 스케쥴, 뮤직이벤트 등을 표현 가능
• 가상 뷰로 대규모 데이터 처리 가능
• 써드파티 UI 와 쉽게 연동 가능

6. Next.js 릴리즈 (링크)

Next.js Conf 2022 에서 새로운 버전 13을 릴리즈. 그 동안 Vercel 에 새로 입사한 React, Turbo, 그리고 Webpack 개발자들의 역량을 총동원해서 새로운 기능들을 추가

app/ Directory:
- Layout: 리렌더링 방지를 기본으로 구현한 Layout
- Server Component: React 의 새로운 Server Component 지원하여 로딩 속도 개선
- Streaming: 점진적으로 스트리밍 되어 UI 렌더링 할 수 있는 Streaming
- React Suspense For Data Fetching: use hook 을 사용해서 fetch, cache, revalidate 를 컨트롤 가능. 기존 SSG, SSR, ISR 의 이점을 컴포넌트레벨에서 컨트롤 가능

 

Turbopack: 기존 Webpack 보다 700배 빠른 Rust 기반 Webpack 대체 도구. Webpack 메인테이너가 Turbo 아키텍처를 바탕으로 구현

next/image, next/font, next/link: Google Chrome 과 협업으로 기존 로딩 퍼포먼스를 저해하던 요소들을 개선. 빌드타임때 최적화를 시키면 특히 구글 폰트 같은 경우 내장을 시켜버림