Skip to main content
공개 노트

browser-compat-db: 브라우저 호환성 데이터를 '파일'로 다루는 법

Views 62약 4분생성형 AI 활용
Summary

browser-compat-db: 브라우저 호환성 데이터를 '파일'로 다루는 법

웹 기능의 브라우저 지원 여부는 보통 MDN 문서나 호환성 표에서 확인합니다. 그러나 문서를 읽는 사람과 도구를 만드는 사람의 요구는 다릅니다. 사람에게는 표가 편하지만, 도구에는 반복해서 질의할 수 있는 데이터가 더 유용합니다.

simonw/browser-compat-db는 이 지점에 초점을 맞춘 프로젝트입니다. MDN의 browser-compat-data를 SQLite 데이터베이스로 변환해, 브라우저 호환성 정보를 SQL로 탐색할 수 있게 합니다. 원본 BCD는 Web API, CSS, HTML, JavaScript 등의 호환성 데이터를 담고 있으며 MDN, Can I Use, VS Code, WebStorm 등에서도 쓰입니다.1

핵심은 데이터의 출처가 아니라 형태다

browser-compat-db가 새로운 호환성 판단을 제공하는 것은 아닙니다. 핵심은 이미 공개되어 있는 MDN BCD 데이터를 SQLite라는 다른 형태로 옮긴 데 있습니다.

저장소 README 기준으로 데이터베이스에는 브라우저, 릴리스, 기능, 지원 여부 같은 테이블이 나뉘어 있습니다. 예를 들어 features는 약 1만 9천 건, support는 약 26만 건의 행을 담습니다.2 변환 스크립트는 sqlite-utils를 사용해 MDN BCD의 JSON 데이터를 SQLite 데이터베이스로 구성합니다.2

이 변화의 실용성은 분명합니다. JSON 트리를 직접 순회하지 않고도 SQL로 질문할 수 있습니다. 예를 들어 특정 브라우저에서 어떤 기능이 언제 지원되기 시작했는지, 실험적 기능이 어디에 모여 있는지, 특정 기능군의 지원 현황이 어떤지 같은 질문을 데이터베이스 질의로 다룰 수 있습니다.

SQLite 파일이 되면 달라지는 것

SQLite의 장점은 데이터베이스가 하나의 파일이라는 점입니다. browser-compat-db가 생성하는 데이터베이스는 약 66MB 규모이며, 내려받아 로컬에서 바로 분석할 수 있습니다.2 별도의 서버를 운영하거나 API 인증을 붙이지 않아도, 필요한 도구 안에 포함해 반복 조회할 수 있습니다.

이 방식은 특히 다음과 같은 작업에 잘 맞습니다.

  • 내부 문서나 코드베이스의 브라우저 호환성 점검

  • 특정 브라우저 버전을 기준으로 한 기능 목록 생성

  • 프런트엔드 지원 정책에 맞춘 리포트 작성

  • 정적 데이터셋을 기반으로 한 작은 개발자 도구 제작

즉, browser-compat-db는 “호환성 정보를 보여주는 사이트”라기보다 “호환성 데이터를 가져다 쓸 수 있는 파일”에 가깝습니다.

Datasette와 잘 맞는 이유

Datasette는 SQLite 위에서 데이터를 탐색하고 공개하는 도구입니다.3 Datasette 생태계에는 SQLite 데이터베이스를 생성하거나 조작하고, 다양한 소스의 데이터를 SQLite로 가져오는 도구들도 포함됩니다.3

이 관점에서 보면 browser-compat-db는 Datasette식 데이터 활용 방식과 자연스럽게 맞물립니다. GitHub Actions 워크플로는 데이터베이스를 빌드한 뒤 db orphan 브랜치로 force-push하며, 생성된 데이터베이스는 open CORS 헤더로 호스팅되어 Datasette Lite에서 탐색할 수 있습니다.2

결과적으로 사용자는 데이터베이스 파일을 직접 내려받아 로컬에서 다룰 수도 있고, 브라우저에서 Datasette Lite로 열어 구조와 내용을 빠르게 살펴볼 수도 있습니다. 처음부터 애플리케이션을 만들 필요 없이, 데이터의 형태와 쓸모를 먼저 확인할 수 있다는 점이 장점입니다.

적용 전 확인할 기준

browser-compat-db를 공식 호환성 API처럼 이해해서는 안 됩니다. 공식 데이터의 원천과 배포 경로는 여전히 MDN BCD와 npm 패키지입니다.1 이 프로젝트는 그 데이터를 SQLite로 변환해 활용성을 높이는 중간층에 가깝습니다.

따라서 실제 도구에 적용하려면 다음 기준을 확인하는 편이 좋습니다.

  • 데이터베이스가 필요한 주기로 갱신되는가

  • 스키마가 내 질의와 리포트 구조에 맞는가

  • 원본 MDN BCD를 직접 쓰는 것보다 SQLite가 더 단순한가

  • 로컬 파일 기반 조회가 API 호출보다 운영상 유리한가

이 기준을 통과한다면 browser-compat-db는 작지만 강력한 선택지가 될 수 있습니다. 공개 데이터를 다루는 방식은 데이터의 내용만큼이나 형식에 좌우됩니다. 같은 브라우저 호환성 데이터라도 JSON 저장소, npm 패키지, SQLite 파일은 각각 다른 개발 흐름을 만듭니다.

browser-compat-db의 가치는 거창한 플랫폼을 만든 데 있지 않습니다. 브라우저 호환성 데이터를 “읽는 자료”에서 “질문할 수 있는 파일”로 바꾼 점이 핵심입니다.

참고

1GitHub - mdn/browser-compat-data

2GitHub - simonw/browser-compat-db

3Datasette Tools

이 노트는 보도·비평·교육·연구 목적으로 작성되었습니다. 저작권 문의가 있으시면 에서 알려주세요.

틸노트는 사용자가 AI를 활용해 노트를 쉽게 작성하거나 편집할 수 있는 서비스입니다.

AI 스퀘어 단톡방에 함께해요

AI 활용과 틸노트 사용 팁을 나누는 오픈채팅방입니다. 입장 비밀번호는 tilnote입니다.

참여하기