웹사이트의 미래 호환성 유지 가이드 (MDN)
Source
Evernote/Technote scraps/Writing forward-compatible websites - MDN.md
Summary
이 문서는 브라우저 업데이트 시 웹사이트가 깨지지 않도록 하는 모범 사례를 제시합니다. 주요 내용은 다음과 같습니다: 1) JavaScript: 인라인 이벤트 핸들러(onclick 등)에서 전역 변수나 함수 호출 시 반드시 window. 접두사를 사용하여 이름 충돌을 방지해야 합니다. 제어할 수 없는 스크립트는 연결하지 않는 것이 좋으며, 사용하는 라이브러리도 이 가이드라인을 따르도록 요청해야 합니다. 2) 기능 탐지(Sniffing): 특정 객체나 기능의 존재가 다른 기능이나 버그의 유무를 의미한다고 가정하지 말아야 합니다. UA 스니핑은 피해야 하며, 불가피할 경우 과거 버전의 브라우저만 대상으로 해야 합니다. 브라우저별 별도 코드 경로를 만들지 말고 단일 코드 경로로 동작하도록 해야 합니다. 3) 테스트: Firefox, Chrome/Safari, Opera, IE 등 주요 엔진 모두에서 테스트해야 합니다. 단일 코드 경로가 모든 주요 엔진에서 작동한다면 미래에도 깨질 가능성이 낮습니다. 4) 브라우저 특정 기능: 현재나 미래 버전의 브라우저를 대상으로 한 해킹(hack)은 피해야 합니다.
Key Points
- 인라인 이벤트 핸들러에서 전역 변수/함수 접근 시
window.접두사 필수 사용 (이름 충돌 방지) - 제어할 수 없는 스크립트 연결 금지 (
use strict충돌 가능성) - 특정 기능 존재가 다른 기능/버그 유무를 의미한다고 가정 금지
- UA 스니핑 금지, 불가피할 경우 과거 버전 브라우저만 대상
- 브라우저별 별도 코드 경로 생성 금지, 단일 코드 경로 유지 권장
- 주요 브라우저 엔진(Firefox, Chrome, Safari, Opera, IE) 모두에서 테스트
- 현재/미래 버전 브라우저를 대상으로 한 해킹(hack) 금지