자바스크립트 최적화

boyeonJ·2023년 4월 25일
0

JavaScript ETC

목록 보기
1/14

웹 애플리케이션들은 굉장히 크고, 대부분 자바스크립트로 만들어진 것이다. HTTP Archive가 보여준 자바스크립트의 평균 전송 크기는 약 533.8 KB이며 점차 증가하고 있는 추세이다.

심지어 이는 단순 전송속도이며 네트워크 전송될때는 주로 압축 되기 때문에, 압축을 풀고 나면 자바스크립트 실제 크기다 더 늘어난다.

자바스크립트는 수행하는데 비용이 많이 드는 자원이다. 다운로드하는 동안에만 잠깐 디코딩 시간이 발생하는 이미지와 다르게, 자바스크립트는 파싱되고 컴파일되고 마침내 실행된다. 바이트 단위의 전송은, 다른 종류의 자원보다 자바스크립트에서 더 많은 비용을 발생시킨다.

따라서 자바스크립트 엔진 효율성을 향상 시키기 위해 지속적인 개선이 이루어지고 있으며 자바스크립트 성능을 개선하기 위한 기술들도 많이 사용되고 있다. 그 예로는 아래의 것들이 있다.

  1. 코드 스플리팅 : 자바스크립트 청크로 애플리케이션을 분할하고, 청크를 필요로 하는 애플리케이션의 경로에만 이 청크들을 배분하여 성능을 개선하는 기술이다. 그러나 이 기술을 사용한다고 해서, 사용되지 않는 코드를 포함한 무거운 자바스크립트 애플리케이션의 일반적인 문제를 해결하지는 못한다.
  2. 트리 쉐이킹(Tree Shaking) : 위의 문제점을 해결해준다.

https://ui.toast.com/weekly-pick/ko_20180716
https://web.dev/reduce-javascript-payloads-with-tree-shaking/#go_shake_some_trees

0개의 댓글