js

개발에도 온고지신이 필요하다.

개발하는 가오나시 2023. 1. 13. 21:00

우리 같은 프론트 엔드 개발자는 새로운 것에 빨리 익숙해지고 빨리 적응해야하지만, 그렇다고 옛 것을 오래된 것 같이 뒷 방 늙은이 취급을 하면 안된다. 

 

왜냐하면, 우리는 다양한 디바이스의 다양한 os버전을 대항해야 하기 때문이다. 

지금이야 정말 다행이게도 IE가 죽어버려서 빡센 크로스 브라우징은 안하는 경우가 대부분이지만(우리회사는)

그럼에도 우리는 IOS버전, AOS버전 등 각 OS가 지원하는 브라우저에 맞게 js코딩을 해야한다.

 

최근에 엄청 삽질을 한 내 이야기이다.

앱에서 띄우는 웹뷰가 다 잘뜨는데 아이폰 특정 버전 이하에서 동작을 안하는 것이다. 이것도 꼴받는 게 NEXT.js 프로젝트 여서 에러가 나는 컴포넌트만 랜더링에 실패해서 'nextjs application error a client-side exception has occurred' 이런 에러문구만 보이는 것이다.

 

 물론 ErrorBoundary 세팅 안한 내 잘못이지만, 너무 너무 화가나는 것이다. 안드로이드는 잘 되는 데 왜 너만 안되서 밤 9시까지 퇴근을 못하게 하는가.

 

 다른 팀원 분들과 이야기를 하다가 너무 최신 코드를 쓴 게 아니냐? 라는 질문을 받자 그제서야 Array.findLastIndex라는 메소드를 사용한 것이 생각이 났다. 아니나 다를까

// https://caniuse.com/ 사이트 사용

IOS 15이하 버전 사파리에선 못쓰는 함수였던 것이다. 뒤에서부터 찾는 동작을 하는 함수니

  [...기존배열].lastIndexOf

이런 함수로 대체해서 동작하게 하니 문제 없이 잘 떴다. 그리고 더 찾아보니 intersectionobserver 이 함수도 IOS 12버전에서 지원하지 않아서 폴리필을 사용해야했다. 

 

이런 사건을 돌이켜 보면, 채신기술이다! 하고 좋아할 것이 아니라, 내가 사용할 수 있는 또 기존에 사용하는 사람들에게 영향은 없는 기술인지 생각하면서 도입해야 한다는 생각이 든다. 

'js' 카테고리의 다른 글

Nestjs로 aws EC2 instance 제어하기  (1) 2023.11.27
작업하던거 뒤로가기, 되돌리기 기능  (0) 2023.07.30
HTML string trim() 하기  (0) 2022.12.31
ajax 요청 보내기  (0) 2022.11.21
.env를 업데이트 해야..어?  (0) 2022.11.02