브라우저가 다 한다, Baseline으로 짐 덜기

Smashing Magazine의 Jad Joubran이 '무심코 쌓인 npm 의존성'을 다시 들여다보자고 제안했습니다. 한때 라이브러리 없이는 어려웠던 기능들이 지금은 대부분 브라우저에 네이티브로 들어와 있어서, 웹 표준의 브라우저 지원 현황을 정리한 'Baseline'을 기준으로 의존성을 감사하면 기능 손실 없이 60~90KB(gzip)를 걷어낼 수 있다는 것입니다.

"'이건 라이브러리가 필요해'와 '브라우저가 알아서 한다' 사이의 간극은 계속 좁혀지고 있다."Jad Joubran, Smashing Magazine

왜 중요한가

Baseline은 WebDX 커뮤니티 그룹이 웹 기능을 '제한적 지원 → 새로 안정화(Newly available) → 널리 안정화(Widely available, 30개월 이상)'로 분류해, 폴리필 없이 써도 되는지를 한눈에 알려주는 신호등입니다. 번들이 커질수록 내려받기·파싱 비용이 쌓이는데, '이 기능은 이제 모든 엔진에 있다'는 근거가 명확해지면 감으로 미루던 의존성 제거를 자신 있게 결정할 수 있습니다.

실무 적용

저자는 구체적 교체 목록을 제시합니다 — 국제화는 timeago·numeral 대신 Intl 계열(RelativeTimeFormat·NumberFormat·DurationFormat)로 약 14KB, HTTP는 axios 대신 fetch+AbortSignal.timeout()으로 약 17KB, 모달·툴팁 같은 UI는 <dialog>·Popover API로 약 24KB, lodash.clonedeep은 structuredClone()으로 절감할 수 있습니다. 다만 무조건 걷어내면 안 됩니다 — fetch는 인터셉터·자동 재시도가 없고, 새 Temporal API는 아직 Safari 미지원이라 44KB 폴리필이 붙어 오히려 dayjs보다 무거워지므로 Baseline 진입을 기다리는 편이 낫습니다.

교차 참고

• web.dev: Baseline — 브라우저 지원 현황을 명료하게 정리하는 Baseline의 공식 설명을 함께 봅니다.
• MDN: Baseline (compatibility) — 개별 기능이 '널리/새로' 안정화됐는지 확인하는 기준을 보완합니다.

Wemeet의 관점

Wemeet은 '무엇을 더 넣을까'보다 '무엇을 이제 뺄 수 있나'를 묻는 감사가 성능의 진짜 지렛대라고 봅니다. 라이브러리는 한번 들이면 관성으로 남지만, 플랫폼은 조용히 앞서갑니다 — Baseline은 그 격차를 근거 있게 좁혀, 더 가벼운 웹을 자신 있게 배포하게 해줍니다.