Internet Explore 호환 주의사항

웹개발의 웬수같은 Internet Explore.. 가끔 이걸 지원해달라는 회사때문에 참 고통이다.

크롬과 IE를 동시에 개발하면서 다른 점을 정리해보자

 

리액트를 사용하는경우 Polyfill을 통해 크로스 브라우징을 지원해주고 IE까지 변환해준다.

하지만 IE 브라우저 특성상 이상한 버그가 있기 때문에 주기적으로 IE 브라우저에서 테스트가 필요하다.

 

MOBX를 사용하는 경우 MOBX 4버전(나는 4.15.6로 개발함)을 통해 IE에서 사용 가능하다.

그 윗 버전은 동작하지 않는다ㅜ

 

MOBX 버전으로 인한 이슈

 

MOBX 4버전은 Observable한 데이터의 하위 구조까지 정확하게 구조를 명시해줘야

값이 변경되었을 때 렌더링을 수행한다.

 

만약 회사  > 부서 > 멤버의 변화에 따라 화면을 렌더링을 수행하게 하고 싶으면 아래와 같이 직접 명시해야한다.

@Observable

Company : { Department : { Memger: []}}}

 

MOBX 최신 버전은 Company 만 적어놓아도 하위 항목의 변화를 감지한 후 렌더링해준다.

 

IE 브라우저 캐싱으로 인한 이슈

 

크롬에서는 서버에서 정상적으로 응답을 주는데 IE에서는 정상적인 응답을 주지 않는 말도 안되는 경험을 할 수 있다.

IE에서는 렌더링이 수행되지 않고 F5를 눌러야만 정상적인 렌더링이 되는 신기한 경험을 한다면

IE 브라우저에서 동일한 서비스에 대한 서버 응답을 캐싱하고 그 캐싱한 데이터를 주기 때문에

정상적인 데이터를 받기 위해 캐싱을 하지 않도록 조치가 필요한 경우가 있다.

 

예를 들어 IE에서는 게시글을 등록했는데 등록하기 전 게시글 리스트가 출력되고

크롬에서는 정상적으로 동작한다면 캐싱문제다.