서론

현재 진행중인 프로젝트에서 크롬 익스텐션을 개발하였는데, 해당 파트를 담당했던 팀원이 고생을 많이 했던 기억이 있다. 나도 한 번 손을 보태보려 해봤지만, 구글에서 크롬 익스텐션의 버전을 변경하면서 기존 버전 코드를 legacy로 만들어 참고할만한 코드 수 자체가 적었다. 이런 급진적인 변화는 왜 했을까 원망스럽기도 했는데 유튜브를 돌아다니던 중 크롬 익스텐션 v3에 대해 구글 개발자가 설명하는 영상을 발견하여 자세히 파해쳐보자 결심했다.

해당 포스팅은 Chrome extension manifest V2-V3 migration 영상 및 구글 공식 문서를 번역한 글입니다. 번역 자체에 급급하여 내용이 매끄럽지 않을 수 있습니다.

크롬 익스텐션에 변화가 불어온 배경

구글에서는 크롬 익스텐션에 변화가 필요했던 가장 주된 이유로 웹의 진화를 꼽았다.

웹이 발전하면서 사람들이 인터넷으로 할 수 있는 것이 점점 더 많아지고, 갈수록 사람들 삶에서 중요한 부분을 차지하게 되었다. 그 중에서도 은행 업무나, 의료 기록과 같은 개인 정보와 밀접한 데이터들의 처리가 이루어지게 되면서 privacy나 security에 대한 표준이 점점 높아져갔다.

이러한 시대적 흐름에 맞추어 크롬 익스텐션은 해당 표준을 준수하는 데에 초점을 맞춘 새로운 버전을 내놓게 되었다. (더불어 익스텐션의 성능 개선에도 신경을 많이 썼다고 한다.)
이 부분은 뒷 부분에서 더 자세하게 설명한다.

manifest가 뭐야

뭐긴 뭐야 대단한 사람들이지~

manifest : root directory에 위치하는 extension을 정의하는 JSON 파일이다.
manifest v3 버전이라는 것은 manifest file 내에서 지정하는 manifest_version의 설정이 3으로 설정되어 있는 것을 의미한다.

{
	"manifest_version": 3,
}

이 manifest version 내에는 지원하는 웹, 브라우저 API, extension platform 등이 포함된다.

Manifest V3

Manifest v3는 Chrome 88 버전 이상부터 지원을 하고, 구글에서 Manifest V2를 deprecate 시키기로 결정하였기 때문에 앞으로 크롬 익스텐션을 개발하게 될 개발자들은 V3에 익숙해져야 한다.

2018년 EU와 GDPR에서 사용자 정보를 보호해야할 의무를 법적으로 지정하였고, 이에 2019년 민감한 정보 보호를 최우선으로 고려한 V3가 제안된다.

V3로의 주요한 변화 3가지를 살펴보도록 하겠다.

1. remotely-hosted code 불가

remotely-hosted code란 패키지 외부에 존재하는 별도의 Javascript 코드나 Wasm 파일을 로드하는 방식을 말하는 것으로 보인다. (서버로부터 가져오는 JS 파일이나 CDN으로 host되는 라이브러리를 사용할 수 없게 된다.) 개발자가 해당 패키지 내에 존재하는 Javascript만을 사용할 수 있도록 강제하면서 Chrome Web Store의 리뷰를 받지 않은 코드가 실행되지 않을 수 있고, 보안성 강화로 연결되게 하기 위한 의도인 것 같다.

이미 예전 버전으로 만들어진 크롬 익스텐션에 대해서는 다음의 대안들을 제안하고 있다.

• JSON과 같은 remote configuration 파일 런타임에 로드 및 캐싱하기
  : 해당 방법을 사용하면 extenstion은 이 캐시 configuration을 사용하여 어떤 기능을 도입할 것인지 결정할 수 있다.
• remote 서비스를 이용하여 로직 외부화하기(externalize)
  : 어플리케이션 로직을 remote 웹 서버로 옮기고 메시지를 전달하는 방식으로 변경하는 방법이다. 이 방식은 코드를 private하게 유지할 수 있고, Chrome Web Store에 재전송하는 부하를 피할 수 있다는 장점이 있다.
• third-party library에 bundle 사용하기
  : 리액트나 부트스크랩 등을 사용하고 있다면 minified 버전을 다운받아 프로젝트에 추가할 수 있다.

// third-party library bundle
<script src="./react-dom.production.min.js"></script>
<link href="./bootstrap.min.css" rel="stylesheet">

2. background page를 대신하는 service worker의 도입

크롬 익스텐션은 아주 초창기부터 background pages라는 것을 사용해왔는데, 이들은 다른 창이나 탭과 별도로 동작하면서도 이벤트에 대한 결과를 반영하는 데에 사용되었다. 하지만 background pages는 사용되지 않을 때에도 background에서 동작하게 되면서 지속적으로 리소스를 잡아먹는다는 문제가 있었다.

이에 대한 대안으로 service worker를 도입하게 되었다. service worker는 사용되지 않을 때에는 멈추고, 필요할 때에는 다시 시작되는 ephemeral한(= 순간적인) 특징을 지닌다.

발표자에 따르면 해당 변화에 대한 요구가 빗발쳤다고 하는데, 이에 service worker 기능을 잘 사용할 수 있도록 timeout을 개선하였다고 한다.

기존에는 5분의 의무적인 timeout이 존재하였으나 이를 제거하여 service worker가 계속 살아있을 수 있도록 하였다. 덕분에 native messaging과 같은 중요한 동작을 수행하던 중에 service worker가 멈추지 않도록 할 수 있었다.

추가로, Offscreen Documents API를 사용하게 되었는데,
이 API는 extension이 최소화된, 범위가 정해진 offscreen을 허용하여 extension이 service worker를 통해 DOM에 접근할 수 있도록 한다.

3. declarativeNetRequest

2018년 1월부터 2019년 6월까지 42%의 extension 서비스들이 webRequest API를 남용한 사유로 Chrome Web Store에 적발되었다.

webRequest API를 사용하면 브라우저는 extension에 요청을 보내는 네트워크에 모든 데이터를 전달한다. 그러면 extension이 이를 평가한 후 browser에 어떤 행동을 하라 일러주게 되는데, 이 때 host permission이 필요하게 되고, 각각의 네트워크 요청은 메인 extension 과정에서 평가하게 되면서 성능 저하로 이어질 수 있다. 즉, webRequest는 개발자를 편하게 만들어줌과 동시에 extension이 사용자가 웹에서 무엇을 하는지에 대한 모든 것을 읽을 수 있는 단점을 불러왔다.

webRequest API의 blocking version은 extension이 네트워크 요청을 intercept하거나 block하지 못하도록 한다. 심지어 페이지 내용을 altering하는 것도 불가능하게 한다. 이는 광고 차단 서비스와 같은 서비스에는 유용하지만 code injection이라는 위험이 존재하고, extension이 민감한 사용자 정보에 접근할 수 있다는 단점이 있다.

declarativeNetRequest는 webRequestBlocking과 흡사하지만 페이지 내용에 접근하지 않고도 네트워크 요청을 block시킬 수 있다. 또한, 사용자 정보에 대한 접근을 필요로 하지 않기 때문에, 사용자 권한을 요구할 필요가 없고, 성능적인 측면에서도 도움이 된다. (통계적으로 600배 빨랐다고 함.)

정리

번역 자체에만 몰입했더니 내용에 대한 이해 및 정리가 부족했던 것 같다. 좀 더 간략하게 정리해보면,

• 크롬 익스텐션은 manifest 버전이 v2에서 v3로 변경되었다.
• 변경 사항으로는
  1. remotely hosted code 불가 : 패키지 외부에 JS 파일을 로드해오지 못하도록 하여 구글이 검토한 코드만 사용할 수 있도록 함 (보안 강화 목적)
  2. service worker 도입 : 기존 사용하던 background page가 불필요한 상황에서도 동작하는 것을 개선하기 위해 도입함 (성능 개선)
  3. declarativeNetRequest : 페이지 내용 접근하지 않고도 네트워크 요청에 관여하여 사용자 정보 보호 및 extension에서 요청 평가하는 과정 생략이 가능해짐 (보안 강화 및 성능 개선)
  

전반적으로 성능 개선과 보안 강화에 초점을 맞추어서 업데이트를 진행하였음을 알 수 있다.

유튜브 댓글만 봐서는 우리 팀 크롬 익스텐션 개발자처럼 고통받는 사람들이 많은 것 같던데 정말 모두가 원하는 개선이었는지는...?ㅎㅎㅎ