[Next.js] Next12 발표영상 후기

한국 시간으로 10월 27일, Next12의 발표가 있었다.

 

이 영상 썸네일은....

13층이랑 비슷한 느낌....

 

저번 Next conf와 동일하게 1시부터 시작을 했고, 저번의 경험으로 일찍 끝난다는걸 알고 있었기 때문에 보고 잤다.

 

 

2021 Next.js Conf 후기

 

Nextjs 자랑타임이 지나가고, 핵심 내용만 보도록 하자.

이번엔 한글 자막이 붙었다!!! Vercel에 한국인이 채용되어서 생긴 변화인가!?

1.

 

URL import (alpha)

 

말 그대로 url을 통한 js import 를 지원한다.

여기까지 보면 기존의 script tag 형식으로 가져오는것 이상으로 이게 큰 의미가 있나...? 싶을 수도 있는데, 일단 URL import를 하는 순간 로컬에서 원격 리소스 추적을 하는 next.lock 파일을 사용하고, 로컬에서 캐싱을 통해 로컬 타입추론등의 기능도 사용할 수 있는 것 같다.

게다가....

컴포넌트 자체를 import해서 사용하고, props를 넘겨보면서 확인하는 부분이...

이거 나중에 lottie처럼 component hub같은거 만들어서 공유해도 대박이겠는데? 라는 생각이 절로 드는 부분이었다.

또한 프로젝트 컴포넌트의 상당수를 URL import를 사용해서 가져온다면 번들 사이즈를 극단적으로 줄일 수 있을 것 같다.

 

후반부에 Framer와의 intergration에 대해서도 이야기 하는데, 최근 FeConf2021에서도 토스가 Framer로 미친 디자인 시스템 개선사항을 소개해준 부분이 생각났다. Zeplin -> figma -> 다음은 Framer인가...

 

2.

 

Rust Compiler (SWC)

 

바벨 포팅 Rust로 할 엄두를 낸 대학생...

바벨이 느리다고는 생각하고 있었지만 누가 이걸 처음부터 뜯어고쳐 개선할 생각을 쉽게 할 수 있을까?

이벤트 루프 기반의 node의 한계를 근본적으로 수정하려면 다른 언어를 사용해야 한다는 이야기, 그리고 그 언어로 Rust를 선택한 이유가 GC가 없어서라는 관점도 흥미로웠다.(2개 이상의 언어를 사용한 프로젝트에서는 메모리 관리가 자동으로 되는게 오히려 참조 오류를 일으킬 가능성이 높고, GC를 Block하는 로직을 만드는게 더 귀찮은 일이라 Rust를 사용했다고 한다)

 

지니어스!

 

 

3.

 

Next Live

 

저번 Conf에서 공개했던 툴이고, 이번에 github 연동까지 기능이 추가되었다는 내용.

 

 

4.

 

Vercel Check

 

CI-CD 과정에서의 추가적인 테스트를 통합하는 기능으로, Vercel에 도입되었다.

 

 

5.

 

Next.js Edge, Vercel middleware

 

서버리스 미들웨어의 도입.

aws 람다 function과 같은 Vercel만의 런타임을 도입했다.

국제화 서비스 등의 분기처리등에 유용하게 사용할 수 있을 것 같다.

관심사 분리와 성능의 측면에서 유용할 것 같다.

 

 

6.

 

React Server Component

Next.js 12

[react] React Server Component(RSC) 소개

 

와.... 이 부분에서 사실 놀란게, vercel이라는 회사는 정말 새로운, 도전적인 기술을 도입하는 속도가 빠르고 거침없이 도전하는구나 하는 생각이 들었다. 동시에 RSC 등을 도입하면, 점차 프론트 서버에서 하는 역할이 많아지면서 프론트엔드 개발자의 영향력도 커지겠구나 하는 생각이 들었다.

 

Device와 Network에서 탈 의존하려는 프론트엔드 개발의 미래를 본 느낌이었다.