Node.js 20버전에 변경된 점들을 정리해보았습니다.

1. Node.js 개발자 되기 - 박승규
Node.js 20 버전에 변경된 것들

2. 목차
• 자기소개
• 프로세스 기반의 퍼미션 모델
• 커스텀 ESM 로더 훅의 안정화
• V8을 11.3으로 버전업
• 디렉터리를 재귀적으로 탐색가능
• 안정적인 테스트 러너
• Node.js 성능향상
• .env 지원을 내장
• 그외

3. 자기소개
• 이름 : 박승규
• 하는 일 : 카카오엔터테인먼트에서 CRM 백엔드 팀에서 팀장을 맡고 있음
• 해본 일 : 웹개발(IE와 jquery로 개발하던 시절), 플랫폼 개발, 인프라, 게임서버 개발
• 써본 언어들 : 자바, 자바스크립트, 파이썬, Go, kotlin, shell, php
• 활동들
• 발표 : 삶이 편해지는 백엔드 개발자 지식 https://www.slideshare.net/SeungKyooPark/pdf-81ec
• 유튜브 : 카카오 개발자 되는법 https://www.youtube.com/watch?v=4pv6vJgr4gU
• 책 : Node.js 백엔드 개발자 되기 https://www.yes24.com/Product/Goods/118379776
• 강의 : 초보 백엔드 개발자 로드맵, 파이썬, 그냥 재미로
• 슬라이드 : 파이콘2019 파이썬 3대장을 만나보자 https://www.slideshare.net/SeungKyooPark/
3-164797583
• 영상 : 파이썬으로 크롤러 만들기 https://www.youtube.com/watch?v=QAj1vbUdztQ

4. 프로세스 기반의 퍼미션 모델

5. 프로세스 기반의 퍼미션 모델
Node.js 20의 개선점으로 가장 먼저 소개된 기능

6. 프로세스 기반의 퍼미션 모델
퍼미션 = 권한

7. 프로세스 기반의 퍼미션 모델
퍼미션 모델?

8. 프로세스 기반의 퍼미션 모델
퍼미션 모델
실행중에 특정 리소스에 대한 접근을 제어하는 매커니즘

9. 프로세스 기반의 퍼미션 모델
어떻게? 프로세스 기반으로

10. 프로세스 기반의 퍼미션 모델
어떻게? 프로세스 기반으로
프로세스가 접근할 수 있는 리소스에 대한 접근을 제어 할 수 있다
리소스의 종류 - 파일, 프로세스, 스레드, 애드온

11. 프로세스 기반의 퍼미션 모델
어떻게?
--exprimental-permission 옵션사용
파일 권한 제어 --allow-fs-read/write
서브프로세스 생성 제어 --allow-child-process
워커스레드 접근 제어 --allow-worker

12. 프로세스 기반의 퍼미션 모델
test.txt 라는 파일을 읽는 코드
test.txt

13. 프로세스 기반의 퍼미션 모델
test.txt 라는 파일을 읽는 코드
test.txt
여기에 파일 리소스에 대한 퍼미션을 적용 해보자

14. 프로세스 기반의 퍼미션 모델
test.txt 라는 파일을 읽는 코드
test.txt

15. 프로세스 기반의 퍼미션 모델
test.txt 라는 파일을 읽는 코드
test.txt
Node가 실행하고자 하는 파일에 대한 권한도
주지 않으면 실행되지 않는다.

16. 프로세스 기반의 퍼미션 모델
권한 관련 옵션을 복수개 사용가능

17. 프로세스 기반의 퍼미션 모델
권한 제어 기능이 왜 필요하지?

18. 프로세스 기반의 퍼미션 모델
권한 제어 기능이 왜 필요하지?

19. 프로세스 기반의 퍼미션 모델
Node.js 창시자의 후회

20. 프로세스 기반의 퍼미션 모델
Node.js 창시자의 후회

21. 프로세스 기반의 퍼미션 모델
왜 지금일까요?

22. 프로세스 기반의 퍼미션 모델
왜 지금일까요?
경쟁자들

23. 커스텀 ESM 로더 훅의 안정화

24. 커스텀 ESM 로더 훅의 안정화
ESM 로더 훅 이란?

25. 커스텀 ESM 로더 훅의 안정화
ESM 로더 훅 이란?
ESM(EMCA Script Module)은
ES6의 표준 모듈 방식

26. 커스텀 ESM 로더 훅의 안정화
ESM 로더 훅 이란?
로더는 모듈을 불러오는 프로그램

27. 커스텀 ESM 로더 훅의 안정화
ESM 로더 훅 이란?
기존에 있는 코드 전 후로 추가할 수 있는
사용자 정의 함수

28. 커스텀 ESM 로더 훅의 안정화
ESM 로더 훅 이란?
ESM 모듈 임포트시 추가 가능한 사용자 정의 함수

29. 커스텀 ESM 로더 훅의 안정화
ESM 로더 훅 이란?
• ESM Loader Hook API는 18.6.0 에 릴리즈 했음
• 그런데 실수로 experimental을 빼먹고 릴리즈해서 옵션명이 --loader 가 됐음.
• 나중에 --experimental-loader를 추가
• 실수로 릴리즈 되어버려서 옵션 설명에는 --loader, --experimental-loader 둘다 병기
• Node.js 20 버전 이전까지는 메인쓰레드에서 로더 훅을 담당
• 대형 프로젝트에서는 훅을 처리하는데 시간이 많이 걸림.
• 그래서 별도의 쓰레드에서 처리하도록 Node.js 20버전에서 변경 -> import 성능향상

30. 커스텀 ESM 로더 훅의 안정화
ESM 로더 훅을 만들어 봅시다.

31. 커스텀 ESM 로더 훅의 안정화
ESM 로더 훅을 만들어 봅시다.
url에서 임포트하기
커스텀한 확장자명 사용하기

32. 커스텀 ESM 로더 훅의 안정화
url에서 임포트

33. 커스텀 ESM 로더 훅의 안정화
사용의 정의 확장자명

34. 커스텀 ESM 로더 훅의 안정화
URL이 https로 시작하는 경우

35. 커스텀 ESM 로더 훅의 안정화
URL에 andy가 있는 경우

36. 커스텀 ESM 로더 훅의 안정화
$ node --loader=./andy.mjs --experimental-loader=./url-loader.mjs main.js

37. 커스텀 ESM 로더 훅의 안정화
$ node --loader=./andy.mjs --experimental-loader=./url-loader.mjs main.js
(node:97037) ExperimentalWarning: `--experimental-loader` may be removed in the future; instead use `register()`:
--import 'data:text/javascript,import { register } from "node:module"; import { pathToFileURL } from "node:url"; register("./
andy.mjs", pathToFileURL("./")); register("./url-loader.mjs", pathToFileURL("./"));'
(Use `node --trace-warnings ...` to show where the warning was created)
load >> file:///Users/gyus/VSCode/jsbackend/nodejs20_major_features/esm-loader-hook/url-loader.mjs
load >> file:///Users/gyus/VSCode/jsbackend/nodejs20_major_features/esm-loader-hook/main.js
load >> andy:andy
foo.................
Hello Node.JS! I am Andy
// console.log(rightPad('foo', 20, '.'))
// test()

38. 커스텀 ESM 로더 훅의 안정화
$ node --loader=./andy.mjs --experimental-loader=./url-loader.mjs main.js
(node:97037) ExperimentalWarning: `--experimental-loader` may be removed in the future; instead use `register()`:
--import 'data:text/javascript,import { register } from "node:module"; import { pathToFileURL } from "node:url"; register("./
andy.mjs", pathToFileURL("./")); register("./url-loader.mjs", pathToFileURL("./"));'
(Use `node --trace-warnings ...` to show where the warning was created)
load >> file:///Users/gyus/VSCode/jsbackend/nodejs20_major_features/esm-loader-hook/url-loader.mjs
load >> file:///Users/gyus/VSCode/jsbackend/nodejs20_major_features/esm-loader-hook/main.js
load >> andy:andy
foo.................
Hello Node.JS! I am Andy
// console.log(rightPad('foo', 20, '.'))
// test()
뭔가 경고문구가 장황하게 뜬다

39. 커스텀 ESM 로더 훅의 안정화
$ node --loader=./andy.mjs --experimental-loader=./url-loader.mjs main.js
(node:97037) ExperimentalWarning: `--experimental-loader` may be removed in the future; instead use `register()`:
--import 'data:text/javascript,import { register } from "node:module"; import { pathToFileURL } from "node:url"; register("./
andy.mjs", pathToFileURL("./")); register("./url-loader.mjs", pathToFileURL("./"));'
(Use `node --trace-warnings ...` to show where the warning was created)
load >> file:///Users/gyus/VSCode/jsbackend/nodejs20_major_features/esm-loader-hook/url-loader.mjs
load >> file:///Users/gyus/VSCode/jsbackend/nodejs20_major_features/esm-loader-hook/main.js
load >> andy:andy
foo.................
Hello Node.JS! I am Andy
// console.log(rightPad('foo', 20, '.'))
// test()
--loader를 사용하지 말고 register() 를 사용하라는 뜻

40. 커스텀 ESM 로더 훅의 안정화
register()는 어떻게 사용할까?

41. 커스텀 ESM 로더 훅의 안정화
20.6.0에 --import 옵션이 생김

42. 커스텀 ESM 로더 훅의 안정화
20.6.0에 --import 옵션이 생김
커스텀훅을 별도 스레드로 실행하게 되면서
메인스레드와 연결고리가 필요한 상황
이때 사용하는 옵션.
--loader 옵션을 사용중이라면 옮길 것을 권장

43. 커스텀 ESM 로더 훅의 안정화
20.6.0에 --import 옵션이 생김
register.js
결과

44. V8을 11.3으로 버전업
• String.prototype.isWellFormed, toWellFormed 함수 추가
• Array와 TypedArrray 원본 배열을 변경하지 않고 새 배열을 생성하는 메서드 추가
• ArrayBu
ff
er와 SharedArrayBu
ff
er의 크기를 동적으로 변경하기
• 정규표현식에 v 플래그가 추가됨
• 웹어셈블리에서 꼬리 물기 최적화(Tail Call Optimization)를 적용

45. V8을 11.3으로 버전업
• String.prototype.isWellFormed, toWellFormed 함수 추가
isWellFormed
올바른 유니코드 문자열인지 확인하는 함수

46. V8을 11.3으로 버전업
• String.prototype.isWellFormed, toWellFormed 함수 추가
isWellFormed
올바른 유니코드 문자열인지 확인하는 함수
유니코드에서 사용하지 않는 문자열은?
U+D800부터 U+DFFF는 utf8에서 사용하지 않음

47. V8을 11.3으로 버전업
• String.prototype.isWellFormed, toWellFormed 함수 추가

48. V8을 11.3으로 버전업
• String.prototype.isWellFormed, toWellFormed 함수 추가
toWellFormed
잘못된 유니코드 문자열을 대체가능한 문자열로 변경
U+D800을 넣어보자.

49. V8을 11.3으로 버전업
• String.prototype.isWellFormed, toWellFormed 함수 추가
toWellFormed
잘못된 유니코드 문자열을 대체가능한 문자열로 변경
는 원래의 데이터가 손상되었거나 유니코드로 변환될 수 없는 문자를 대체하는 데 사용됨

50. V8을 11.3으로 버전업
• Array와 TypedArray 원본 배열을 변경하지 않고 새 배열을 생성하는 메서드 with 추가

51. V8을 11.3으로 버전업
• ArrayBu
ff
er와 SharedArrayBu
ff
er의 크기를 동적으로 변경하기

52. V8을 11.3으로 버전업
• 정규표현식에 v 플래그가 추가됨

53. V8을 11.3으로 버전업
• 정규표현식에 v 플래그가 추가됨
U+1F468
👨 man
U+1F3FE
🏾 어두운 피부색
U+200D
이모지 합성시 사용 ⚕의학기호
U+2695 U+FE0F
컬러이모지 표시

54. V8을 11.3으로 버전업
• 정규표현식에 v 플래그가 추가됨
합성이모지도 정규표현식으로 검사가능

55. V8을 11.3으로 버전업
• 웹어셈블리에서 꼬리 물기 최적화(Tail Call Optimization)를 적용

56. V8을 11.3으로 버전업
• 웹어셈블리에서 꼬리 물기 최적화(Tail Call Optimization)를 적용
꼬리 물기 최적화란?

57. V8을 11.3으로 버전업
• 웹어셈블리에서 꼬리 물기 최적화(Tail Call Optimization)를 적용
꼬리 물기 최적화란?
재귀 함수의 성능을 향상시키기 위한 기법
함수의 꼬리 부분(마지막)의 재귀호출을 최적화
함수의 마지막에 다른 함수를 호출 하는 방식으로 구현

58. V8을 11.3으로 버전업
• 웹어셈블리에서 꼬리 물기 최적화(Tail Call Optimization)를 적용

59. V8을 11.3으로 버전업
• 웹어셈블리에서 꼬리 물기 최적화(Tail Call Optimization)를 적용

60. V8을 11.3으로 버전업
• 웹어셈블리에서 꼬리 물기 최적화(Tail Call Optimization)를 적용

61. V8을 11.3으로 버전업
• 웹어셈블리에서 꼬리 물기 최적화(Tail Call Optimization)를 적용

62. V8을 11.3으로 버전업
• 웹어셈블리에서 꼬리 물기 최적화(Tail Call Optimization)를 적용
재귀 함수 호출시 스택오버플로 방지

63. 디렉터리를 재귀적으로 탐색가능

64. 디렉터리를 재귀적으로 탐색가능
recursive 옵션이 없는 경우

65. 디렉터리를 재귀적으로 탐색가능

66. 안정적인 테스트 러너
• 기존에는 테스트를 하려면 서드파티 라이브러리(jest, mocha등)가 필요했음.
• Node.js 20에 test_runner 모듈이 포함됨
• describe로 테스트 코드 블록을 구분할 수 있고, it 혹은 test 메서드로 테스트 코드 작성
• mock 기능이 추가됨. 클래스, 메서드, 타이머(20.4.0 에추가) 관련 모킹이 가능
• watch 모드 --watch 옵션으로 파일을 저장할 때마다 테스트를 실행
• 여러개의 테스트를 병렬로 실행가능
• --experiments-test-coverage 옵션으로 테스트 커버리지 확인 가능
• --test-concurrency 옵션으로 병렬처리 갯수 지정 가능

67. 안정적인 테스트 러너
계산기 클래스
계산기 테스트 블록

68. 안정적인 테스트 러너

69. 안정적인 테스트 러너
Http 클라이언트
Http 클라이언트 테스트

70. 안정적인 테스트 러너

71. 안정적인 테스트 러너
테스트 커버리지

72. Node.js 성능향상
• state-of-nodejs-performance-2023 에서 Node의 벤치마크를 확인가능
• Node 16, 18, 20에 대해 성능테스트를 진행
• 내용이 방대하여 파일시스템, 이벤트 타겟, HTTP, 기동시간, 모듈, 스트림, URL파싱, 버
퍼, 텍스트 인코딩/디코딩, Crypto.verify 만 정리

73. Node.js 성능향상 - 파일시스템
• 16 > 18 : 인코딩이 ascii인 경우 67% 빨라짐, utf-8인 경우 12% 빨라짐
• 18 > 20 : 인코딩이 ascii인 경우 -27% 느려짐, utf-8인 경우 3% 빨라짐

74. Node.js 성능향상 - 이벤트타겟
• 16 > 18 로 업그레이드시 14% 성능 향상
• 18 > 20으로 업그레이드시 213% 향상

75. Node.js 성능향상 - HTTP
• 16 > 18로 업그레이드시 8% 성능향상
• 18 > 20으로 업그레이드시 96% 성능향상.
• wrk로 측정시에는 9% 향상
• Express나 Fastify의 속도도 향상될까?
• Fastify의 경우에는 Node.js의 HTTP API를 아마 사용하지 않을것이라 관련없음.

76. Node.js 성능향상 - 기동시간
• 16 > 18 : 6% 빨라짐
• 18 > 20: 27% 빨라짐
• 서버리스 등에서 사용하므로 빠른 기동시간은 중요하다.

77. Node.js 성능향상 - 모듈
• require() 함수는 Node의 기동을 느리게하는 주범이었음
• 18버전에 비해 .js 파일은 4.2%, .json파일은 6.58%, 디렉터리 탐색은 9.5% 개선이 있
었음.
• 이는 초기 기동을 더 빠르게 해줌

78. Node.js 성능향상 - 스트림
• 스트림은 16에서 18버전으로 가면서 느려졌었음
• 20버전으로 가면서 다시 개선을 하여 느렸던 부분을 이전과 비슷한 수준으로 거의 개선함

79. Node.js 성능향상 - URL 파싱
• Node18에 Ada URL를 도입하면서 성능이 400%향상됨.
• Node20에서는 Ada2.0을 도입하면서 추가적인 성능 향상이 있었음

80. Node.js 성능향상 - 버퍼
• 버퍼는 바이너리 데이터를 다루는데 사용
• Node16에서 18로 업그레이드시 성능이 매우 떨어지는 현상이 있었음
• 20버전에서 느린 함수들을 다시 16버전의 수준으로 회복
• Bu
ff
er.toJSON() 함수는 16보다 88% 더 빠름

81. Node.js 성능향상 - 텍스트 인코딩 / 디코딩
• 16에서 18버전으로 가면서 simdutf를 도입하였고 364%의 성능개선이 있었음
• 18에서 20버전에서는 25%의 성능개선이 있었음

82. Node.js 성능향상 - Crypto.verify
• 디지털 서명을 만들고 확인하거나 암복호화 하는데 사용하는 함수
• Node14에는 OpenSSL 1.x를 사용했고
• Node16에서는 QUIC프로코콜을 도입. 그러나 여전히 OpenSSL 1버전을 사용
• Node 18에서 OpenSSL을 3.x (Over QUIC)으로 업그레이드 했으나. 성능이 초당 3만
개 처리에서 6~7천개 처리로 떨어짐. 아마도 OpenSSL의 버전 문제로 생각됨.

83. Node.js 성능향상 - 결론
Crypto.verify 이외에는 모든 성능이 개선됨
성능은 Node.js의 새로운 전략적 목표이고, 이에 성능팀이 생김

84. .env 지원을 내장
.env 파일
env-test.js
실행 및 결과
• 기존에는 dotenv패키지를 설치해야 했으나 --env-
fi
le 옵션을 사용하여 지원할 수 있게 변경
• .env 파일은 ini 파일 형식이어야한다

85. 그 외
• 단일 실행 파일을 만들기위한 SEA(single executable applications)
• Node.js 설치 없이도 동작하는 애플리케이션을 만들 수 있음
• 현재는 실험적 기능이며, 패키징을 하기 위해 수동으로 해야 하는 절차가 많음
• 개인적으로는 좋게 평가
• 웹의 크립토 API가 Node.js에서도 동작하도록 지원
• ARM64 윈도우 공식지원
• Node.js 내에 웹어셈블리 시스템 인터페이스(WASI) 구현 작업 진행중

86. 결론
공짜 점심은 아직도 있다
Node.js 20로의
업그레이드를 적극 검토해보시라

87. 예제 소스 코드
https://github.com/wapj/jsbackend/tree/main/nodejs20_major_features