
요즘 한창 핫한 라이브러리가 있다!바로 Pretext로 AI를 중심으로 돌아가는 이 세상 속에서 순수한 JS 라이브러리가 이렇게 언급이 많이 된다는 게 신기하기도 하고 도대체 무슨 라이브러리이고 어떤 것들을 할 수 있는지 알아보고자 한다.
Pretext는 한마디로 "DOM 없이 텍스트 레이아웃을 계산하는 순수 자바스크립트 함수" 라고 할 수 있다.기존에는 요소의 높이를 측정하기 위해서는 요소가 화면에 그려진 후에 offsetHeight, clientHeight, getBoundingClientRect() 함수들을 이용해서 값을 가져올 수 있었다.즉, 정확한 요소의 주도권이 DOM에게 있는 상황이었고, 우린 그걸 매번 DOM에게 요청하곤 했다.
여기까진 그래서? 지금까지 잘 요청해서 가져왔고 문제 없지 않아?라는 생각이 들 수 있다. 하지만 위 함수들은 브라우저의 리플로우를 강제로 유발하는 함수들이다.