이전에 Google Chrome 브라우저의 정책 변경으로 인한 Wijmo 업그레이드 및 workaround 방법을 안내드렸습니다. 

Google Chrome 브라우저의 정책 변경에 대한 전반적인 내용은 아래 공지사항에서 확인하시길 바랍니다.

• [중요!] Google Chrome 정책 변경으로 인한, Wijmo 업그레이드 및 코드 수정 안내

다만 workaround의 경우 다량의 코드를 변경해야 한다는 점이 부담이 될 수 있기에 부담을 덜어드리고자 간편하게 적용할 수 있는 polyfill를 안내드립니다. polyfill은 지원하지 않는 코드를 사용 가능하게끔 제공하는 코드로 polyfill 역할을 수행하는 대표적인 툴로 바벨이 있습니다.

polyfill를 사용할 때는 불러와야할 자바스크립트 코드가 많아지기 때문에 서비스 성능 자체가 나빠질 수 있다는 단점도 있습니다. 

더불어 이번 Google Chrome 브라우저에서 정책이 변경되는 이유 또한 기존 이벤트들의 성능 이슈가 있었기 때문에 퍼포먼스와 지속 가능성을 고려하시는 고객이라면 최신 버전으로 업그레이드를 추천드립니다.

소스코드 상에 polyfill 모듈 추가 

최신 Wijmo 버전으로 업그레이드 혹은 대체코드 적용이 어려우신 고객을 위해 브라우저에서 지원 중단한 코드를 사용할 수 있도록 도와주는  polyfill(mutation-events) 적용 방법을 안내드립니다.

* mutation-events에 대한 자세한 내용은 아래 글을 참고해주세요.

• mutation-events polyfill npm
• mutation-events github readme
• chrome developer 폴리필 지원 안내 

※주의!

mutation-events 폴리필은 BSD-3-Clause 라이선스입니다. 

해당 라이브러리를 사용하는 경우 라이선스 정책(저작권 표시 등)을 준수하여 사용해주셔야 합니다.

JS 프레임워크 별, polyfill 설정 안내 

React, Vue, Angular 프레임워크에서 Wijmo를 사용하는 경우에만, Chrome 정책 변경으로 인한 이슈가 발생하며, 아래의 polyfill를 적용하여 문제해결이 가능합니다.

* PureJS(일반 JavaScrirpt)기반에서 Wijmo를 사용하는 경우 해당되지 않습니다.

JS 프레임워크 별 방법: 

• React polyfill 코드
• Vue polyfill 코드
• Angular polyfill 코드 

React polyfill 코드 추가하기  

[package.json]  

mutation-events 설치

[index.js]

 mutation-events 가져오기

Vue polyfill 코드 추가하기  

[package.json]   

Angular polyfill 코드 추가하기  

[package.json]  

"options": {
            "main": "src/test.ts",
            "polyfills": "src/polyfills.ts",

import 'mutation-events';