🎲 똑똑하게 브라우저 폴리필(Polyfill) 관리하기

- 오래된 브라우저에서 최신 JavaScript 문법 실행을 위한 폴리필 문제에 대해 알아봅니다. --- 내가 만든 웹 애플리케이션은 안타깝게도 특정 브라우저에서 돌아가지 않을 수 있습니다. 브라우저의 종류, 그리고 버전마다 지원하고 있는 JavaScript의 사양이 다르기 때문인데요, 따라서 최신 JavaScript 문법을 구형 브라우저에서도 사용할 수 있도록 하기 위한 방법이 필요합니다. 그리고 이러한 구현체를 보통 폴리필(Polyfill)이라 부릅니다. 폴리필은 보통 JavaScript 프로토타입에 동일하게 동작하는 메서드를 정의하는 방식으로 이루어집니다. 덕분에 타겟으로 삼은 브라우저까지는 동일한 동작을 한다는 사실 보장할 수 있게 됩니다. 다만 폴리필로 구현된 메서드는 브라우저 자체에 내장된 함수에 비해서는 다소 느리기 때문에 폴리필이 많이 적용될수록 사용자의 경험이 나빠집니다. 사용자의 경험이 나빠집니다. 만약 요청한 브라우저에서 지원하는 문법인데도 불구하고 폴리필을 내려받으면 불필요하게 성능이 나빠지는 것이죠. 토스 팀에서는 브라우저 사용자 에이전트에 따라 동적으로 폴리필을 생성하는 서버를 직접 구축하는 방식을 통해 불필요한 폴리필을 내려받는 문제를 최소한으로 만들었습니다.