자바스크립트 + 리액트 디자인 패턴

57

Chapter 05_

최신 자바스크립트 문법과 기능

5.6.2

화면에 보이면 가져오기

많은 컴포넌트는 처음엔 숨겨져 있다가 사용자가 아래로 스크롤하면 나타나도록 만들어지곤

합니다. 그러나 사용자가 항상 아래로만 스크롤하는 것은 아니기에 모듈을 지연 로딩으로 구

현하면 좋습니다.

IntersectionObserver

API

13

를 사용하면 컴포넌트가 화면에 보이는지 감

지할 수 있고, 이에 따라 모듈을 동적으로 로드할 수도 있습니다.

5.7

서버에서 모듈 사용하기

Node

14

15

.

3

.

0

버전 이상에서는 자바스크립트 모듈을 지원합니다. 모듈 기능은 정식으로

릴리즈되었으며

npm

패키지 생태계와 호환됩니다.

Node

는

type

이

module

이라면

.

mjs

와

.

js

로 끝나는 파일을 자바스크립트 모듈로 취급

15

합니다.

{

"name": "js-modules",

"version": "1.0.0",

"description": "A package using JS Modules",

"main": "index.js",

"type": "module",

"author": "",

"license": "MIT"

}

5.8

모듈을 사용하면 생기는 이점

모듈형 프로그래밍을 사용하면 다음과 같은 다양한 이점을 얻을 수 있습니다.

13

https

://

developer

.

mozilla

.

org ...